[Android] プルダウンで項目選択できるSpinnerをアプリに設定する

ユーザーにちょっとした項目を選択してもらいたいときに便利なのは Spinner です。プルダウンで選択項目が現れる簡単なアプリを作ってみましょう。

Android Studio
2024.1.1

Spinner

レイアウトにスピナーを追加するには <Spinner /> の要素で行います。
　

<Spinner
        android:id="@+id/spinner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

<Spinner

android:id="@+id/spinner"

android:layout_width="wrap_content"

android:layout_height="wrap_content" />

　
また、Spinnerの構成は ListView に似ています。
　

目次
1. 選択肢を設定
2. Spinnerのインスタンス生成、Adapterを設定
3. 選択肢が選択された時の処理
4. サンプルコード
5. 文字列リソースのケース

選択肢を設定

選択させたい項目を作ります。例えば配列
　

String[] spinnerItems = {
　　　　"Spinner", 
　　　　"Spinner 1", 
　　　　"Spinner 2", 
　　　　"Spinner 3"
};

String[] spinnerItems = {

　　　　"Spinner",

　　　　"Spinner 1",

　　　　"Spinner 2",

　　　　"Spinner 3"

};

　
この項目の作成方法は色々あります。
resourceでリストを作ったり、Spinnerに要素をaddしたり。
要素を把握しやすいのでいつもArrayList、あるいは配列にしますが
文字列リソースで作成することもかのうです。

Spinnerのインスタンス生成、Adapterを設定

ArrayAdapterに設定します。
これを使うと、その選択肢を良い具合に並べて設定をしてくれます。
　

ArrayAdapter<String> adapter = new ArrayAdapter<>(
    this, 
    android.R.layout.simple_spinner_item, 
    spinnerItems
);

ArrayAdapter<String> adapter = new ArrayAdapter<>(

this,

android.R.layout.simple_spinner_item,

spinnerItems

);

　
simple_spinner_item はプラットフォームによって提供され、デフォルトのレイアウトとして使用できます。レイアウトを自分で作成する必要はありません。
　

adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

1	adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

　
setDropDownViewResource(int) 、ユーザーが選択しようとするときにドロップダウンによりリストを表示するのに使うレイアウトを指定します。
　
simple_spinner_dropdown_item もプラットフォームで定義された標準的なレイアウトですので、このレイアウトも作る必要はありません。

選択肢が選択された時の処理

Spinner にリスナーを登録、選択された場合の挙動を記述します。
Spinnerオブジェクトが on-item-selected イベントを取得する時にAdapterView.OnItemSelectedListener インターフェースと、対応する onItemSelected() コールバックメソッドを実装します。
　

// リスナーを登録
spinner.setOnItemSelectedListener(new OnItemSelectedListener() {
    //　アイテムが選択された時
    @Override
    public void onItemSelected(AdapterView<?> parent, 
                                View view, int position, long id) {
        Spinner spinner = (Spinner)parent;
        String item = (String)spinner.getSelectedItem();
        //textView.setText(item);
    }

    //　アイテムが選択されなかった
    public void onNothingSelected(AdapterView<?> parent) {
        //
    }
});

// リスナーを登録

spinner.setOnItemSelectedListener(new OnItemSelectedListener() {

//　アイテムが選択された時

@Override

public void onItemSelected(AdapterView<?> parent,

View view, int position, long id) {

Spinner spinner = (Spinner)parent;

String item = (String)spinner.getSelectedItem();

//textView.setText(item);

}

//　アイテムが選択されなかった

public void onNothingSelected(AdapterView<?> parent) {

}

});

サンプルコード

まとめてみるとこうなります
　
MainActivity.java

//package com.example.testspinner;

import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.TextView;

import androidx.activity.EdgeToEdge;
import androidx.appcompat.app.AppCompatActivity;
import androidx.core.graphics.Insets;
import androidx.core.view.ViewCompat;
import androidx.core.view.WindowInsetsCompat;

public class MainActivity extends AppCompatActivity {

    // 選択肢
    private final String[] spinnerItems = {"Spinner", "Android", "Apple", "Windows"};
    private TextView textView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        EdgeToEdge.enable(this);
        setContentView(R.layout.activity_main);
        ViewCompat.setOnApplyWindowInsetsListener(findViewById(R.id.main), (v, insets) -> {
            Insets systemBars = insets.getInsets(WindowInsetsCompat.Type.systemBars());
            v.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom);
            return insets;
        });

        textView = findViewById(R.id.text_view);

        Spinner spinner = findViewById(R.id.spinner);

        // ArrayAdapter
        ArrayAdapter<String> adapter
                = new ArrayAdapter<>(this,
                android.R.layout.simple_spinner_item, spinnerItems);

        adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

        // spinner に adapter をセット
        spinner.setAdapter(adapter);

        // リスナーを登録
        spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
            //　アイテムが選択された時
            @Override
            public void onItemSelected(AdapterView<?> parent,
                                       View view, int position, long id) {
                Spinner spinner = (Spinner)parent;
                String item = (String)spinner.getSelectedItem();
                textView.setText(item);
            }

            //　アイテムが選択されなかった
            public void onNothingSelected(AdapterView<?> parent) {
                //
            }
        });
    }
}

//package com.example.testspinner;

import android.os.Bundle;

import android.view.View;

import android.widget.AdapterView;

import android.widget.ArrayAdapter;

import android.widget.Spinner;

import android.widget.TextView;

import androidx.activity.EdgeToEdge;

import androidx.appcompat.app.AppCompatActivity;

import androidx.core.graphics.Insets;

import androidx.core.view.ViewCompat;

import androidx.core.view.WindowInsetsCompat;

public class MainActivity extends AppCompatActivity {

// 選択肢

private final String[] spinnerItems = {"Spinner", "Android", "Apple", "Windows"};

private TextView textView;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

EdgeToEdge.enable(this);

setContentView(R.layout.activity_main);

ViewCompat.setOnApplyWindowInsetsListener(findViewById(R.id.main), (v, insets) -> {

Insets systemBars = insets.getInsets(WindowInsetsCompat.Type.systemBars());

v.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom);

return insets;

});

textView = findViewById(R.id.text_view);

Spinner spinner = findViewById(R.id.spinner);

// ArrayAdapter

ArrayAdapter<String> adapter

= new ArrayAdapter<>(this,

android.R.layout.simple_spinner_item, spinnerItems);

adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

// spinner に adapter をセット

spinner.setAdapter(adapter);

// リスナーを登録

spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {

//　アイテムが選択された時

@Override

public void onItemSelected(AdapterView<?> parent,

View view, int position, long id) {

Spinner spinner = (Spinner)parent;

String item = (String)spinner.getSelectedItem();

textView.setText(item);

}

//　アイテムが選択されなかった

public void onNothingSelected(AdapterView<?> parent) {

}

});

}

　
activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#00f"
        android:textSize="40sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.2" />

    <Spinner
        android:id="@+id/spinner"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:background="#fff"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.3" />
</androidx.constraintlayout.widget.ConstraintLayout>

<?xml version="1.0" encoding="utf-8"?>

<androidx.constraintlayout.widget.ConstraintLayout

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:id="@+id/main"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity">

<TextView

android:id="@+id/text_view"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#00f"

android:textSize="40sp"

app:layout_constraintBottom_toBottomOf="parent"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintRight_toRightOf="parent"

app:layout_constraintTop_toTopOf="parent"

app:layout_constraintVertical_bias="0.2" />

<Spinner

android:id="@+id/spinner"

android:layout_width="200dp"

android:layout_height="wrap_content"

android:background="#fff"

app:layout_constraintBottom_toBottomOf="parent"

app:layout_constraintLeft_toLeftOf="parent"

app:layout_constraintRight_toRightOf="parent"

app:layout_constraintTop_toTopOf="parent"

app:layout_constraintVertical_bias="0.3" />

</androidx.constraintlayout.widget.ConstraintLayout>

文字列リソースのケース

配列ではなく文字列リソースで作成するときはこのようになります。

res\values\
その下に例えば planets_array.xml を作成して以下のように記述します。
　
planets_array.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="planets_array">
        <item>Mercury</item>
        <item>Venus</item>
        <item>Earth</item>
        <item>Mars</item>
        <item>Jupiter</item>
        <item>Saturn</item>
        <item>Uranus</item>
        <item>Neptune</item>
    </string-array>
</resources>

<?xml version="1.0" encoding="utf-8"?>

<string-array name="planets_array">

<item>Mercury</item>

<item>Venus</item>

<item>Earth</item>

<item>Jupiter</item>

<item>Saturn</item>

<item>Uranus</item>

<item>Neptune</item>

</string-array>

</resources>

　
Spinnerを以下のように設定します。

Spinner spinner = findViewById(R.id.spinner);

// Create an ArrayAdapter using the string array and a default spinner layout
ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this,
        R.array.planets_array, android.R.layout.simple_spinner_item);
// Specify the layout to use when the list of choices appears
adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
// Apply the adapter to the spinner

spinner.setAdapter(adapter);

Spinner spinner = findViewById(R.id.spinner);

// Create an ArrayAdapter using the string array and a default spinner layout

ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this,

R.array.planets_array, android.R.layout.simple_spinner_item);

// Specify the layout to use when the list of choices appears

adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

// Apply the adapter to the spinner

spinner.setAdapter(adapter);

Spinnerの文字サイズを変更したい場合は、レイアウトをカスタムで ArrayAdapter に設定するとできます。

　
References:
スピナー | Android Developers
ArrayAdapter | Android Developers