Android ListView的使用和特性研究

ListView应该是android里最常用的显示数据的控件了。它用来将集合数据一个个抽取出来按照从头到尾往下显示的控件里，这些是在手机中经常看到的一些布局。

 

我们可以看从简单的到难的布局，一步步学习如何使用ListView来构建UI和了解ListView的原理和实现机制。

 

我们看看最简单的ListView效果：

 

 

带有图标的ListView效果图：

其他稍微复杂的ListView的布局。

 

下面我们从简单到难的步骤分析演示如何使用android中的ListView。

 

1.简单的ListView布局(单行显示信息)

首先我们先创建存放ListView的Activity所需要的布局xml文件。

 

list_view1.xml

Xml代码  

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

 

上面代码我们创建了一个布局配置文件，里面只放了一个ListView控件，将其ID设置为：list1。

 

接下来是java代码，大概步骤是：先找出ListView，然后往ListView里填充东西。

 

Java代码  

1. final String[] data = {"第一章","第二章","第三章","第四章","第五章"};  
2.   
3.    /** Called when the activity is first created. */  
4.    @Override  
5.    public void onCreate(Bundle savedInstanceState) {  
6.        super.onCreate(savedInstanceState);  
7.        setContentView(R.layout.list_view1);  
8.          
9.        ListView lv = (ListView) findViewById(R.id.list1);  
10.        ArrayAdapter<String> adapter = new ArrayAdapter<String>(  
11.             this,android.R.layout.simple_list_item_1,data);  
12.        lv.setAdapter(adapter);  
13.    }  

 

 以上是运行这个运行这个ListView，并往里面填充东西的代码。在android中，由于数据来源多种多样，如：从资源文件读取、从数据库中读取、从 网络上其他地方读取而最终这些数据都将被展示在ListView中，所以这边android就用了adapter设计模式，对应每种数据来源使用对应的 adapter来连接数据和视图。

 以上的代码很简单，运行效果如下：

上面代码有一定的局限性，就是比如你要创建稍微复杂点的布局，如名片卡，显示名字，电话信息，地址等。像这种稍微复杂的布局就无法用上面的来做，因为在上面的例子中，ArrayAdapter里装的数据都是String型，单行仅能显示一条数据。

 

 

2.进阶的ArrayAdapter，自定义布局来显示ArrayAdapter里面装的对象。

 

这边我们沿用上面的xml布局，因为要往ArrayAdapter里面装对象，所以这边我们先定义一个对象，最后要做的就是将对象的信息显示在ListView中。

 

Java代码  

1. package com.zhouzijing.android;  
2.   
3. public class Person {  
4.        
5.     public String name;  
6.     public int age;  
7.     public String email;  
8.     public String address;  
9.    
10.     public Person(String name, int age, String email, String address) {  
11.         super();  
12.         this.name = name;  
13.         this.age = age;  
14.         this.email = email;  
15.         this.address = address;  
16.     }  
17.    
18.     @Override  
19.     public String toString() {  
20.         return "Person [name=" + name + ", age=" + age + ", email=" + email  
21.                 + ", address=" + address + "]";  
22.     }  
23.    
24. }  

 

 

接下来将这个对象装进ArrayAdapter显示出来。

 

Java代码  

1. @Override  
2. public void onCreate(Bundle savedInstanceState) {  
3.     super.onCreate(savedInstanceState);  
4.     setContentView(R.layout.list_view1);  
5.       
6.   //创建数据源.  
7.     Person[] data = new Person[]{  
8.         new Person("蔡志坤",25,"[e-mail]","厦门市"),  
9.         new Person("李杰华",25,"[e-mail]","漳州市"),  
10.         new Person("张亮",25,"[e-mail]","厦门市"),  
11.         new Person("陈旭",25,"[e-mail]","厦门市"),  
12.         new Person("刘玄德",25,"[e-mail]","福州市")  
13.     };  
14.       
15.     ListView lv = (ListView) findViewById(R.id.list1);  
16.     ArrayAdapter<Person> adapter = new ArrayAdapter<Person>(  
17.             this,android.R.layout.simple_list_item_1,data);  
18.     lv.setAdapter(adapter);  
19. }  

 

效果图是：

依据上面的结果，可以得出结论，ArrayAdapter默认是调用它里面装的对象的toString方法来展示数据。但是上面的信息显得太凌乱，所以这 边要介绍另外一个ArrayAdapter的使用方法，就是扩展ArrayAdapter ，通过继承它来实现自定义视图的展现。所以刚开始要做的是先创建 一个xml布局文件，确定ListView里每行数据显示的样式。

 

list_view1_item.xml

 

Xml代码  

1. <?xml version="1.0" encoding="utf-8"?>  
2. <LinearLayout  
3.   xmlns:android="http://schemas.android.com/apk/res/android"  
4.   android:id="@+id/linerlayout1"  
5.   android:orientation="vertical"  
6.   android:layout_height="fill_parent"  
7.   android:layout_width="fill_parent"  
8.   >  
9.      <TextView  
10.         android:id="@+id/person_name"  
11.         android:textSize="23sp"  
12.         android:layout_width="wrap_content"  
13.         android:layout_height="wrap_content"  
14.      />  
15.      <TextView  
16.         android:id="@+id/person_age"  
17.         android:layout_width="wrap_content"  
18.         android:layout_height="wrap_content"  
19.     />  
20.     <TextView  
21.         android:id="@+id/person_email"  
22.         android:layout_width="wrap_content"  
23.         android:layout_height="wrap_content"  
24.     />  
25.     <TextView  
26.         android:id="@+id/person_address"  
27.         android:layout_width="wrap_content"  
28.         android:layout_height="wrap_content"  
29.     />  
30. </LinearLayout>  

 

接下来通过继承ArrayAdapter，然后重写getView方法，用来将自定义布局的View注入到ListView中，然后将每条数据装进对应的View中。

 

PersonAdapter.java

Java代码  

1. package com.zhouzijing.android;  
2.   
3. import android.content.Context;  
4. import android.view.LayoutInflater;  
5. import android.view.View;  
6. import android.view.ViewGroup;  
7. import android.widget.ArrayAdapter;  
8. import android.widget.TextView;  
9.   
10. public class PersonAdapter extends ArrayAdapter<Person>{  
11.   
12.     LayoutInflater mLayoutInflater;  
13.     int resourceId;  
14.     Context mContext;  
15.       
16.     public PersonAdapter(Context context, int resourceId, Person[] objects) {  
17.         super(context, resourceId, objects);  
18.           
19.         //获取LayoutInflater 服务,用来从预定义的xml布局创建view对象.  
20.         this.resourceId = resourceId;  
21.         mLayoutInflater = LayoutInflater.from(context);  
22.     }  
23.   
24.     @Override  
25.     public View getView(int position, View convertView, ViewGroup parent) {  
26.         if(convertView == null){  
27.             //创建新的view视图.  
28.             convertView = mLayoutInflater.inflate(resourceId, null);  
29.         }  
30.         //获取当前要显示的数据  
31.         Person person = getItem(position);  
32.   
33.         TextView name = (TextView) convertView.findViewById(R.id.person_name);  
34.         TextView age = (TextView) convertView.findViewById(R.id.person_age);  
35.         TextView email = (TextView) convertView.findViewById(R.id.person_email);  
36.         TextView address = (TextView) convertView.findViewById(R.id.person_address);  
37.   
38.         name.setText(person.name);  
39.         age.setText(String.valueOf(person.age));  
40.         email.setText(person.email);  
41.         address.setText(person.address);  
42.   
43.         return convertView;  
44.     }  
45.       
46.       
47.   
48.       
49.   
50. }  

 

 

调用自定义的PersonAdapter

Java代码  

1. @Override  
2. public void onCreate(Bundle savedInstanceState) {  
3.     super.onCreate(savedInstanceState);  
4.     setContentView(R.layout.list_view1);  
5.       
6.   //创建数据源.  
7.     Person[] data = new Person[]{  
8.         new Person("蔡志坤",25,"[e-mail]","厦门市"),  
9.         new Person("李杰华",25,"[e-mail]","漳州市"),  
10.         new Person("张亮",25,"[e-mail]","厦门市"),  
11.         new Person("陈旭",25,"[e-mail]","厦门市"),  
12.         new Person("刘玄德",25,"[e-mail]","福州市")  
13.     };  
14.       
15.     ListView lv = (ListView) findViewById(R.id.list1);  
16.     PersonAdapter adapter = new PersonAdapter(  
17.             this,R.layout.list_view1_item,data);  
18.     lv.setAdapter(adapter);  
19. }  

 

最终的效果图是：

 

以上继承ArrayAdapter类，重写getView方法，里面的实现还不是最高效率，这边涉及到ListView的懒加载机制和实现的原理，以后详论。

 

3.通过上面两个例子我们可以简单的了解创建ListView的一般步骤，总的说来可以总结为下面几个步骤。

• 创建ListView里item的布局xml文件，第一个例子引用了android.R.layout.simple_list_item_1 ，所以省略掉创建的步骤，缺点是只能显示一条信息。
• 创建数据源，数据源可能是手动添加或查询数据库获取。
• 通过继承ArrayAdapter，重写getView方法来进行数据绑定。

 

我们讲到如何通过扩展ArrayAdapter来将其里面所装的对象展现在自定义的View里，其中有涉及到展现ListView的效率问题。这边我们在分 析下到底ListView是如何创建整个UI，而我们要如何才能写出运行效率高的代码，也顺便了解下如何使用android内置的支持更方便的编写一个 ListView。

 

      假设我们要显示一个有1000行数据的ListView，这样的数据量在手机中应该算很庞大了，那ListView会如何处理呢，以让系统运行时占用的空间时间最优化呢？

 

      其实在ListView中有使用懒加载机制以提高显示的效率。在很多系统架构中我们都可以看到懒加载机制，如hibernate的懒加载机 制，spring bean也有懒加载，所谓的懒加载应该是在需要时才用到，不需要时能不创建就不创建，尽量减少系统消耗。就以ListView来说：假设ListView 总共要显示1000条数据，但是用户一次仅能看到10条左右，那就有其余的990条是看不到的，这时候系统可以不用创建这些View，等用户往下或往上拉 动数据再创建新的要显示的View，这就是ListView中的懒加载机制。所以我们在写代码时候要特别注意这点，这边用图形来解释下这个机制。

 

如上面实际上要显示的条目可能有几十上百条，但是因为手机一个屏幕只能看到4条，所以ListView就创建4个View来显示ListView内部的Item，当用户往下拉动的时候：

当用户往下拉动时，原本装Item1的视图就看不到了，而本来看不到的Item5就显示出来了，系统还是一样只能看到4条item。ListView就将 本来装Item1的View拖出来，放到最底端，然后更新里面的数据变成Item5，但是此时系统还是一样只创建了4个View，这样就节省了很多 View的创建时间，只需要做替换内容的操作，提高了系统的效率。因此我们可以得出一个结论：假设每个View里面有4个TextView，因为在这个 ListView中，系统一屏只能显示4个View，所以总共只需要创建16个TextView，而不管ListView里面有几百条记录，也都是由这 16个TextView替换内容来完成显示。但是每次要替换内容都需要查找4个View，为了使系统的效率最大化，我们可以对它进行优化，我们创建一个静 态类，保存对每个View中的4个TextView的跟踪，这样就不必每次都查找。具体实现如下(这边修改ListView的使用和特性研究(一) )中的例子：

 

Java代码  

1. package com.zhouzijing.android;  
2.   
3. import android.content.Context;  
4. import android.view.LayoutInflater;  
5. import android.view.View;  
6. import android.view.ViewGroup;  
7. import android.widget.ArrayAdapter;  
8. import android.widget.TextView;  
9.   
10. public class PersonAdapter extends ArrayAdapter<Person>{  
11.   
12.     LayoutInflater mLayoutInflater;  
13.     int resourceId;  
14.     Context mContext;  
15.       
16.     public PersonAdapter(Context context, int resourceId, Person[] objects) {  
17.         super(context, resourceId, objects);  
18.           
19.         //获取LayoutInflater 服务,用来从预定义的xml布局创建view对象.  
20.         this.resourceId = resourceId;  
21.         mLayoutInflater = LayoutInflater.from(context);  
22.     }  
23.   
24.     @Override  
25.     public View getView(int position, View convertView, ViewGroup parent) {  
26.         if(convertView == null){  
27.             //创建新的view视图.  
28.             convertView = mLayoutInflater.inflate(resourceId, null);  
29.         }  
30.           
31.         ViewHolder holder = (ViewHolder)convertView.getTag();  
32.         if(holder==null){  
33.             holder = new ViewHolder();  
34.             //查找每个ViewItem中,各个子View,放进holder中  
35.             holder.name = (TextView) convertView.findViewById(R.id.person_name);  
36.             holder.age = (TextView) convertView.findViewById(R.id.person_age);  
37.             holder.email = (TextView) convertView.findViewById(R.id.person_email);  
38.             holder.address = (TextView) convertView.findViewById(R.id.person_address);  
39.             //保存对每个显示的ViewItem中, 各个子View的引用对象  
40.             convertView.setTag(holder);  
41.         }  
42.           
43.         //获取当前要显示的数据  
44.         Person person = getItem(position);  
45.   
46.         holder.name.setText(person.name);  
47.         holder.age.setText(String.valueOf(person.age));  
48.         holder.email.setText(person.email);  
49.         holder.address.setText(person.address);  
50.   
51.         return convertView;  
52.     }  
53.       
54.     static class ViewHolder {  
55.         TextView name;  
56.         TextView age;  
57.         TextView email;  
58.         TextView address;  
59.     }  
60.   
61. }  

 

上面代码是优化后的结果。在上面代码中我们进行了优化，使ListView没有每次要替换内容都查找内部的View，而是保存引用，总共一屏能显示N条，就查找N次 ，而不是之前的总显示N条，就查找N次。

 

下面我们看看如何使用android内置对ListView的支持来更好的辅助我们编写一个ListView。

 

这边我们通过继承ListActivity来编写一个ListView。所以首先我们先了解下ListActivity这个类。

 

上图可以看到ListActivity继承了Activity，然后扩展了一些针对ListView操作的方法，如设置选中第几个，点击事件，设置 adapter等。实际上ListActivity就是一个内置了一个ListView的Activity，我们在使用它时，可以不用调用 setContentView方法就能显示出ListView,那到底这个ListView放在哪里呢?

 

 

使用ListActivity，android会帮忙创建一个id是android.R.id.list的ListView，所有的对 ListActivity内置的ListView的操作也都是作用在这个id上，同时系统本身还会判断，如果这个ListView里的数据是空的，它会对 应的显示一个id是android.R.id.empty的控件，用来指示用户这个ListView的数据为空，所有这些逻辑流程转换都是由系统完成，用 户只需要关心显示的内容即可，所以大大方便了用户的开发。下面我们创建一个xml布局，简单介绍下如何使用内置的ListView。

 

Xml代码  

1. <?xml version="1.0" encoding="utf-8"?>  
2. <LinearLayout  
3.   xmlns:android="http://schemas.android.com/apk/res/android"  
4.   android:orientation="vertical"  
5.   android:layout_width="fill_parent"  
6.   android:layout_height="fill_parent">  
7.    
8.     <ListView android:drawSelectorOnTop="false"  
9.         android:id="@android:id/list" android:layout_height="0dip"  
10.         android:layout_weight="1" android:layout_width="fill_parent"/>  
11.    
12.     <TextView android:id="@android:id/empty"  
13.         android:layout_height="wrap_content"  
14.         android:layout_width="fill_parent" android:text="没有数据"/>  
15.    
16. </LinearLayout>  

 

上面代码创建了布局文件，其中id是：@android:id/list的控件就是负责显示数据的ListView，@android:id/empty 则是当ListView为空时负责显示提示信息的控件。当然这边你可以添加任意你需要显示的东西，如你可能需要一个工具条，几个按钮之类的，尽管添加，ListView只会影响到对应它所在的区域而不会影响其他的控件。

 

Java代码  

1. public class MainActivity extends ListActivity {  
2.       
3.     final String[] data = new String[]{  
4.             "第一章","第二章","第三章","第四章","第五章"  
5.         };  
6.       
7.     /** Called when the activity is first created. */  
8.     @Override  
9.     public void onCreate(Bundle savedInstanceState) {  
10.         super.onCreate(savedInstanceState);  
11.         setContentView(R.layout.activity_list_demo);  
12.         ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,  
13.                 android.R.layout.simple_list_item_1, data);  
14.         setListAdapter(adapter);  
15.     }  
16. }  

 

显示的效果如下:

如果修改java代码（final String[] data = new String[]{};），让其显示空数据时，运行的效果如下：

 

我们可以通过重写ListActivity里的onListItemClick方法，来便捷的为ListView添加item click事件。

 

Java代码  

1. @Override  
2. protected void onListItemClick(ListView l, View v, int position, long id) {  
3.     Toast.makeText(this, "您点击的是：" + data[position], Toast.LENGTH_LONG)  
4.        .show();  
5. }  

 

当用户点击ListView里面的Item时，效果如下：

 

     综上，我们讨论了如何编写ListView中的自定义视图并优化其效率，如何使用ListActivity。在这边大家要熟悉android提供的一些预 设的id和layout，如@android:id/list ，android.R.layout.simple_list_item_1等。因为这些布局很常用，利用它们可以减少很多编码工作，而且后面要学习的 tabhost也是内置了一些预设置的layout或id来减少代码编写工作，如果不熟悉这些对未来扩展自定义UI将造成一定的难度。

 

 参考:http://stephen830.iteye.com/