Android プログラミングを初めて学ぶ人のための学習サイトです。実用的なコード例でわかりやすく解説しています。
Android 開発入門Android 開発入門
Android 開発
Androidプログラミング基礎
Android 携帯・アプリの話題
関連サイト
サイト情報
ホーム > ユーザーインターフェイス > スピナーによるオプションの選択

スピナーによるオプションの選択

スポンサーリンク

いくつかのオプション(選択項目)から一つの項目を選択させる場合の UI です。

Web やデスクトップアプリケーションでもしばしば見られるドロップダウンボックスの Android UI での実装

それがスピナーです。

ドロップダウン式のスピナーの表示

スピナーを用いるとアンドロイド UI でドロップダウンリストを表示させることができます。 具体例としては、次のようなウィジェットとして表示していて、これをクリック(タップ)すると・・・

スピナー

次のような選択項目が表示される、というものです。

スピナー

選択項目リスト内では、現在選択されている項目の丸印が点灯しているような表現で表されます。

スピナーの実装

スピナーの実装は次のような手順で行います。

  1. Spinner ウィジェットの定義
  2. 選択項目の定義 - ここでは文字列配列 (String Array) をリソースファイルに定義しています。
  3. アダプターの作成と設定

まず、Spinner ウィジェットは次のように定義します。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
  <Spinner
    android:id="@+id/spinner1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:drawSelectorOnTop="true"/>
</LinearLayout>

選択項目の String Array は次のように定義します。これは res/values/strings.xml リソースファイルにて定義します。

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <string name="app_name">SpinnerTest1</string>
  <string-array name="us_state">
    <item>California (CA)</item>
    <item>Texas (TX)</item>
    <item>Hawaii (HI)</item>
    <item>Washington (WA)</item>
  </string-array>
</resources>

これでコードからは R.array.配列の名前 でアクセスできます。

スピナーを利用する典型的なコードは次ようになります。

package com.keicode.android.test;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.Toast;
import android.widget.AdapterView.OnItemSelectedListener;

public class SpinnerTest1 extends Activity 
  implements OnItemSelectedListener {

  Spinner stateSpinner;
  String[] states;
  
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    stateSpinner = (Spinner)findViewById(R.id.spinner1);
    
    states = getResources().getStringArray(R.array.us_state);
    ArrayAdapter<String> adapter = new ArrayAdapter<String>(
      this,
      android.R.layout.simple_spinner_item,
      states);
    adapter.setDropDownViewResource(
      android.R.layout.simple_spinner_dropdown_item);
    
    stateSpinner.setAdapter(adapter);
    stateSpinner.setOnItemSelectedListener(this);
  }

  @Override
  public void onItemSelected(
    AdapterView<?> arg0, 
    View arg1, 
    int arg2,
    long arg3) {
    
    int i = arg0.getSelectedItemPosition();
    Toast.makeText(
      this, 
      states[i], 
      Toast.LENGTH_SHORT).show();
    
  }

  @Override
  public void onNothingSelected(AdapterView<?> arg0) {}
  
}

レイアウト設定の注意点

ここで元のスピナーとドロップダウンのレイアウトをそれぞれ別に設定していることに注意してください。スピナーのドロップダウン部分のレイアウトを setDropDownViewResource で行わないとスピナー本体のレイアウト定義が使われます。

例えば Spinner のコンストラクタで layout.simple_spinner_dropdown_item を渡すとスピナー本体のみためは次のようになってしまいます。

スピナー

まぁ、もちろんこれが意図したものであれば構いませんが・・・。

尚、特に数字の選択を行う場合は、NumberPicker の利用も検討すべきです。

記事を気に入っていただけましたら、ソーシャルメディアでシェアをお願いします。記事を書く活力になります!

スポンサーリンク
ホーム > ユーザーインターフェイス > スピナーによるオプションの選択
サイト内検索
当サイト及び姉妹サイト内 (*.keicode.com) の情報を検索します。
小山圭介 著者
小山 圭介
4/15/1973生
米国在住のソフトウェアエンジニア。ITコンサルタント
»プロフィール
スポンサーリンク

© 2010-2014 Keisuke Oyama Android 開発入門