在 Android 裡使用 Spinner

在 在 Android 裡使用 ListActivity, ListView, ListAdpater 曾提到 ListAdapater 有個兄弟叫做 SpinnerAdapter，且 ListView 有個遠房表兄弟叫做 Spinner，現在就來介紹 Spinner 是什麼？

簡單講，Spinner 就是下拉選單，因為下拉選單的資料來源可以是靜態也可以動態，資料呈現方式也是條列式，幾乎可以說是 ListAdapter 與 ListView 的孿生兄弟，唯一的差別在於 ListAdapter 與 ListView 用在整頁顯示的 ListActivity，而 Spinner 用在局部顯示的下拉選單上。

XML layout 如下，一個特別的地方是要加上 prompt 屬性，作為下拉視窗的標題：

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <Spinner
        android:id="@+id/spinner"
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"
        android:prompt="@string/spinner_title" 
        />
</LinearLayout>

Activity 程式如下：

public class B_Adapter extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        Spinner spinner = (Spinner) this.findViewById(R.id.spinner);
        ArrayAdapter<String> adapter = this.createArrayAdapter();
        adapter.setDropDownViewResource(
               android.R.layout.simple_spinner_dropdown_item);
        spinner.setAdapter(adapter);
    }

    private ArrayAdapter<String> createArrayAdapter() {
        String[] array = new String[] {
                "禮拜一", "禮拜二", "禮拜三", "禮拜四", "禮拜五"
        };
        return new ArrayAdapter<String>(this,
               android.R.layout.simple_spinner_item, array);
    }
}

特別的地方是，要提供兩個 layout，一個是下拉選單未展開的樣貌，另一個是展開的樣貌，這裡建議用 Android 提供的範本，其他的設定跟 在 Android 裡使用 ListActivity, ListView, ListAdpater 沒有兩樣，一樣可以用 ArrayAdapter、SimpleAdapter 或 SimpleCursorAdapter 三種 adapter。

雖然有 ListAdapter 與 SpinnerAdapter 之別，但是實做的類別是一樣的，也就是說 ArrayAdapter、SimpleAdapter 或 SimpleCursorAdapter 同時實做 ListAdapter 與 SpinnerAdapter interface，因此不管是在 ListView 或者 Spinner 裡，用的都是 ArrayAdapter、SimpleAdapter 或 SimpleCursorAdapter 同一個類別。

執行結果如下：

點擊 Spinner 後彈出下拉選單，實做方法跟 HTML 的 Select 不一樣。

Spinner 可以使用與 ListView 一樣的 Event Listeners，但是實務上會用的只有 OnItemSelectedListener。

為什麼要叫 Spinner？Spinner 有紡紗機的意思，其實把它想可以展開收合的做捲軸會比較好理解，但不管是紡紗機或捲軸，都是在形容 HTML 裡的 Select，Android 裡是用彈出視窗實做，就比較難想像了。

android.R.layout.simple_spinner_item 與 android.R.layout.simple_spinner_dropdown_item 小探險

分別將 android-sdk\platforms\android-8\data\res\layout\android.R.layout.simple_spinner_item.xml 與 android-sdk\platforms\android-8\data\res\layout\android.R.layout.simple_spinner_dropdown_item.xml 抽出來，再另外加上一個空的 Spinner。

<LinearLayout 
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:background="#F1C763"
 >
 <Spinner
  android:id="@+id/spinner"
  android:layout_width="fill_parent" 
  android:layout_height="wrap_content"
  android:prompt="@string/spinner_title" 
  />
 <Spinner
  android:id="@+id/spinner2"
  android:layout_width="fill_parent" 
  android:layout_height="wrap_content"
  android:prompt="@string/spinner_title" 
  />
 <TextView 
  style="?android:attr/spinnerItemStyle"
  android:singleLine="true"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:ellipsize="marquee"
  android:text="haha"/>
 <CheckedTextView  
  style="?android:attr/spinnerDropDownItemStyle"
  android:singleLine="true"
  android:layout_width="match_parent"
  android:layout_height="?android:attr/listPreferredItemHeight"
  android:ellipsize="marquee"
  android:text="haha"/>
</LinearLayout>

結果如下：

黃色背景是用來凸顯 TextView 的文字，可以發現 Spinner 的構成方式。