要实现聊天功能中的发送不同类型的信息,比如纯文本、图片、语音、图文混排多媒体的数据等(具体效果看微信)。

这里使用AdapterTypeRender在BaseTypeAdapter(这个之后会讲到)中实现。

这里主要的实现方式是在ChatAdapter(继承BaseTypeAdapter)中根据每个position的item的type,来使用不同的AdapterTypeRender渲染器进行渲染。渲染的过程当然是在getView方法中进行。

1. AdapterTypeRender

先来看看AdapterTypeRender这个接口。它有3个方法:getConvertView()、fitEvents()、fitDatas()三个方法。

package com.wangjie.androidbucket.adapter;

import android.view.View;

/**
* 用于对不同类型item数据到UI的渲染
* Author: wangjie
* Email: tiantian.china.2@gmail.com
* Date: 9/14/14.
*/
public interface AdapterTypeRender { /**
* 返回一个item的convertView,也就是BaseAdapter中getView方法中返回的convertView
* @return
*/
View getConvertView(); /**
* 填充item中各个控件的事件,比如按钮点击事件等
*/
void fitEvents(); /**
* 对指定position的item进行数据的适配
* @param position
*/
void fitDatas(int position); }

-getconvertView()方法用于返回给BaseTypeAdapter一个convertView,一个AdapterTypeRender实现类对应一个convertView实例,该AdapterTypeRender可以被重用,所以convertView也可以被重用了。

-fitEvents()方法用于给当前的item中的各个控件注册事件,比如点击事件、touch事件等(具体的注册事件后面回讲到),因为这个方法是在getView中只有convertView为null时才会调用,所以只会调用一次,所以在这里添加事件是比较好的。

-fitDatas()方法用于把数据适配到item的各个view中进行显示。这个方法只要getView得到调用,就会被调用。

2. BaseTypeAdapter

这是一个抽象类,是继承于BaseAdapter的,重写了里面的getView方法。会自动根据指定position的item获取对应的type,然后通过type实例化一个AdapterTypeRender的实现,然后又使用了BaseAdapter中自带的convertView的重用机制进行对view的重用,同样也是对AdapterTypeRender的重用。

package com.wangjie.androidbucket.adapter.typeadapter;

import android.annotation.TargetApi;
import android.os.Build;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import com.wangjie.androidbucket.R; /**
* Author: wangjie
* Email: tiantian.china.2@gmail.com
* Date: 9/25/14.
*/
public abstract class BaseTypeAdapter extends BaseAdapter{
@TargetApi(Build.VERSION_CODES.DONUT)
@Override
public View getView(int position, View convertView, ViewGroup parent) {
AdapterTypeRender typeRender;
if(null == convertView){
typeRender = getAdapterTypeRender(position);
convertView = typeRender.getConvertView();
convertView.setTag(R.id.ab__id_adapter_item_type_render, typeRender);
typeRender.fitEvents();
}else{
typeRender = (AdapterTypeRender) convertView.getTag(R.id.ab__id_adapter_item_type_render);
}
convertView.setTag(R.id.ab__id_adapter_item_position, position); if(null != typeRender){
typeRender.fitDatas(position);
} return convertView;
} /**
* 根据指定position的item获取对应的type,然后通过type实例化一个AdapterTypeRender的实现
* @param position
* @return
*/
public abstract AdapterTypeRender getAdapterTypeRender(int position);
}

为了实现AdapterTypeRender的重用,一旦生成了一个AdapterTypeRender实现类的实例,则使用setTag的方法进行对convertView和AdapterTypeRender的绑定(R.id.ab__id_adapter_item_type_render这个id是在AndroidBucket中定义了的),这个可以参考以前的ViewHolder的写法。

为了实现在同一个item中的事件(这里以view的点击事件为例)响应都共用一个观察者的实例,需要在convertView中保存对应的position。这是因为同一个convertView因为使用了view的重用,是被非显示页面的很多个item所共用的。所以只需要,在当前显示的一屏中,每个convertView对应的postion即可,毕竟这些事件触发只有在当前显示的一屏中才会被触发。保存postion的方式依然使用了setTag的方式(R.id.ab__id_adapter_item_position这个id是在AndroidBucket中定义了的),注意:子类一般不需要重写getView方法了,其他的数据适配UI渲染都交给Render吧!

除了重写了getView方法之外,还定义了一个抽象方法:getAdapterTypeRender。这个方法需要子类去实现,需要告诉BaseTypeAdapter,指定position的item,它的type对应的AdapterTypeRender的实例是什么。

3. 自定义AdapterTypeRender的实现

接下来,就尝试自己实现几个不同布局的Render吧。这里假设需要实现两种:文本布局(TypeTextRender)、图片布局(TypeImageRender)。

a) TypeTextRender的实现:

package com.wangjie.activities.typerendertest.adapter;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.ProgressBar;
import android.widget.TextView;
import com.wangjie.androidbucket.adapter.typeadapter.AdapterTypeRender;
import com.wangjie.androidbucket.adapter.listener.OnConvertViewClickListener;
import com.wangjie.androidbucket.thread.ThreadPool;
import com.wangjie.androidbucket.utils.ABTimeUtil;
import com.wangjie.androidbucket.utils.ABViewUtil;
import com.wangjie.imageloadersample.imageloader.ImageLoader; /**
* Author: wangjie
* Email: tiantian.china.2@gmail.com
* Date: 9/14/14.
*/
public class TypeTextRender implements AdapterTypeRender {
private Context context;
private ChatAdapter adapter;
private View contentView; public TypeTextRender(Context context, ChatAdapter adapter) {
this.context = context;
this.adapter = adapter;
// 解析文本类型的布局
contentView = LayoutInflater.from(context).inflate(R.layout.item_type_text, null);
} @Override
public View getConvertView() {
// 返回文本类型的布局
return contentView;
} /**
* 这个方法同一个convertView只会被调用一次,所以可以放心地在这里执行事件地绑定,不用担心生成过多的OnClickListener等
*/
@Override
public void fitEvents() {
/**
* 生成一个在convertView中使用的clickListener
*/
OnConvertViewClickListener onConvertViewClickListener = new OnConvertViewClickListener(contentView, R.id.ab__id_adapter_item_position) {
@Override
public void onClickCallBack(View registedView, int... positionIds) {
ChatAdapter.OnChatItemListener onChatItemListener = adapter.getOnChatItemListener();
switch (registedView.getId()) {
case R.id.item_type_text_view:
if (null != onChatItemListener && null != positionIds && positionIds.length > 0) {
onChatItemListener.onItemClicked(positionIds[0]);
}
break; case R.id.item_type_text_head_iv:
if (null != onChatItemListener && null != positionIds && positionIds.length > 0) {
onChatItemListener.onHeadClicked(positionIds[0]);
}
break; } }
}; // 通过ABViewUtil从contentView中获取对应id的控件,然后设置OnClickListener
ABViewUtil.obtainView(contentView, R.id.item_type_text_view)
.setOnClickListener(onConvertViewClickListener);
ABViewUtil.obtainView(contentView, R.id.item_type_text_head_iv)
.setOnClickListener(onConvertViewClickListener); } private ImageView headIv;
private View rootView;
private TextView contentTv; @Override
public void fitDatas(int position) {
// 通过ABViewUtil从contentView中获取对应id的控件,然后设置OnClickListener
headIv = ABViewUtil.obtainView(contentView, R.id.item_type_text_head_iv);
contentTv = ABViewUtil.obtainView(contentView, R.id.item_type_text_content_tv);
/**
* 在这里适配数据到ui
*/
Message message = adapter.getItem(position);
contentTv.setText(message.getContent());
ImageLoader.getInstances().displayImage(message.getHeadUrl(), headIv, 100, null, R.drawable.default_head); } }

如上代码,该TypeTextRender实现了AdapterTypeRender接口,实现了其中的3个方法。注意:需要在构造方法中解析出convertView,用于提供给BaseTypeAdapter在getView中返回。

然后在fitEvents中注册各种事件,这里只注册了点击事件(一个rootView、一个headIv注册了点击事件)。这里的OnConvertViewClickListener是一个实现了View.OnClickListener的一个抽象类,生成一个OnConvertViewClickListener时需要传入convertView和positions的id,这样由于Render被重用后,convertView也是被重用了,导致onClickListener也是被重用了,这会导致响应点击事件的时候,回调的onClicked方法中无法得知点击的是哪个View,所以,需要把converView和positions的id传入,positions的id可以用来在convertView中绑定postion作为tag。positonsIds是一个可变长的参数,因为可能是一个ExpandableListView,需要groupPosition和childPosition两个positon来确定。回调的onClickCallBack中的参数registedView表示被点击的view,positionIds,被点击的item的positions(这个也是可以在AndroidBucket中找到,以后有时间会针对这个详细说明)。

“ABViewUtil.obtainView...”这个方法对viewHolder进行了封装,把convertView中的控件都缓存在了一个SparseArray<View>中(作用跟常用的ViewHolder相同)。

然后在fitDatas方法中就可以进行对数据的适配了,相当于我们以前在BaseAdapter的getView方法中的操作了。

b) TypeImageRender的实现(与TypeTextRender大同小异,不做过多的说明了):

package com.wangjie.activities.typerendertest.adapter;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.ProgressBar;
import android.widget.TextView;
import com.wangjie.androidbucket.adapter.typeadapter.AdapterTypeRender;
import com.wangjie.androidbucket.adapter.listener.OnConvertViewClickListener;
import com.wangjie.androidbucket.thread.ThreadPool;
import com.wangjie.androidbucket.utils.ABTimeUtil;
import com.wangjie.androidbucket.utils.ABViewUtil;
import com.wangjie.imageloadersample.imageloader.ImageLoader; /**
* Author: wangjie
* Email: tiantian.china.2@gmail.com
* Date: 9/14/14.
*/
public class ChatTypeImageRender implements AdapterTypeRender {
private Context context;
private ChatAdapter adapter;
private View contentView; public ChatTypeImageRender(Context context, ChatAdapter adapter) {
this.context = context;
this.adapter = adapter;
// 解析图片类型的布局
contentView = LayoutInflater.from(context).inflate(R.layout.item_type_text, null);
} @Override
public View getConvertView() {
// 返回文本类型的布局
return contentView;
} /**
* 这个方法同一个convertView只会被调用一次,所以可以放心地在这里执行事件地绑定,不用担心生成过多的OnClickListener等
*/
@Override
public void fitEvents() {
/**
* 生成一个在convertView中使用的clickListener
*/
OnConvertViewClickListener onConvertViewClickListener = new OnConvertViewClickListener(contentView, R.id.ab__id_adapter_item_position) {
@Override
public void onClickCallBack(View registedView, int... positionIds) {
ChatAdapter.OnChatItemListener onChatItemListener = adapter.getOnChatItemListener();
switch (registedView.getId()) {
case R.id.item_type_text_view:
if (null != onChatItemListener && null != positionIds && positionIds.length > 0) {
onChatItemListener.onItemClicked(positionIds[0]);
}
break; case R.id.item_type_text_head_iv:
if (null != onChatItemListener && null != positionIds && positionIds.length > 0) {
onChatItemListener.onHeadClicked(positionIds[0]);
}
break;
case R.id.item_type_text_content_iv:
if (null != onChatItemListener && null != positionIds && positionIds.length > 0) {
onChatItemListener.onImageClicked(positionIds[0]);
}
break; } }
}; // 通过ABViewUtil从contentView中获取对应id的控件,然后设置OnClickListener
ABViewUtil.obtainView(contentView, R.id.item_type_text_view)
.setOnClickListener(onConvertViewClickListener);
ABViewUtil.obtainView(contentView, R.id.item_type_text_head_iv)
.setOnClickListener(onConvertViewClickListener);
ABViewUtil.obtainView(contentView, R.id.item_type_text_content_iv)
.setOnClickListener(onConvertViewClickListener); } private ImageView headIv;
private View rootView;
private ImageView contentIv; @Override
public void fitDatas(int position) {
// 通过ABViewUtil从contentView中获取对应id的控件,然后设置OnClickListener
headIv = ABViewUtil.obtainView(contentView, R.id.item_type_text_head_iv);
contentIv = ABViewUtil.obtainView(contentView, R.id.item_type_text_content_iv);
/**
* 在这里适配数据到ui
*/
Message message = adapter.getItem(position);
ImageLoader.getInstances().displayImage(message.getHeadUrl(), headIv, 100, null, R.drawable.default_head);
ImageLoader.getInstances().displayImage(message.getContentUrl(), headIv, 100, null, R.drawable.default_pic); } }

3. BaseTypeAdapter的实现

到这里,我们已经定义好了各种type的Render了,现在需要在Adapter中去使用它,方法之前讲过,只要继承BaseTypeAdapter,然后实现里面的getAdapterTypeRender方法即可:

package com.wangjie.activities.typerendertest.adapter;

import android.content.Context;
import com.wangjie.androidbucket.adapter.typeadapter.AdapterTypeRender;
import com.wangjie.androidbucket.adapter.typeadapter.BaseTypeAdapter; import java.util.List; /**
* Author: wangjie
* Email: tiantian.china.2@gmail.com
* Date: 9/14/14.
*/
public class MessageAdapter extends BaseTypeAdapter { public static interface OnChatItemListener{
void onImageClicked(int position);
void onHeadClicked(int position);
void onItemClicked(int position);
}
private OnChatItemListener onChatItemListener;
public void setOnChatItemListener(OnChatItemListener onChatItemListener) {
this.onChatItemListener = onChatItemListener;
}
public OnChatItemListener getOnChatItemListener() {
return onChatItemListener;
} private Context context;
private List<Message> list;
public List<Message> getList() {
return list;
} public MessageAdapter(Context context, List<Message> list) {
this.context = context;
this.list = list;
} @Override
public int getCount() {
return list.size();
} @Override
public DoctorFriendMessageViewModelProxy getItem(int position) {
return list.get(position);
} @Override
public long getItemId(int position) {
return position;
} @Override
public int getItemViewType(int position) {
return list.get(position).getTyp();
} @Override
public int getViewTypeCount() {
return 2;
} @Override
public AdapterTypeRender getAdapterTypeRender(int position){
AdapterTypeRender typeRender = null;
switch(getItemViewType(position)){
case MessageConstants.MessageType.IMAGE:
typeRender = new ChatTypeImageRender(context, this);
break;
case MessageConstants.MessageType.TEXT:
default:
typeRender = new ChatTypeTextRender(context, this);
break;
}
return typeRender;
} }

使用AdapterTypeRender对不同类型的item数据到UI的渲染的更多相关文章

  1. [Android]使用AdapterTypeRender对不同类型的item数据到UI的渲染

    以下内容为原创,转载请注明: 来自天天博客:http://www.cnblogs.com/tiantianbyconan/p/3992843.html 本文讲的工具均放在AndroidBucket开源 ...

  2. zabbix命令:zabbix_get获取item数据

    zabbix命令:zabbix_get获取item数据 http://www.ttlsa.com/zabbix/zabbix-zabbix_get-get-items/

  3. 【转载】C#.NET WebApi返回各种类型(图片/json数据/字符串),.net图片转二进制流或byte

    C#.NET WebApi返回各种类型(图片/json数据/字符串),.net图片转二进制流或byte 转载:http://www.itdos.com/Mvc/20150302/0741255.htm ...

  4. java中,字符串类型的时间数据怎样转换成date类型。

    将字符串类型的时间转换成date类型可以使用SimpleDateFormat来转换,具体方法如下:1.定义一个字符串类型的时间:2.创建一个SimpleDateFormat对象并设置格式:3.最后使用 ...

  5. Scrapy基础(十二)————异步导出Item数据到Mysql中

    异步导出数据到Mysql中 上次说过从Item中同步写入数据库,因为网络的下载速度和数据库的I/O速度是不一样的所以有可能会发生下载快,但是写入数据库速度慢,造成线程的堵塞:关于堵塞和非堵塞,同步和异 ...

  6. 删除ListView item数据 页面不刷新

    最近碰到一个匪夷所思的事情.就是我删除listView中一条item数据  网络请求成功了 但是页面不成功,一番折腾 ,找到问题 ,原来我给item 添加了北京点击事假,又给listView 被禁设置 ...

  7. 将String类型的json数据转换为真正的json数据

    问题 在做JavaWeb项目的时候,我们经常需要将Java对象转化为Json数据格式响应到前台页面,但是转化完成之后,看着是Json类型的数据格式,但实际上是字符串类型,在这里说两个方法将String ...

  8. Vue2.0源码学习(1) - 数据和模板的渲染(上)

    准备 一.首先去GitHub上把vue源码download下来,传送门:https://github.com/vuejs/vue 二.搭建一个vue-cli跑起来,用于代码调试,不看着代码动起来只看源 ...

  9. WordPress主题制作教程10:添加文章类型插件Custom Post Type UI

    下载 Custom Post Type UI>> 用Custom Post Type UI添加自定义文章类型对于新手来说最简单不过了,下载安装后,在插件栏启用一下,就可以开始添加文章类型了 ...

随机推荐

  1. Office 365 - SharePoint 2013 Online 之母版页和页面布局

    1.打开https://login.microsoftonline.com,登陆,点击SharePoint,如下图: 2.打开网站集,可以查看.添加.删除等管理操作: 3.打开一个站点,如下图: 4. ...

  2. Android studio打包APK混淆配置

    要在打包APK时加入混淆需要在Module中的buid.gradle中加入如下信息 buildTypes { release { minifyEnabled true shrinkResources ...

  3. 【读书笔记】iOS-NSNumber

    NSArray和NSDictionary只能存储对象,而不能直接存储任何基本类型的数据,如int,float或struct.但是你可以用对象来封装基本数值.例如,将int型数据封装到一个对象中,然后就 ...

  4. iOS开发笔记4:HTTP网络通信及网络编程

    这一篇主要总结iOS开发中进行HTTP通信及数据上传下载用到的方法.网络编程中常用的有第三方类库AFNetworking或者iOS7开始新推出的NSURLSession,还有NSURLSession的 ...

  5. 关于第三方IOS的checkBox框架的使用

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  6. C++中的常量折叠

    先看例子: #include <iostream> using namespace std; int main() { ; int * p = (int *)(&a); *p = ...

  7. Hadoop从伪分布式到真正的分布式

    对这两天学习hadoop的一个总结,概念就不提了.直接说部署的事,关于如何部署hadoop网上的资料很多, 比较经典的还是Tim在IBM developworks上的系列文章 http://www.i ...

  8. mac:ssh登陆总是需要输入钥匙串密码解决

    方法1: finder -> 左上角:前往->按住option建->多出一个资源->KeyChains->第一个文件夹(删除掉次文件夹) 然后重启即可 方法2: ssh- ...

  9. Log4j配置与使用

    log4j是Java社区事实上的日志标准解决方案.使用起来比较简单. 一. 简单使用 1.下载jar包放到lib文件夹,并加入到build path中: 2.编写log4j.properties文件, ...

  10. SQL 报错信息整理及解决方案(持续更新)

    整理一下自己遇见过的 SQL 各种报错信息及相应解决方法,方便以后查阅,主要平台为 Oracle: ORA-01461: 仅能绑定要插入 LONG 列的 LONG 值: 原因:插入操作时,数据大于字段 ...