ListView的优化

  五月，终于要过去了，为了毕业论文的事情已经大概忙了一个多月，来来回回学校和单位之间，真的是忙的不可开交，关键是答辩组的老师真变态，各种改，各种刁难啊，不过终于在我的努力下过了！好了，不吹牛了，不过那老师真的很烦人。

感觉都不知道写些什么，哎，肚子的存货太少了，只能怪自己这段日子读的书太少了，今后得好好补补。。。。。

那么今天就说下ListView的优化吧，由于本人的知识有限，写的都是一些基本的优化，看见的大神们多多提提意见。

对于ListView，相信做android开发的再熟悉不过了，这个最常用的一个组件，也是必须掌握的。但是在很多时候，如果处理不好，会出现各种各样的问题，比如加载图片的时候，图片乱跳，内存溢出等等。

那么下面就结合例子来说说吧。

主界面的布局文件就不帖了，太简单了，就是一个ListView。下面是主程序，这里我就直接在代码中模拟了一些数据。

package com.demo.listview;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import com.demo.listview.adapter.MyAdapter;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ListView;
import android.widget.Toast;

public class MainActivity extends Activity {

private ListView mListView;
private MyAdapter adapter;
private List<Map<String, Object>> mData;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

mListView = (ListView) this.findViewById(R.id.listView);
mData = getData();

adapter = new MyAdapter(this,mData);
mListView.setAdapter(adapter);

mListView.setOnItemClickListener(new OnItemClickListener() {

@Override
public void onItemClick(AdapterView<?> arg0, View view, int position,
long id) {
String title = (String)mData.get(position).get("title");
Toast.makeText(MainActivity.this, title, Toast.LENGTH_LONG).show();

}
});
}

/**
* 模拟服务器端的数据
* @return
*/
private List<Map<String, Object>> getData() {
List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();

Map<String, Object> map = new HashMap<String, Object>();
map.put("title", "title 1");
map.put("info", "info 1");
map.put("image", R.drawable.image1);
list.add(map);

map = new HashMap<String, Object>();
map.put("title", "title 2");
map.put("info", "info 2");
map.put("image", R.drawable.image2);
list.add(map);

map = new HashMap<String, Object>();
map.put("title", "title 3");
map.put("info", "info 3");
map.put("image", R.drawable.image3);
list.add(map);

map = new HashMap<String, Object>();
map.put("title", "title 4");
map.put("info", "info 4");
map.put("image", R.drawable.image4);
list.add(map);

map = new HashMap<String, Object>();
map.put("title", "title 5");
map.put("info", "info 5");
map.put("image", R.drawable.image5);
list.add(map);

map = new HashMap<String, Object>();
map.put("title", "title 6");
map.put("info", "info 6");
map.put("image", R.drawable.image6);
list.add(map);

map = new HashMap<String, Object>();
map.put("title", "title 7");
map.put("info", "info 7");
map.put("image", R.drawable.image7);
list.add(map);

map = new HashMap<String, Object>();
map.put("title", "title 8");
map.put("info", "info 8");
map.put("image", R.drawable.image8);
list.add(map);

return list;

}
}

下面是list_item.xml的布局文件，这个布局文件是ListView中每一个条目的显示风格，如果大家觉得这个不合适，可以自己自定义一个布局。

<?xml version="1.0" encoding="utf-8"?>
<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:orientation="vertical" >

<ImageView
android:id="@+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>

<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="15dp"
android:layout_toRightOf="@id/imageView"
android:textSize="20dp"
/>

<TextView
android:id="@+id/info"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_below="@id/title"
android:layout_toRightOf="@id/imageView"
android:paddingLeft="15dp"
android:textSize="15dp"
/>

</RelativeLayout>

那么每一个条目中的数据是如何设置的呢？就是通过适配器（Adapter）来将数据绑定到ListView中，一般来说，适配器都是自己来自定义的，因为在很多时候，系统提供的适配器都是无法满足我们的需求。

对于ListView的优化，主要是在表现在getView 这个方法中，这个方法是最重要的，也是最复杂的，getView()有三个参数，position表示将显示的是第几行（也就是第几个条目），covertView是从布局文件中inflate来的布局。

下面这段代码做了三个方面的优化，都是在getView方法里面，大家仔细看看。

首先是重用了convertView,这是因为ListView的自身的一个缓存机制，它会缓存条目中的一个条目item，当listview第一屏显示完成之后，就会出现一个缓存条目。大家想一想，如果不重用convertView，每次显示一个新的条目的时候，都会执行inflater方法，也就是说每次都要去解析我们的list_item布局文件，这是一个非常耗时的操作，一旦数据过多了，很容易内存溢出，并且会越来越卡，可以想象，这样写出来的APP是不堪入目的，估计也没几个人会用额。

第二个是减少findViewById的次数，findViewById是一个相对比较耗性能的操作，因为这个操作每次都需要到布局中去查找文件。把item里面的控件封装成一个javaBean，当item条目被加载的时候就去找到对应的控件。

package com.demo.listview.adapter;

import java.util.List;
import java.util.Map;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;

public class MyAdapter extends BaseAdapter {

private List<Map<String,Object>> lists;
private LayoutInflater mInflater;

public MyAdapter(Context context, List<Map<String, Object>> data) {
this.mInflater = LayoutInflater.from(context);
this.lists = data;
}

//共有多少个条目
@Override
public int getCount() {
return lists.size();
}

//返回一个条目
@Override
public Object g
4000
etItem(int position) {

return lists.get(position);
}

//每一个条目的Id
@Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return position;
}

//一个条目就是一个view，这个是最复杂的
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if(convertView == null){
holder = new ViewHolder();

convertView = mInflater.inflate(com.demo.listview.R.layout.list_item, null);

holder.title = (TextView) convertView.findViewById(com.demo.listview.R.id.title);
holder.info =(TextView) convertView.findViewById(com.demo.listview.R.id.info);
holder.image = (ImageView) convertView.findViewById(com.demo.listview.R.id.imageView);

convertView.setTag(holder);

}else{
holder = (ViewHolder) convertView.getTag();
}

holder.title.setText((String)lists.get(position).get("title"));
holder.info.setText((String)lists.get(position).get("info"));
holder.image.setBackgroundResource((Integer)lists.get(position).get("image"));

return convertView;
}

public final class ViewHolder{
public TextView title;
public TextView info;
public ImageView image;
}

}

这个是最基本的两种方法，但是在我们真正做项目的时候，往往图片都是从服务器下载的，那么这里就会出现一个很诡异的问题，图片会闪烁或者图片的位置和我们的文字不对应的情况。为什么出现这样的情况呢？

原因：刚刚我们提到了ListView条目的缓存机制，为了使我们的性能更好，就会复用convertView对象。我们在异步加载网络的图片的时候，可能由于下载的速度比较慢，就会出现图片闪烁，错乱的等问题。

a.图片错乱：某行条目显示了不是本条目的图片

当进入在ListView页面的时候，会显示一屏的数据和图片，如果当时的网速的比较慢，异步加载第2个条目的图片，在图片加载的过程中，我们将ListView滑动到了第10个条目，根据ListView的缓存原理，第2个条目已经不在屏幕中了，那么第10个条目已经复用了第2个条目的的View对象了，这个时候图片加载完成了，那么第10个条目就出现本该是第2个条目的图片了。

b.图片闪烁

将a的情况修改下，如果第10个条目的图片又很快的加载完成了，就会替换之间复用的图片，这样就出现了闪烁的情况。

上面这两种情况在实际的项目中经常出现的，所以一定要弄清楚。原因我们已经知道了，就是因为复用了convertView，那么我们就该想一个办法来避免这种情况。

解决的办法：就是每次getView的时候给对象一个标识，在异步加载完成的时候比较标示和当前条目的标示是否一致，如果一致就显示图片，反之就不显示。对于这个的demo我就不写了，网上百度一下很多人都写了。

好了，今天就写到这了。

枫