Android系列教程之八：ListView組件的使用

漢江秋月夜 2014-01-20

展開全文

一、不使用 xml 布局文件創(chuàng)建一個 ListView

創(chuàng)建一個名稱為 HelloListView 的 Android 工程，可以參見 Android教程之三：第一個Android應用，HelloWorld 。
要使用 ListView ，需要讓你的 Activity 繼承于 ListActivity ，這個和以前的有區(qū)別，以前的都是繼承 Activity ，該 ListActivity 繼承 Activity ，擴展了很多常用的用于操作 ListView 的方法，使用很方便。
現修改 HelloListView 類如下 :
Java代碼
1. public class HelloListView extends ListActivity {
2. /** Called when the activity is first created. */
3. @Override
4. public void onCreate(Bundle savedInstanceState) {
5. super.onCreate(savedInstanceState);
6. //setContentView(R.layout.main);
7. //設置一個Adapter
8. setListAdapter(new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1,COUNTRIES));
9. }
10. //數據數據
11. private static final String[] COUNTRIES=new String[]{"中國","俄羅斯","英國","法國"};
12. }
運行程序效果如下：

看到了吧，我們的數據已經通過列表的形式顯示了出來?。。?/span>
這里主要的是使用了一個 Adapter— 適配器，你可以把他看成是 ListView 的數據源， ListView 要展示的數據都是已 Adapter 的形勢傳遞給 ListView 的。這個 Adapter 很重要， Android 的用于傳給集合控件（ ListView,Spinner,GridView 等）的數據都是以 Adapter 的形勢，這樣的好處就是只要掌握了 Adapter ，就可以很隨意的給這些集合控制傳遞數據，因為他們使用的都是 Adapter 。適配器適配器關鍵就是適配，只需公布一個 Adapter ，就全搞定了。 Android 已經給我們實現了一些常用的適配器，如剛剛使用的數組適配器，還有簡單適配器等 , 如果這些不能滿足，我們還可以通過自定義適配器來實現自己的適配器。其實一種適配器就對應了一個集合控件中的一個元素的布局展示。

二：使用 xml 來自定義 ListView

上個例子我們并沒有使用在 main.xml 中定義一個 ListView 的形勢來布局 ListView ，而是使用的 ListActivity 中默認的 ListView 來演示的。
下面就使用我們在 main.xml 中自定義的 ListView, 這樣我們可以很方便的控制 ListView 展示的布局，大小，背景色等屬性。當然上個例子中我們一樣可以通過 getListView 獲取 ListView 后使用它的方法來改變布局、大小和背景色等。
修改 main.xml 為：
Xml代碼
1. <?xml version="1.0" encoding="utf-8"?>
2. <ListView xmlns:android="http://schemas./apk/res/android"
3. android:id="@android:id/list"
4. android:layout_width="fill_parent"
5. android:layout_height="fill_parent"
6. android:background="#FF0000FF"
7. >
8. </ListView>
這里要注意的是我們設置 ListView 的 id 為 ”@android:id/list”, 意思是我們引用 Android 已經為我們定義好的一個 id ，名字是 list ，如果你不定義成這樣，這個 ListView 是不能被 ListActivity 識別的。然后就是添加了一個藍色的背景，看看我們這個自定義的 ListView 是否起了作用。
修改 HelloListView 類為：
Java代碼
1. public class HelloListView extends ListActivity {
2. /** Called when the activity is first created. */
3. @Override
4. public void onCreate(Bundle savedInstanceState) {
5. super.onCreate(savedInstanceState);
6. setContentView(R.layout.main);
7. //設置一個Adapter
8. setListAdapter(new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1,COUNTRIES));
9. }
10. //數據數據
11. private static final String[] COUNTRIES=new String[]{"中國","俄羅斯","英國","法國"};
12. }
比上個例子只是多了 setContentView(R.layout. main ); 是為了讓 Android 識別我們定義的 ListView 。
運行效果圖：

背景已經變成了藍色，說明我們在xml中定義的ListView起作用了。

三：自定義要展示的元素

前面的兩個例子都是展示一行文字，如果我們想圖文混排怎么做呢，比如前面是文字，后面是圖片。要實現這種功能就需要我們自定義 Adapter 啦。
新建布局文件 item.xml, 內容如下：
Xml代碼
1. <?xml version="1.0" encoding="utf-8"?>
2. <RelativeLayout
3. xmlns:android="http://schemas./apk/res/android"
4. android:layout_width="fill_parent"
5. android:layout_height="wrap_content">
6. <TextView
7. android:id="@+id/text"
8. android:layout_alignParentLeft="true"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"/>
11. <ImageView
12. android:id="@+id/image"
13. android:layout_alignParentRight="true"
14. android:layout_width="wrap_content"
15. android:layout_height="wrap_content"/>
16. </RelativeLayout>
這里主要定義一個 TextView 和一個 ImageView ，用于顯示列表每一行的文本和圖片
修改 HelloListView 類如下：
Java代碼
1. public class HelloListView extends ListActivity {
2. /** Called when the activity is first created. */
3. @Override
4. public void onCreate(Bundle savedInstanceState) {
5. super.onCreate(savedInstanceState);
6. setContentView(R.layout.main);
7. //設置一個Adapter,使用自定義的Adapter
8. setListAdapter(new TextImageAdapter(this));
9. }
10. /**
11. * 自定義視圖
12. * @author 飛雪無情
13. *
14. */
15. private class TextImageAdapter extends BaseAdapter{
16. private Context mContext;
17. public TextImageAdapter(Context context) {
18. this.mContext=context;
19. }
20. /**
21. * 元素的個數
22. */
23. public int getCount() {
24. return texts.length;
25. }
27. public Object getItem(int position) {
28. return null;
29. }
31. public long getItemId(int position) {
32. return 0;
33. }
34. //用以生成在ListView中展示的一個個元素View
35. public View getView(int position, View convertView, ViewGroup parent) {
36. //優(yōu)化ListView
37. if(convertView==null){
38. convertView=LayoutInflater.from(mContext).inflate(R.layout.item, null);
39. ItemViewCache viewCache=new ItemViewCache();
40. viewCache.mTextView=(TextView)convertView.findViewById(R.id.text);
41. viewCache.mImageView=(ImageView)convertView.findViewById(R.id.image);
42. convertView.setTag(viewCache);
43. }
44. ItemViewCache cache=(ItemViewCache)convertView.getTag();
45. //設置文本和圖片，然后返回這個View，用于ListView的Item的展示
46. cache.mTextView.setText(texts[position]);
47. cache.mImageView.setImageResource(images[position]);
48. return convertView;
49. }
50. }
51. //元素的緩沖類,用于優(yōu)化ListView
52. private static class ItemViewCache{
53. public TextView mTextView;
54. public ImageView mImageView;
55. }
56. //展示的文字
57. private String[] texts=new String[]{"天氣","我團","背景"};
58. //展示的圖片
59. private int[] images=new int[]{R.drawable.img1,R.drawable.img2,R.drawable.img3};
60. }
這里的主要地方是自定義了一個 Adapter ，我們只需要繼承 BaseAdapter 即可， BaseAdapter 已經實現了 Adapter 的大部分方法，我們繼承后只需要實現部分的方法即可。必須實現的就是 getCount 和 getView 方法，前一個是返回 ListView 中有多少個元素，后一個是生成要展示的 View 。 ListView 在每添加一個 View 是就會調用 Adapter 的 getView 方法，所以我們有必要對這個方法做優(yōu)化，例子中就做了部分的優(yōu)化，一般面試的時候會被問到 ListView 優(yōu)化，回答例子中的這些代碼就差不多了。
運行，我們會看到效果如圖：

四、ListView 列表中的元素的單擊事件響應

如果我們要想單擊一個 ListView 的元素使其作出相應的響應怎么辦呢？比如彈出什么，打開什么，展示什么等等，那么我們只需要實現單擊事件的函數既可。
要實現 ListView 的單擊事件有兩種方法，一個是使用 getListView().setOnClickListener(l ); 設置，這個和平時我們用的控件設置是一樣的，不做介紹，下面介紹第二個，就是重寫 ListActivity 的 onListItemClick 方法，其實這個的最后處理也是 ListView 的 setOnClickListener 進行監(jiān)聽調用的。
在 HelloListView 類中增加如下代碼：
Java代碼
1. @Override
2. protected void onListItemClick(ListView l, View v, int position, long id) {
3. Toast.makeText(this, "你單擊了"+texts[position], Toast.LENGTH_SHORT).show();
運行單擊其中的一行效果如下圖：