Android開發之自定義Spinner

yungfan發表於2016-05-09

自定義Spinner,需要定製的有預設背景、按下背景,顯示時每一項的樣式以及彈出時每一項的樣式四個方面。下面舉個簡單例子。

</br>

1、準備兩張圖片,處理為.9png,分別為spinner.9.png和spinner_press.9.png,作為背景,如下圖所示

img_f0209cdf6e4e5742ab65d7bcc86ee49e.png
spinner.9.png

img_2593a759b9e2c463214828d62f9ca8cf.png
spinner_press.9.png

2、在drawable中定義spinner_selector.xml,定義兩種狀態分別對應上面兩種顏色

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true"   
        android:drawable="@drawable/spinner_press" /><!--按下時效果-->  
    <item android:state_pressed="false"   
        android:drawable="@drawable/spinner" /><!--預設效果-->   
</selector>

3、定義一個style,也可以直接放在佈局中,我為了複用拿出來單獨定義了

<!-- spinner -->
<style name="spinner_style">
    <item name="android:background">@drawable/spinner_selector</item>
    <item name="android:paddingLeft">5dip</item>
</style>

4、在佈局的Spinner中引用上述style

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Spinner
        android:id="@+id/field_item_spinner_content"
        style="@style/spinner_style"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_margin="10dp" />
</RelativeLayout>

5、每一項的樣式 simple_spinner_item.xml

<?xml version="1.0" encoding="utf-8"?>
<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/text1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:singleLine="true"
    android:textColor="#808080" />

6、彈出時的每一項顯示佈局 my_drop_down_item.xml

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="10dip"
    android:textColor="#000000"
    android:textSize="15dp" >
</TextView>

7、定義一個字元陣列,作為資料顯示

<string-array name="meinv">
   <item>美女1</item>
   <item>美女2</item>
   <item>美女3</item>
   <item>美女4</item>
   <item>美女5</item>
   <item>美女6</item>
   <item>美女7</item>
</string-array>

8、Activity

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


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

        //資源轉[]
        String meinv[] = getResources().getStringArray(R.array.meinv);

        //構造ArrayAdapter
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
                R.layout.simple_spinner_item, meinv);
        //設定下拉樣式以後顯示的樣式
        adapter.setDropDownViewResource(R.layout.my_drop_down_item);

        spinner.setAdapter(adapter);
    }
}

9、測試效果

img_da5abe155d1e6f4413b309f4becf47f0.gif
自定義Spinner.gif


相關文章