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

汉江秋月夜 2014-01-20

展开全文

一、不使用 xml 布局文件创建一个 ListView

创建一个名称为 HelloListView 的 Android 工程，可以参见 Android教程之三：第一个Android应用，HelloWorld 。
要使用 ListView ，需要让你的 Activity 继承于 ListActivity ，这个和以前的有区别，以前的都是继承 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. }
运行程序效果如下：

看到了吧，我们的数据已经通过列表的形式显示了出来！！！
这里主要的是使用了一个 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. //优化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. //元素的缓冲类,用于优化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 方法，所以我们有必要对这个方法做优化，例子中就做了部分的优化，一般面试的时候会被问到 ListView 优化，回答例子中的这些代码就差不多了。
运行，我们会看到效果如图：

四、ListView 列表中的元素的单击事件响应

如果我们要想单击一个 ListView 的元素使其作出相应的响应怎么办呢？比如弹出什么，打开什么，展示什么等等，那么我们只需要实现单击事件的函数既可。
要实现 ListView 的单击事件有两种方法，一个是使用 getListView().setOnClickListener(l ); 设置，这个和平时我们用的控件设置是一样的，不做介绍，下面介绍第二个，就是重写 ListActivity 的 onListItemClick 方法，其实这个的最后处理也是 ListView 的 setOnClickListener 进行监听调用的。
在 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();
运行单击其中的一行效果如下图：