1、原理分析
Adapter对于ListView是非常重要的,它处于listView和数据源的中间,负责为ListView创建具体的视图。之前提到过ListView采用了View复用技术,即使需要显示大量的数据列表时它也能高效的工作,它总是试图复用已经存在的View。
下面就对View复用技术,做简单的讲解:
简单来说,假设一个ListView中存在7个Item,从上到下分别是Item1~Item7,当用户向上滑动屏幕时,Item1会滚动到屏幕区域以外,item1并没有被销毁,而是被放入了回收站(Recycler)。当ListView需要显示下一个item时,它会首先检查回收站里是否有可用的Item,刚好发现了item1,直接复用item1。ListView把获取到的Item1和新的位置(position8)传递给Adapter的getView方法,在getView方法中根据position8从数据源中取出对应的数据覆盖到item1,这时item1就变成了item8。最后,ListView把新生成item8显示到界面上。
而当ListView中存在不同视图的Item的时候,Adapter中存在一个int getViewTypeCount()方法返回item使用的View类型的数量(默认为1)。listView根据Adapter的这个方法的返回值,在回收站中建立对应数量的保存区域。而Adapter的int getItemViewType(int position):根据position获取对应item使用的View类型。 ListView会在回收站中根据类型建立不同的保存区域,listView会在调用Adapter 的getView方法之前,根据position获取正确类型的View进行复用。
通过以上两种方式,ListView实现了在单一Item视图和多种Item视图情况下,View的复用。
在上一次“ListView绑定EmptyView”的讲解中,进行了简单的Adapter的自定义实现,今天我们来讲解在ListView中显示不同时视图的Item。如果只显示单一视图的Item,只需要重写BaseAdapter的以下四个方法:
int getCount():返回数据源中数据项的总数量
Object getItem(int position):根据position从数据源中获取数据项
long getItemId(int position): 根据position从数据源中获取数据项ID
View getView(int position, View convertView, ViewGroup parent):根据position创建View,它是Adapter中最重要的方法,listView通过它创建View。
这也是进行自定义Adapter时必须要重写的方法。
要想实现多视图的Item的ListView,还需要重写Adapter的以下几个方法(不是必须要重写的):
int getViewTypeCount():返回item使用的View类型的数量,默认为1。
int getItemViewType(int position):根据position获取对应item使用的View类型。
boolean isEnabled (int position):根据position设置对应的item是否可用,即是否能接收UI事件。
其中,getItemViewType和getViewTypeCount通常需要配对使用
2、示例分析
这次的Demo实现的效果是,根据单词不同的首字母,在ListView中对字母进行分别显示。其中,单词的首字母作为各部分的分隔,使用不同于字母的显示视图。
因此在Demo中需要两种不同风格的视图。分别为:
first_letter_item.xml,代码如下:
01
|
<? xml version = "1.0" encoding = "utf-8" ?>
|
03
|
android:layout_width = "fill_parent"
|
04
|
android:layout_height = "fill_parent"
|
05
|
android:orientation = "vertical" >
|
07
|
< TextView android:id = "@+id/firstletter"
|
08
|
style = "?android:attr/listSeparatorTextViewStyle"
|
09
|
android:layout_width = "fill_parent"
|
10
|
android:layout_height = "wrap_content"
|
11
|
android:textColor = "@android:color/white"
|
word_item.xml,代码如下:
01
|
<? xml version = "1.0" encoding = "utf-8" ?>
|
03
|
android:layout_width = "fill_parent"
|
04
|
android:layout_height = "fill_parent"
|
05
|
android:orientation = "vertical"
|
06
|
android:paddingBottom = "8dp" >
|
09
|
android:id = "@+id/word"
|
10
|
android:layout_width = "fill_parent"
|
11
|
android:layout_height = "wrap_content"
|
12
|
android:paddingLeft = "8dp"
|
13
|
android:paddingRight = "8dp"
|
14
|
android:paddingTop = "8dp"
|
15
|
android:singleLine = "true"
|
16
|
android:textColor = "?android:attr/textColorPrimary"
|
17
|
android:textSize = "10pt"
|
18
|
android:textStyle = "bold" />
|
这两个Item的布局文件非常简单,都是用了LinearLayout布局,布局中只有一个TextView显示文字,不做过多介绍。
JAVA代码如下:
001
|
package com.devdiv.test.listviewtest6;
|
003
|
import android.app.ListActivity;
|
004
|
import android.os.Bundle;
|
005
|
import android.view.LayoutInflater;
|
006
|
import android.view.View;
|
007
|
import android.view.ViewGroup;
|
008
|
import android.widget.BaseAdapter;
|
009
|
import android.widget.ListView;
|
010
|
import android.widget.TextView;
|
012
|
public class ListViewTest6Activity extends ListActivity {
|
014
|
private LayoutInflater mInflater = null ;
|
016
|
private static final String[] DATA = { "a" , "abnormal" , "acute" , "ambitious" , "b" , "bed" , "bad" ,
|
017
|
"c" , "compare" , "communication" , "d" , "dad" , "e" , "element" };
|
019
|
private LetterAdapter mLetterAdapter;
|
021
|
/** Called when the activity is first created. */
|
023
|
public void onCreate(Bundle savedInstanceState) {
|
024
|
super .onCreate(savedInstanceState);
|
026
|
mInflater = LayoutInflater.from( this );
|
028
|
mLetterAdapter = new LetterAdapter(DATA);
|
029
|
setListAdapter(mLetterAdapter);
|
032
|
private class LetterAdapter extends BaseAdapter {
|
034
|
private String[] letter = {};
|
037
|
public static final int FIRST_LETTER_ITEM = 0 ;
|
038
|
public static final int WORD_ITEM = 1 ;
|
040
|
public LetterAdapter(String[] data) {
|
045
|
public int getItemViewType( int position) {
|
048
|
if (letter[position].length() == 1 ) {
|
049
|
return FIRST_LETTER_ITEM;
|
056
|
public int getViewTypeCount() {
|
063
|
public boolean isEnabled( int position) {
|
065
|
return (letter[position].length() != 1 );
|
069
|
public int getCount() {
|
071
|
return letter.length;
|
075
|
public Object getItem( int position) {
|
077
|
return letter[position];
|
081
|
public long getItemId( int position) {
|
087
|
public View getView( int position, View convertView, ViewGroup parent) {
|
090
|
ViewHolder vh = null ;
|
092
|
if (convertView == null ) {
|
094
|
vh = new ViewHolder();
|
096
|
if (getItemViewType(position) == FIRST_LETTER_ITEM) {
|
097
|
convertView = getLayoutInflater().inflate(R.layout.first_letter_item, parent, false );
|
099
|
vh.tv = (TextView) convertView.findViewById(R.id.firstletter);
|
102
|
convertView = getLayoutInflater().inflate(R.layout.word_item, parent, false );
|
104
|
vh.tv = (TextView) convertView.findViewById(R.id.word);
|
106
|
convertView.setTag(vh);
|
108
|
vh = (ViewHolder) convertView.getTag();
|
110
|
vh.tv.setText(letter[position]);
|
该Demo中使用的自定义Adapter比之前的要复杂一些,通过复写一下方法实现分别显示两种视图的效果。
代码如下:
02
|
public int getItemViewType( int position) {
|
05
|
if (letter[position].length() == 1 ) {
|
06
|
return FIRST_LETTER_ITEM;
|
13
|
public int getViewTypeCount() {
|
其中public int getViewTypeCount() 方法返回2,代表有两种视图,在public int getItemViewType(int position) 方法中根据字符串的长度,分别返回FIRST_LETTER_ITEM(0,代表“首字母视图”)和WORD_ITEM(1,代表“单词视图”)。
将“首字母”Item设置为不接收UI事件,也是根据字符串的长度,代码如下:
2
|
public boolean isEnabled( int position) {
|
4
|
return (letter[position].length() != 1 );
|
在以上整个JAVA代码中,最重要的是public View getView(int position, View convertView, ViewGroup parent) 方法的实现。代码如下:
02
|
public View getView( int position, View convertView, ViewGroup parent) {
|
07
|
if (convertView == null ) {
|
09
|
vh = new ViewHolder();
|
11
|
if (getItemViewType(position) == FIRST_LETTER_ITEM) {
|
12
|
convertView = getLayoutInflater().inflate(R.layout.first_letter_item, parent, false );
|
14
|
vh.tv = (TextView) convertView.findViewById(R.id.firstletter);
|
17
|
convertView = getLayoutInflater().inflate(R.layout.word_item, parent, false );
|
19
|
vh.tv = (TextView) convertView.findViewById(R.id.word);
|
21
|
convertView.setTag(vh);
|
23
|
vh = (ViewHolder) convertView.getTag();
|
25
|
vh.tv.setText(letter[position]);
|
该方法中,采用了View复用技术,如果converView为空,则根据不同的position,解析相应的xml布局文件,通过findViewById()的方式将获取到的TextView,并通过convertView.setTag(vh)将控件存放在ViewHolder中。如果convertView不为空,则直接通过vh = (ViewHolder) convertView.getTag()的方式取到之前存入的ViewHolder。
需要注意的是:
View中的setTag(Object tag)表示给View添加一个格外的数据(或理解为标志,可以用来区分一组相同类型的控件),以后可以用getTag()将这个数据取出来。
另外,将ViewHolder放入converView中,方便View复用的时候取出vh,可以对其中的TextView直接进行设置,省去了findViewById的过程。这是使用ListView时的一个技巧。
3、运行效果
--------------------------------------------------------------------------------------------------------------------------------------------
ListView 多布局Item复用优化
1、在BaseAdapter 中复写两个方法
getViewTypeCount();该方法返回多少个不同的布局,系统会缓存相应个数的convertView
getItemViewType(int position);根据position返回相应的Item类型
注意:
只有在Item布局类型循环展示时,才可复用到相应类型convertView。
如果随机展示不同类型的item,无法准确复用convertView,此时应保存记录每个posotion的view到一个集合中,这样每次展示该 position位置时,不用重新加载每个item view和findviewById()。
2、getView中:
1、先获取到当前item的类型
2、判断convertView是否为null
convertView 为null时,根据布局类型加载布局,findview,设置相应的Holder,并convertView.setTag(Holder);
convertView 不为null时;根据布局类型,通过convertView.getTag(); 获取Holder,并强转成当前类型的Holder。
例子:
package com.example.lvitems;
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;
public class MainActivity extends Activity {
private ListView listview;
private MyListAdapter1 adapter1;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listview = (ListView) findViewById(R.id.listview);
adapter1 = new MyListAdapter1(this);
listview.setAdapter(adapter1);
}
}
class MyListAdapter1 extends BaseAdapter {
private LayoutInflater mInflater;
public MyListAdapter1(Context context) {
mInflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
@Override
public int getCount() {
return 1000;
}
@Override
public Object getItem(int position) {
return null;
}
/**
* 该方法返回多少个不同的布局
*/
@Override
public int getViewTypeCount() {
return 5;
}
/**
* 根据position返回相应的Item类型
*/
@Override
public int getItemViewType(int position) {
// if (position >= 5) {
// return new Random().nextInt(5);
// }
return position % 5;
}
@Override
public long getItemId(int position) {
return 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
// 1获取当前item的类型
int type = getItemViewType(position);
System.out.println("convertView = " + convertView);
System.out.println("当前item的类型 " + type);
ViewHolder1 holder1 = null;
ViewHolder2 holder2 = null;
ViewHolder3 holder3 = null;
ViewHolder4 holder4 = null;
ViewHolder5 holder5 = null;
// 2判断是否有缓存,以及获取缓存的类型 如果item布局类型循环展示,不用走第2步直接走第4步
int temp = -1;
if (convertView != null) {
if (convertView.getTag() instanceof ViewHolder1) {
temp = 0;
} else if (convertView.getTag() instanceof ViewHolder2) {
temp = 1;
} else if (convertView.getTag() instanceof ViewHolder3) {
temp = 2;
} else if (convertView.getTag() instanceof ViewHolder4) {
temp = 3;
} else if (convertView.getTag() instanceof ViewHolder5) {
temp = 4;
}
System.out.println("缓存的类型 " + temp);
// 3判断缓存的类型是否是当前item要显示的类型?是,可复用;不是,设置convertView为空重新加载。
if (temp != type) {
convertView = null;
}
}
// 4 判断convertView是否为空?是,复用;不是,重新加载。
if (convertView == null) {
// 5.1根据类型 加载当前item要显示的布局,并让convertView setTag当前布局的holder
switch (type) {
case 0:
convertView = mInflater.inflate(R.layout.item1, null);
holder1 = new ViewHolder1();
holder1.tv = (TextView) convertView.findViewById(R.id.item1_tv);
convertView.setTag(holder1);
break;
case 1:
convertView = mInflater.inflate(R.layout.item2, null);
holder2 = new ViewHolder2();
holder2.tv1 = (TextView) convertView
.findViewById(R.id.item2_tv1);
holder2.tv2 = (TextView) convertView
.findViewById(R.id.item2_tv2);
convertView.setTag(holder2);
break;
case 2:
convertView = mInflater.inflate(R.layout.item3, null);
holder3 = new ViewHolder3();
holder3.tv1 = (TextView) convertView
.findViewById(R.id.item3_tv1);
holder3.tv2 = (TextView) convertView
.findViewById(R.id.item3_tv2);
holder3.tv3 = (TextView) convertView
.findViewById(R.id.item3_tv3);
convertView.setTag(holder3);
break;
case 3:
convertView = mInflater.inflate(R.layout.item4, null);
holder4 = new ViewHolder4();
holder4.tv1 = (TextView) convertView
.findViewById(R.id.item4_tv1);
holder4.tv2 = (TextView) convertView
.findViewById(R.id.item4_tv2);
holder4.tv3 = (TextView) convertView
.findViewById(R.id.item4_tv3);
holder4.tv4 = (TextView) convertView
.findViewById(R.id.item4_tv4);
convertView.setTag(holder4);
break;
case 4:
convertView = mInflater.inflate(R.layout.item5, null);
holder5 = new ViewHolder5();
holder5.tv1 = (ImageView) convertView
.findViewById(R.id.item5_tv1);
holder5.tv2 = (TextView) convertView
.findViewById(R.id.item5_tv2);
holder5.tv3 = (TextView) convertView
.findViewById(R.id.item5_tv3);
holder5.tv4 = (TextView) convertView
.findViewById(R.id.item5_tv4);
convertView.setTag(holder5);
break;
}
} else {
// 5.2根据类型 复用convertView getTag获取当前布局的holder
switch (type) {
case 0:
holder1 = (ViewHolder1) convertView.getTag();
holder1.tv.setText(type + "--" + position);
break;
case 1:
holder2 = (ViewHolder2) convertView.getTag();
holder2.tv1.setText(type + "--" + position);
holder2.tv2.setText(type + "--" + position);
break;
case 2:
holder3 = (ViewHolder3) convertView.getTag();
holder3.tv1.setText(type + "--" + position);
holder3.tv2.setText(type + "--" + position);
holder3.tv3.setText(type + "--" + position);
break;
case 3:
holder4 = (ViewHolder4) convertView.getTag();
holder4.tv1.setText(type + "--" + position);
holder4.tv2.setText(type + "--" + position);
holder4.tv3.setText(type + "--" + position);
holder4.tv4.setText(type + "--" + position);
break;
case 4:
holder5 = (ViewHolder5) convertView.getTag();
holder5.tv2.setText(type + "--" + position);
holder5.tv3.setText(type + "--" + position);
holder5.tv4.setText(type + "--" + position);
break;
}
}
// 6根据类型 获取当前布局的holder.并设置数据
return convertView;
}
class ViewHolder1 {
TextView tv;
}
class ViewHolder2 {
TextView tv1;
TextView tv2;
}
class ViewHolder3 {
TextView tv1;
TextView tv2;
TextView tv3;
}
class ViewHolder4 {
TextView tv1;
TextView tv2;
TextView tv3;
TextView tv4;
}
class ViewHolder5 {
ImageView tv1;
TextView tv2;
TextView tv3;
TextView tv4;
}
}