วิธีดึงค่าจาก EditText ใน Android ด้วย Kotlin

บทนำ

ตัวอย่างนี้สาธิตวิธีการรับค่าข้อความจากช่อง EditText และแสดงผลใน TextView เมื่อผู้ใช้กดปุ่ม

ขั้นตอนที่ 1: สร้างโปรเจกต์ใหม่

ใน Android Studio เลือก File → New Project และตั้งค่าโปรเจกต์ตามปกติ

ขั้นตอนที่ 2: ออกแบบ Layout (activity_main.xml)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="50dp"
        android:text="Get EditText Value"
        android:textAlignment="center"
        android:textColor="@android:color/holo_green_dark"
        android:textSize="32sp"
        android:textStyle="bold" />

    <EditText
        android:id="@+id/editText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@id/button"
        android:layout_centerInParent="true"
        android:hint="Type something..." />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Get Value" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/button"
        android:layout_centerInParent="true"
        android:layout_marginTop="8dp"
        android:textColor="@android:color/background_dark"
        android:textSize="16sp"
        android:textStyle="bold" />
</RelativeLayout>

ขั้นตอนที่ 3: เขียน Logic (MainActivity.kt)

import android.os.Bundle
import android.widget.Button
import android.widget.EditText
import android.widget.TextView
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {
    private lateinit var button: Button
    private lateinit var editText: EditText
    private lateinit var textView: TextView

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        title = "EditText Demo"

        button = findViewById(R.id.button)
        editText = findViewById(R.id.editText)
        textView = findViewById(R.id.textView)

        button.setOnClickListener {
            val inputText = editText.text.toString()
            textView.text = inputText
        }
    }
}

ขั้นตอนที่ 4: ไฟล์ Manifest

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="com.example.edittextdemo">
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

การทำงาน

เมื่อรันแอป ป้อนข้อความในช่อง EditText แล้วกดปุ่ม "Get Value" ข้อความจะแสดงใน TextView ด้านล่างทันที