Android列表组件ListView使用详解之ViewHolder提高效率

Android列表组件ListView，用于显示列表式的数据信息。自Android5.X版本起，官方推出了RecyclerView组件，在许多方面逐渐取代ListView，但ListView仍然得到了广泛的应用，后续的文章中会接着探讨RecyclerView。
使用ViewHolder模式旨在提高ListView加载数据的效率，充分利用ListView视图的缓存机制，避免在ListView适配器的getView()方法中每次都通过findViewById()方法来实例化组件。
效果图：


显示界面：package net.oschina.git.zhaikun.androiddeveloped.activitys;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.widget.ListView;

import net.oschina.git.zhaikun.androiddeveloped.R;
import net.oschina.git.zhaikun.androiddeveloped.adapter.ListViewDemoAdapter;

import java.util.ArrayList;
import java.util.List;

/**
* Created by zhaikun68 on 2018/3/5.
* <p>
* ListView演示Demo
*/
public class ListViewDemoActivity extends AppCompatActivity {

private ListView testLv;//ListView组件
private List<String> dataList = new ArrayList<>();//存储数据

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

init();//初始化数据及视图
}

/**
* 初始化数据及视图
*/
private void init() {
testLv = (ListView) findViewById(R.id.test_lv);

//初始化10项数据
for (int i = 1; i <= 10; i++) {
dataList.add("显示内容" + i);
}

//设置ListView的适配器
testLv.setAdapter(new ListViewDemoAdapter(this, dataList));
}
}显示界面对应的布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<ListView
android:id="@+id/test_lv"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>

数据适配器：

package net.oschina.git.zhaikun.androiddeveloped.adapter;

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;

import net.oschina.git.zhaikun.androiddeveloped.R;

import java.util.List;

/**
* Created by zhaikun68 on 2018/3/5.
* <p>
* ListView演示Demo中的数据适配器
*/
public class ListViewDemoAdapter extends BaseAdapter {

private Context context;//上下文对象
private List<String> dataList;//ListView显示的数据

/**
* 构造器
*
* @param context  上下文对象
* @param dataList 数据
*/
public ListViewDemoAdapter(Context context, List<String> dataList) {
this.context = context;
this.dataList = dataList;
}

@Override
public int getCount() {
return dataList == null ? 0 : dataList.size();
}

@Override
public Object getItem(int position) {
return dataList.get(position);
}

@Override
public long getItemId(int position) {
return position;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder;
//判断是否有缓存
if (convertView == null) {
convertView = LayoutInflater.from(context).inflate(R.layout.item_listview_demo, null);
viewHolder = new ViewHolder(convertView);
convertView.setTag(viewHolder);
} else {
//得到缓存的布局
viewHolder = (ViewHolder) convertView.getTag();
}

//设置图片
viewHolder.pictureImg.setImageResource(R.mipmap.ic_launcher);
//设置内容
viewHolder.contentTv.setText(dataList.get(position));

return convertView;
}

/**
* ViewHolder类
*/
private final class ViewHolder {

ImageView pictureImg;//图片
TextView contentTv;//内容

/**
* 构造器
*
* @param view 视图组件（ListView的子项视图）
*/
ViewHolder(View view) {
pictureImg = (ImageView) view.findViewById(R.id.picture_img);
contentTv = (TextView) view.findViewById(R.id.content_tv);
}
}
}

数据适配器中的子布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="5dp">

<ImageView
android:id="@+id/picture_img"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginRight="5dp"
android:src="@mipmap/ic_launcher"/>

<TextView
android:id="@+id/content_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="显示内容"/>
</LinearLayout>