【Android】Spinner（スピナー）の簡単な使い方例。セレクトボックスを表示し、選択項目を取得する♪

Android アプリを作るときに、セレクトボックスやコンボボックスのようなものを表示して、選択したら何かする、ということをやってみたくなりました。

Spinner を使うと実現できるそうですの！けれども初めて！いきなりアプリに組み込む前に一度サンプルを作って使い方を整理しますの！

本投稿では Spinner の使い方を勉強する入門の内容をノートいたします♪

作る Spinner サンプルアプリの内容

スピナーには惑星の名前を表示
スピナーで選択された要素を、テキストビューに表示

以上の単純なアプリを作ります♪

Spinner 初心者の学習ポイント

以下、初めてスピナーを作ってみた時に押さえたわたくしたちのポイントを記述いたします。

１．レイアウトの作成

Spinner を表示したいレイアウトに、<Spinner> 要素を書く

MainActivity にスピナーを表示させますので、activity_main.xml に記述致します。

２．スピナーの選択肢の作成

res/values/arrays.xml を作成し、 <string-array> 要素として記述

今回は、固定の選択肢を XML ファイルから取得するやり方の場合ですの。

これは一例で、DB から取得して設定することもできるそうですわ。その場合はスピナーを表示する時に CursorAdapter を使用いたします。

３．スピナーを表示する（アクティビティでの作成）

これは一例で、アクティビティではなくフラグメントに書いても、もちろん構いませんわね。

findViewById メソッドでレイアウトのスピナーを取得
ArrayAdapter をインスタンス化する。この時、ArrayAdapter.createFromResource メソッドを使用する。
2番目の引数にスピナーの選択肢を指定。
3番目の引数には「選択肢全体」をどのように表示するかのレイアウトを指定（自信なし）。simple_spinner_item を使うのがおすすめ。もちろん自分で定義したい場合は使わなくて良い。
ArrayAdapter の setDropDownViewResource メソッドを使用する。
引数は、「選択された要素」をスピナーの中でどのように表示するかを定めたレイアウトを指定する（自信なし）。
simple_spinner_dropdown_item もプラットフォームで自動で決められる標準レイアウトでおすすめ。
setAdapter メソッドを呼び出し、インスタンス化した ArrayAdapter をセットして表示

４．アクティビティでの作成。イベントリスナーで選択された時の動作を作る（アクティビティでの作成）

Spinner クラスの setOnItemSelectedListener メソッドの引数に SpinnerActivity オブジェクトを渡す
SpinnerActivity の onItemSelected をオーバーライドし、選択された時の動作を書く。

実際のサンプル

次のようなプロジェクトを作りました。Android Studio 1.1.0 で、プロジェクト名とドメインと、アクティビティの選択以外は基本的にデフォルトのままで適当ですの♪

アプリ名　SpinnerTest
ドメイ　example.com
サポート　API16
アクティビティ　Blank Activity
アクティビティのカスタマイズ　無し

続いて、ソースコードです。

java/com/example/spinnertest/MainActivity.java

package com.example.spinnertest;

import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.TextView;
import android.widget.Toast;


public class MainActivity extends ActionBarActivity {

    private static final String TAG = MainActivity.class.getSimpleName();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        Log.d(TAG, "onCrete 開始！！！！！");
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        /*
         * 表示
         */
        Spinner spinner = (Spinner) findViewById(R.id.spinner);
        // ArrayAdapter を、string-array とデフォルトのレイアウトを引数にして生成
        ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this, R.array.planets_array, android.R.layout.simple_spinner_item);
        // 選択肢が表示された時に使用するレイアウトを指定
        adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
        // スピナーにアダプターを設定
        spinner.setAdapter(adapter);

        /*
         * イベントリスナー
         */
        spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
            @Override
            public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
                Log.d(TAG, "onItemSelected 開始！！！！！");
                // スピナー要素の文字列を取得
                String selectedItemString = (String) parent.getItemAtPosition(position);

                // 選択した要素で TextView を書き換え
                TextView helloWorldTextView = (TextView) findViewById(R.id.helloWorldTextView);
                helloWorldTextView.setText(selectedItemString);
            }

            @Override
            public void onNothingSelected(AdapterView<?> parent) {
                Log.d(TAG, "onNothingSelected 開始！！！！！");
                Log.d(TAG, "AdapterView を toString: " + parent.toString());
                Toast.makeText(MainActivity.this, "onNothingSelected が呼ばれた", Toast.LENGTH_SHORT).show();
            }
        });

    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

res/layout/activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/helloWorldTextView"
        android:text="@string/hello_world"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

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

</LinearLayout>

res/values/arrays.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="planets_array">
        <item>水星</item>
        <item>金星</item>
        <item>地球</item>
        <item>火星</item>
        <item>木星</item>
        <item>土星</item>
        <item>天王星</item>
        <item>海王星</item>
    </string-array>

</resources>

おわりに

勉強に使いました参考ページです。ありがとう存じます。

Spinners | Android Developers ← これがメイン
android spinner – Google 検索 ← 補助的に

市井に参考書やブログの参考ページなどたくさんございますけれど、公式ページは疑うこと無くお手本にして良いと存じますので、Android Developers を教本といたしました。

ようやく Android の Java にもホンの少しずつではありますけれども、慣れてきましたの。それに、スピナーでしたら実際に目に見えますのでわかりやすいですわ。

ですから、英語はすんなりとは理解できませんけれども、何とか進めることができました♪今後もできるだけ原典にあたり、ブログなどの解説を補助に使用して進めていきたいですの♪

以上です。