วิธีสร้าง Spinner พร้อมข้อความเริ่มต้น (Default Text) ใน Android ด้วย Kotlin

บทนำ

ตัวอย่างนี้สาธิตการสร้าง Spinner (Dropdown) ที่มีข้อความแนะนำเริ่มต้น เช่น "Select a player from the list" ใน Android โดยใช้ Kotlin

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

สร้างโปรเจกต์ใหม่ใน Android Studio

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

เพิ่มโค้ดใน res/layout/activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:tools="https://schemas.android.com/tools"
    android:id="@+id/linearLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="30dp"
        android:text="Spinner Sample Program"
        android:textColor="@android:color/background_dark"
        android:textSize="16sp" />

    <Spinner
        android:id="@+id/spinner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="10dp">
    </Spinner>

</LinearLayout>

ขั้นตอนที่ 3: MainActivity.kt

เพิ่มโค้ดใน src/MainActivity.kt:

import android.os.Bundle
import android.view.View
import android.widget.AdapterView
import android.widget.AdapterView.OnItemSelectedListener
import android.widget.ArrayAdapter
import android.widget.Spinner
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {
    lateinit var spinner: Spinner

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

        spinner = findViewById(R.id.spinner)

        val footballPlayers: MutableList<String?> = ArrayList()
        footballPlayers.add(0, "Select a player from the list") // ข้อความเริ่มต้นที่ index 0
        footballPlayers.add("Cristian Ronaldo")
        footballPlayers.add("Lionel Messi")
        footballPlayers.add("Neymar Jr")
        footballPlayers.add("Isco")
        footballPlayers.add("Gareth Bale")
        footballPlayers.add("Luis Suarez")

        val arrayAdapter: ArrayAdapter<String?> = ArrayAdapter(this, android.R.layout.simple_list_item_1, footballPlayers)
        arrayAdapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item)
        spinner.adapter = arrayAdapter

        spinner.onItemSelectedListener = object : OnItemSelectedListener {
            override fun onItemSelected(parent: AdapterView<*>, view: View?, position: Int, id: Long) {
                if (position == 0) {
                    // ไม่ทำอะไรเมื่อเลือกข้อความเริ่มต้น
                    return@OnItemSelectedListener
                }
                val item = parent.getItemAtPosition(position).toString()
                Toast.makeText(parent.context, "Selected: $item", Toast.LENGTH_SHORT).show()
            }

            override fun onNothingSelected(parent: AdapterView<*>?) {}
        }
    }
}

เทคนิค: ใส่ข้อความแนะนำ (Hint) ที่ index 0 ของ List แล้วตรวจสอบ position == 0 ใน Listener เพื่อไม่ให้ทำงานเมื่อเลือกข้อความเริ่มต้น

ขั้นตอนที่ 4: AndroidManifest.xml

ตรวจสอบการประกาศ Activity

การทดสอบ

รันแอป Spinner จะแสดง "Select a player from the list" เริ่มต้น กดเลือกนักฟุตบอลจะแสดง Toast ชื่อนักเตะ