Android 開發 (四) custom Gridview Selector

在設計app 時通常不會使用default的設計
所以客製化的技巧也成為重要的課題
今天寫的是讓使用者在點選 GridView時
可以看到顏色的feedback

Main

Main 只是簡單的將 gridview 做資料的設定

protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
GridView gv = (GridView) this.findViewById(R.id.gridview);
String[] item = new String[] {"1", "2","3","4","5","6","7","8","9"};
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
                      android.R.layout.simple_expandable_list_item_1,item);
gv.setAdapter(adapter);
}

activity_main

activity_main 在一個relativelayout裡放一個Gridview 並限定每行只能有三個item
其中android:listSelector="@drawable/customselect" 我們使用了我們客製化的selector

<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"

    android:paddingBottom="@dimen/activity_vertical_margin"

    android:paddingLeft="@dimen/activity_horizontal_margin"

    android:paddingRight="@dimen/activity_horizontal_margin"

    android:paddingTop="@dimen/activity_vertical_margin"

    tools:context=".MainActivity" >

    <GridView

        android:id="@+id/gridview"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:listSelector="@drawable/customselect"

        android:numColumns="3"/>

</RelativeLayout>

customselect.xml

在customselect中 我們設定了在 pressed state時  更改顏色

<?xml version="1.0" encoding="UTF-8"?>
<selector
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape > <solid android:color="#77007777" />   </shape>
        </item>
</selector>

結果圖示

尚未做點選的圖案

點選時的圖片