ListView 自定义Adapter 实现多视图Item


转载自http://www.devdiv.com/adapter_item_listview-article-3730-1.html


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中显示不同时视图的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,代码如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
        
    <TextView android:id="@+id/firstletter"
        style="?android:attr/listSeparatorTextViewStyle"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textColor="@android:color/white"
        />
    
</LinearLayout>


word_item.xml,代码如下:

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

    <TextView
        android:id="@+id/word"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:paddingLeft="8dp"
        android:paddingRight="8dp"
        android:paddingTop="8dp"
        android:singleLine="true"
        android:textColor="?android:attr/textColorPrimary"
        android:textSize="10pt"
        android:textStyle="bold" />

</LinearLayout>


这两个Item的布局文件非常简单,都是用了LinearLayout布局,布局中只有一个TextView显示文字,不做过多介绍。
JAVA代码如下:

package com.example.listview;

import android.app.ListActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

public class ListViewTypeViewActivity extends ListActivity {
	
	private static final String[] DATA = {"A","abnormal","acute","ambitious","B","banana","bill","C","canter","cury","D","david","dick","E","element",
		                                  "F","family","france","G","german","grant","H","hello","hill","J","jack","jude","K","karl","king",
		                                  "L","Lily","lucy","lucas","M","mom","mike","O","O'Neal","P","parker","pig","Q","queue","R","riky","ring","S","selina",
		                                  "T","Tina","V","victor","W","wander","win","X","x-men","Y","young","Z","zoom","Zuckerberg"};
	
	private LetterAdapter mLetterAdapter;
    
	/** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        
        mLetterAdapter = new LetterAdapter(DATA);
        setListAdapter(mLetterAdapter);        
    }
    
    private class LetterAdapter extends BaseAdapter {
    	
    	private String[] letter = {};
    	private LayoutInflater mInflater;  
    	//定义两个int常量标记不同的Item视图
    	public static final int FIRST_LETTER_ITEM = 0;
    	public static final int WORD_ITEM = 1;
    	
    	public LetterAdapter(String[] data) {
    		letter = data;
    		mInflater = LayoutInflater.from(getApplicationContext());
    	}

		@Override
		public int getItemViewType(int position) {
			// TODO Auto-generated method stub
			
			if(letter[position].length() == 1) {
				return FIRST_LETTER_ITEM;
			} else {
				return WORD_ITEM;
			}
		}

		@Override
		public int getViewTypeCount() {
			// TODO Auto-generated method stub
			//因为有两种视图,所以返回2
			return 2;
		}

		@Override
		public boolean isEnabled(int position) {
			// TODO Auto-generated method stub			
			return (letter[position].length() != 1);		
		}

		@Override
		public int getCount() {
			// TODO Auto-generated method stub
			return letter.length;
		}

		@Override
		public Object getItem(int position) {
			// TODO Auto-generated method stub
			return letter[position];
		}

		@Override
		public long getItemId(int position) {
			// TODO Auto-generated method stub
			return position;
		}

		@Override
		public View getView(int position, View convertView, ViewGroup parent) {
			// TODO Auto-generated method stub
			
			ViewHolder vh = null;
			
			if(convertView == null) {
				
				vh = new ViewHolder();
				
				if(getItemViewType(position) == FIRST_LETTER_ITEM) {
					convertView = mInflater.inflate(R.layout.first_letter_item, null);
					vh.tv = (TextView) convertView.findViewById(R.id.firstletter);
					
				} else {
				    convertView = mInflater.inflate(R.layout.word_item, null);
					vh.tv = (TextView) convertView.findViewById(R.id.word);
				}
				convertView.setTag(vh);
			} else {
				vh = (ViewHolder) convertView.getTag();
			}
			vh.tv.setText(letter[position]);
			return convertView;
		}
    }     
    
    static class ViewHolder{
		TextView tv;
	}		
}


该Demo中使用的自定义Adapter比之前的要复杂一些,通过复写一下方法实现分别显示两种视图的效果。
代码如下:

@Override
		public int getItemViewType(int position) {
			// TODO Auto-generated method stub
			
			if(letter[position].length() == 1) {
				return FIRST_LETTER_ITEM;
			} else {
				return WORD_ITEM;
			}
		}

		@Override
		public int getViewTypeCount() {
			// TODO Auto-generated method stub
			//因为有两种视图,所以返回2
			return 2;
		}


其中public int getViewTypeCount() 方法返回2,代表有两种视图,在public int getItemViewType(int position) 方法中根据字符串的长度,分别返回FIRST_LETTER_ITEM(0,代表“首字母视图”)和WORD_ITEM(1,代表“单词视图”)。
将“首字母”Item设置为不接收UI事件,也是根据字符串的长度,代码如下:

@Override
		public boolean isEnabled(int position) {
			// TODO Auto-generated method stub			
			return (letter[position].length() != 1);		
		}


在以上整个JAVA代码中,最重要的是public View getView(int position, View convertView, ViewGroup parent) 方法的实现。代码如下:

@Override
		public View getView(int position, View convertView, ViewGroup parent) {
			// TODO Auto-generated method stub
			
			ViewHolder vh = null;
			
			if(convertView == null) {
				
				vh = new ViewHolder();
				
				if(getItemViewType(position) == FIRST_LETTER_ITEM) {
					convertView = mInflater.inflate(R.layout.first_letter_item, null);
					vh.tv = (TextView) convertView.findViewById(R.id.firstletter);
					
				} else {
				    convertView = mInflater.inflate(R.layout.word_item, null);
					vh.tv = (TextView) convertView.findViewById(R.id.word);
				}
				convertView.setTag(vh);
			} else {
				vh = (ViewHolder) convertView.getTag();
			}
			vh.tv.setText(letter[position]);
			return convertView;
		}
    }     
    
    static class ViewHolder{
		TextView tv;
	}		


该方法中,采用了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时的一个技巧。



运行效果图





工程下载地址:http://download.csdn.net/detail/fx_sky/6702167




  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值