Android開發教程：listview item選中背景色

listview是Android常用的控件，點擊listview item時，默認顯示橘黃色的背景色，而且翻滾時也顯示相應的顏色。這樣往往會跟實際的軟件UI設計風格很不協調。通過對listview背景顏色的設置，從而實現與軟件UI風格相協調。

改變listview背景選項往往采用建立一個xml文件，如listview_bg.xml，裡面定義selector的相關屬性，將文件放著drawable的資源文件當資源文件使用，在listview item配置背景屬性android:background=”@drawable/listview_bg”從而達到改變背景顏色的目的。

可是問題在於android:background=”@drawable/listview_bg”屬性的設置是一個drawable資源文件，就是說listview_bg.xml配置drawable需要對應一個圖片之類的資源文件，可是需求當中往往只需要顏色代碼而不是圖片資源。這個時候需要在listview_bg.xml配置drawable時，通過引用一個顏色的資源文件，即android:drawable=”@color/white”,這樣就不需要引用類似android:drawable=”@drawable/image”這樣的圖片文件了。

以下是相關的代碼文件。

listview_bg.xml（背景色狀態設置）

1. <?xml version="1.0" encoding="utf-8" ?>  
2. <selector xmlns:android="http://schemas.android.com/apk/res/android">  
3. <!-- 沒有焦點時的背景顏色 -->  
4. <item android:state_window_focused="false"  
5. android:drawable="@color/unfocused" />  
6. <!-- 非觸摸模式下獲得焦點並單擊時的背景顏色 -->  
7. <item android:state_focused="true" android:state_pressed="true"  
8. android:drawable="@color/pressed" />  
9. <!--觸摸模式下單擊時的背景顏色  -->  
10. <item android:state_focused="false" android:state_pressed="true"  
11. android:drawable="@color/white" />  
12. <!--選中時的背景顏色  -->  
13. <item android:state_selected="true"  android:drawable="@color/selected" />  
14. <!--獲得焦點時的背景  顏色-->  
15. <item android:state_focused="true" android:drawable="@color/focused" />  
16. </selector>  

color.xml（顏色配置文件）

1. <?xml version="1.0" encoding="utf-8"?>  
2. <resources>  
3. <color name="white">#ffffffff</color>  
4. <color name="unfocused">#cccccccc</color>  
5. <color name="pressed">#fff22fff</color>  
6. <color name="selected">#fff33fff</color>  
7. <color name="focused">#ffff44ff</color>  
8. </resources>  

item.xml（listview Item選項布局文件）

1. <?xml version="1.0" encoding="utf-8"?>  
2. <!--  items選項 -->  
3. <RelativeLayout  
4.  android:id="@+id/RelativeLayout"  
5.  android:layout_width="fill_parent"  
6.  xmlns:android="http://schemas.android.com/apk/res/android"  
7.  android:layout_height="wrap_content"  
8.  android:paddingBottom="4dip"  
9.  android:paddingLeft="12dip"  
10.  android:paddingRight="12dip"          
11.  android:background="@drawable/listview_bg"        
12.  >  
13. <ImageView  
14.  android:paddingTop="22dip"  
15.  android:layout_alignParentRight="true"  
16.  android:layout_width="wrap_content"  
17.  android:layout_height="wrap_content"  
18.  android:id="@+id/more_image"  
19.  />  
20. <TextView    
21.  android:layout_height="wrap_content"  
22.  android:textSize="18dip"  
23.  android:layout_width="fill_parent"  
24.  android:id="@+id/title"           
25.  android:paddingTop="6dip"  
26.  />  
27. <TextView  
28.  android:text=""  
29.  android:layout_height="wrap_content"  
30.  android:layout_width="fill_parent"          
31.  android:layout_below="@+id/title"  
32.  android:id="@+id/date"  
33.  android:paddingRight="20dip"        
34.  />  
35. </RelativeLayout>  

main.xml（listview文件）

2. <?xml version="1.0" encoding="utf-8"?>  
4. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
5.  android:orientation="vertical"  
6.  android:layout_width="fill_parent"  
7.  android:layout_height="fill_parent"  
8.  >  
9. <ListView android:layout_width="wrap_content"  
10.  android:layout_height="wrap_content"            
11.  android:divider="@color/white"           
12.  android:dividerHeight="1dip"           
13.  android:id="@+id/list_items"  
14.  />  
15. </LinearLayout>  

SelectorActivity.java（java源碼文件）

1. package com.test.main;  
2.   
3. import java.util.ArrayList;  
4. import java.util.HashMap;  
5.   
6. import android.app.Activity;  
7. import android.os.Bundle;  
8. import android.widget.ListView;  
9. import android.widget.SimpleAdapter;  
10.   
11. public class SelectorActivity extends Activity {  
12.  /** Called when the activity is first created. */  
13.  @Override  
14.  public void onCreate(Bundle savedInstanceState) {  
15.  super.onCreate(savedInstanceState);  
16.  setContentView(R.layout.main);  
17.  ListView list=(ListView) findViewById(R.id.list_items);  
18.   
19.  ArrayList<HashMap<String, Object>> listItem = new ArrayList<HashMap<String, Object>>();  
20.   
21.  String []title={"Apple","Google","Facebook"};  
22.  String []date={"2-12","5-16","9-12"};  
23.   
24.  for (int i = 0; i < 3; i++)  
25.   
26.  {  
27.   
28.  HashMap<String, Object> map = new HashMap<String, Object>();  
29.   
30.  map.put("more_image", R.drawable.more);// 圖像資源的ID  
31.   
32.  map.put("title", title[i]);  
33.   
34.  map.put("date", date[i]);  
35.   
36.  listItem.add(map);  
37.   
38.  }  
39. // 數據源  
40.  SimpleAdapter listItemAdapter= new SimpleAdapter(SelectorActivity.this, listItem,  
41.  R.layout.item,// ListItem的XML實現  
42.  // 動態數組與ImageItem對應的子項  
43.  new String[] { "more_image", "title", "date" },  
44.  // XML文件裡面的一個ImageView,兩個TextView ID  
45.  new int[] { R.id.more_image, R.id.title,  
46.  R.id.date });      
47.   
48.  list.setAdapter(listItemAdapter);  
49.   
50.  }  
51. }  

最後效果圖

圖-1 點擊時的背景顏色

圖-2 翻滾時的背景顏色