【正社員】還元率83%【フリーランス】マージン一律5万円で案件をご紹介させていただきます。 詳細はこちら

【Android】<Kotlin>Spinnerを使ってプルダウン(ドロップダウンメニュー)を実装する方法や、選択時の処理について徹底解説!

【Android】<Kotlin>Spinnerを使ってプルダウン(ドロップダウンメニュー)を実装する方法や、選択時の処理について徹底解説!
すだ

みなさまこんにちは〜!
メモリアインクのすだです。

本日は、
KotlinのSpinner使ってプルダウン(ドロップダウンメニュー)を実装し 、選択時の処理を追加する方法を
実際のコードを利用して徹底解説していきます!

この記事を読んでわかること…
・Spinnerを使ったプルダウン(ドロップダウンメニュー)の実装方法
・アイテムの選択を感知する処理の実装方法
・プルダウン(ドロップダウンメニュー)のカスタマイズ方法

目次

環境

  • Kotlin (ver 1.9.0)
  • Android Studio (Giraffe | 2022.3.1 Patch 3)

Spinnerとは?プルダウン(ドロップダウンメニュー)の基本

Spinnerは、Androidのウィジェットの一つで、プルダウンメニューを提供するために使用されます。
ユーザーが選択肢を選ぶときに便利なUIコンポーネントで、設定画面やフォームなどでよく使用されます。

主な特徴

  • 選択肢をリスト形式で表示。
  • 初期選択値を設定可能。
  • アイテム選択時にイベントをトリガー。
【Android】<Kotlin>Spinnerを使ってプルダウン(ドロップダウンメニュー)を実装する方法や、選択時の処理について徹底解説!

Spinnerを使った基本的なプルダウン(ドロップダウンメニュー)の実装方法

それでは早速、プルダウン(ドロップダウンメニュー)を実装していきましょう!

レイアウトファイル ▼

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="16dp">

    <!-- プルダウンメニュー(Spinner) -->
    <Spinner
        android:id="@+id/mySpinner"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:spinnerMode="dropdown" />

</LinearLayout>

Kotlinコード ▼

class MainActivity : AppCompatActivity() {

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

        // Spinnerのインスタンスを取得
        val spinner = findViewById<Spinner>(R.id.mySpinner)

        // プルダウンメニューのデータ
        val items = listOf("選択してください", "オプション1", "オプション2", "オプション3")

        // アダプターを作成
        val adapter = ArrayAdapter(this, android.R.layout.simple_spinner_dropdown_item, items)

        // Spinnerにアダプターを設定
        spinner.adapter = adapter
    }
}

上記のように、選択肢にしたい項目をリスト形式にしてアダプターにセット、
そしてアダプターをSpinnerにバインドします。

ビルドすると以下の表示になります。

【Android】<Kotlin>Spinnerを使ってプルダウン(ドロップダウンメニュー)を実装する方法や、選択時の処理について徹底解説!

選択時の処理を実装する方法

続いて、選択されたタイミングで発火する処理を作っていきましょう。

例として、選択された選択肢名をトースト表示します。

spinner.onItemSelectedListener = object : AdapterView.OnItemSelectedListener {
    override fun onItemSelected(parent: AdapterView<*>, view: android.view.View, position: Int, id: Long) {
        // 選択されたアイテムを取得
        val selectedItem = parent.getItemAtPosition(position).toString()

        // 最初の項目以外が選択された場合に処理を実行
        if (position > 0) {
            Toast.makeText(this@MainActivity, "選択: $selectedItem", Toast.LENGTH_SHORT).show()
        }
    }

    override fun onNothingSelected(parent: AdapterView<*>) {
        // アイテムが選択されなかった場合の処理(通常は空でOK)
    }
}

1行目:

  • onItemSelectedListener は、Spinnerに設定するリスナーで、ユーザーがアイテムを選択したときに呼び出されます。
  • object : AdapterView.OnItemSelectedListener でリスナーインターフェースを実装します

2〜7行目:

  • onItemSelected は、Spinnerのアイテムが選択された時の呼び出されるメソッドです。
  • parent.getItemAtPosition(position)は、Spinnerの現在選択されているアイテムを取得します。
    アイテムを文字列として扱うため、toString()を使用しています。
  • positionは、選択されたアイテムのインデックス(0から始まる番号)です。
    (例: 最初のアイテムが選択されている場合、position == 0。)

12行目:

  • onNothingSelectedは、例えば 現在の選択が何もない状態になるような操作が行われた場合に呼び出されるメソッドです。
    (通常のSpinnerの挙動では、明示的に「選択を解除する」という操作はありません。)
  • 通常は特に処理を記述する必要はありませんが、必要に応じてデフォルト動作を指定することも可能です。

ビルドして操作すると、以下のようになります。

【Android】<Kotlin>Spinnerを使ってプルダウン(ドロップダウンメニュー)を実装する方法や、選択時の処理について徹底解説!

Spinnerのプルダウン(ドロップダウンメニュー)カスタマイズする方法

カスタムレイアウトの使用

プルダウン(ドロップダウンメニュー)に独自のデザインを適用するには、レイアウトを作成してアダプターに設定します。

カスタムレイアウト(例:res/layout/custom_spinner_item.xml)▼

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="8dp"
    android:textColor="@color/black"
    android:textSize="16sp" />

カスタムレイアウトを適用したコード ▼

val adapter = ArrayAdapter(this, R.layout.custom_spinner_item, items)
adapter.setDropDownViewResource(R.layout.custom_spinner_item)
spinner.adapter = adapter

setDropDownViewResource は、ArrayAdapter を使用して Android の Spinner にアイテムを設定する際、プルダウン(ドロップダウンメニュー)の各アイテムの表示レイアウトを指定するメソッドです。

ビルドすると、デフォルトの状態から以下のようにレイアウトが変更されています。

【Android】<Kotlin>Spinnerを使ってプルダウン(ドロップダウンメニュー)を実装する方法や、選択時の処理について徹底解説!

初期選択を設定する

Spinnerの初期選択値を特定の項目に設定できます。

spinner.setSelection(1) // インデックス1のアイテムを初期選択

まとめ

おつかれさまでした。いかがでしたでしょうか!

Spinnerは、簡単にプルダウンメニューを実装できる便利なウィジェットです。
この記事を参考に、アプリに最適なプルダウンメニューを作成してみてください!

すだ

技術者としてのキャリアパスを次のレベルへと進めたい皆様、
未経験からIT・Webエンジニアを目指すなら【ユニゾンキャリア】
を通じて、
自分の市場価値をさらに向上させてみませんか?

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

弊社テックブログをご愛読いただきありがとうございます。
当テックブログを運用している株式会社メモリアインクは、
【正社員】還元率83%
【フリーランス】マージン一律5万円で案件のご紹介
と、エンジニアの皆様に分かりやすい形で稼げる仕組みを構築し提供させていただいております。詳しくは弊社お問い合わせページ、プロフィールのQRコードを読み取り、LINEメッセージでお問い合わせいただけますと幸いです。

コメント

コメントする

目次