Android RecycleView实现混合Item布局
首先来看看效果吧:

本实例来自于慕课网的视屏http://www.imooc.com/video/13046,实现步骤可以自己去观看视屏,这里只记录了下实现的代码。
添加依赖:
(1) 在项目的build.gradle文件中添加下面的依赖
compile 'com.android.support:recyclerview-v7:25.0.0'
(2) 也可以在下图中自动进行依赖,选择RecycleView即可。

代码部分
直接代码传送门
MainActivity
public class MainActivity extends AppCompatActivity { private RecyclerView mRecyclerView;
private MyAdapter mMyAdapter; private int colors[] = {android.R.color.holo_blue_bright,android.R.color.black,android.R.color.holo_red_dark}; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initData();
} private void initView() {
mRecyclerView = (RecyclerView) findViewById(R.id.id_recyclerView);
mRecyclerView.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.VERTICAL,
false));
mMyAdapter = new MyAdapter(this);
mRecyclerView.setAdapter(mMyAdapter); } private void initData() {
List<Person> list= new ArrayList<>();
for (int i = ; i < ; i++) {
Person p = new Person();
int type = (int) (Math.random()*+);
p.type = type;
p.content="content"+;
p.avaterColor = colors[type-];
p.name = "name"+i;
list.add(p);
}
mMyAdapter.addList(list);
mMyAdapter.notifyDataSetChanged();
}
}
bean对象Person类
/**
* Created by 24540 on 2017/3/13.
*/ public class Person {
public static final int TYPE_ONE = ;
public static final int TYPE_TWO = ;
public static final int TYPE_THREE = ; protected int type;
protected int avaterColor;
protected int contentColor;
protected String name;
protected String content; public String getContent() {
return content;
} public void setContent(String content) {
this.content = content;
} public String getName() {
return name;
} public void setName(String name) {
this.name = name;
} public int getContentColor() {
return contentColor;
} public void setContentColor(int contentColor) {
this.contentColor = contentColor;
} public int getAvaterColor() {
return avaterColor;
} public void setAvaterColor(int avaterColor) {
this.avaterColor = avaterColor;
} public int getType() {
return type;
} public void setType(int type) {
this.type = type;
} public static int getTypeThree() {
return TYPE_THREE;
} public static int getTypeTwo() {
return TYPE_TWO;
}
public static int getTypeOne() {
return TYPE_ONE;
}
}
RecycleView的适配器
public class MyAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> { private LayoutInflater mLayoutInflater; private List<Person> mList = new ArrayList<>(); private Context mContext; public MyAdapter(Context mContext) {
this.mContext = mContext;
mLayoutInflater = LayoutInflater.from(mContext);
} //使用此方法从获取数据
public void addList(List<Person> list){
mList.addAll(list);
} @Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
//根据不同的viewType,创建并返回影响的ViewHolder
switch (viewType){
case Person.TYPE_ONE:
return new TypeOneHolder(mLayoutInflater.inflate(R.layout.item_type_one,parent,false));
case Person.TYPE_TWO:
return new TypeTwoHolder(mLayoutInflater.inflate(R.layout.item_type_two,parent,false));
case Person.TYPE_THREE:
return new TypeThreeHolder(mLayoutInflater.inflate(R.layout.item_type_three,parent,false));
}
return null;
} @Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
//抽象出TypeAbstartViewHolder,所以在进行绑定的时候可以直接调用
((TypeAbstartViewHolder)holder).bindHolder(mList.get(position));
} @Override
public int getItemViewType(int position) {
return mList.get(position).getType();
} @Override
public int getItemCount() {
return mList.size();
}
}
关键的一点,TypeAbstartViewHolder 抽象出bindHolder方法,优雅实现加载不同item布局,代码如下:
public abstract class TypeAbstartViewHolder extends RecyclerView.ViewHolder {
public TypeAbstartViewHolder(View itemView) {
super(itemView);
}
public abstract void bindHolder(Person person);
}
继承自上面抽象的方法,实现加载不同item布局TypeOneHolder:
public class TypeOneHolder extends TypeAbstartViewHolder {
private ImageView avater;
private TextView name; public TypeOneHolder(View itemView) {
super(itemView);
avater = (ImageView) itemView.findViewById(R.id.avater);
name = (TextView) itemView.findViewById(R.id.name);
}
//为ViewHolder绑定数据
@Override
public void bindHolder(Person person) {
avater.setBackgroundResource(person.getAvaterColor());
name.setText(person.getName());
}
}
TypeTwoHolde代码如下:
public class TypeTwoHolder extends TypeAbstartViewHolder {
private ImageView avater;
private TextView name;
private TextView content; public TypeTwoHolder(View itemView) {
super(itemView);
avater = (ImageView) itemView.findViewById(R.id.avater);
name = (TextView) itemView.findViewById(R.id.name);
content = (TextView) itemView.findViewById(R.id.content);
} //为ViewHolder绑定数据
@Override
public void bindHolder(Person person) {
avater.setBackgroundResource(person.getAvaterColor());
name.setText(person.getName());
content.setText(person.getContent());
}
}
TypeThreeHolder的代码如下:
public class TypeThreeHolder extends TypeAbstartViewHolder {
private ImageView avater;
private TextView name;
private TextView content;
private ImageView iv; public TypeThreeHolder(View itemView) {
super(itemView);
avater = (ImageView) itemView.findViewById(R.id.avater);
name = (TextView) itemView.findViewById(R.id.name);
content = (TextView) itemView.findViewById(R.id.content);
iv = (ImageView) itemView.findViewById(R.id.content_color);
} //为ViewHolder绑定数据
@Override
public void bindHolder(Person person) {
avater.setBackgroundResource(person.getAvaterColor());
name.setText(person.getName());
content.setText(person.getContent());
iv.setBackgroundResource(person.getAvaterColor());
}
}
xml文件代码部分:只放出了item_type_three部分的代码:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:background="@android:color/white"
android:layout_width="match_parent"
android:gravity="center_vertical"
android:layout_height="60dp"> <ImageView
android:id="@+id/avater"
android:layout_marginLeft="4dp"
android:layout_width="40dp"
android:layout_height="40dp"/> <LinearLayout
android:layout_toRightOf="@id/avater"
android:layout_marginLeft="5dp"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"> <TextView
android:id="@+id/name"
android:text="type_one_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/> <TextView
android:id="@+id/content"
android:layout_marginTop="5dp"
android:text="type_one_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout> <ImageView
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:id="@+id/content_color"
android:layout_width="100dp"
android:layout_height="40dp"/>
</RelativeLayout>
通过recycleView实现两个不同布局混搭,只需要修改mainActivity如下:
public class MainActivity extends AppCompatActivity { private RecyclerView mRecyclerView;
private MyAdapter mMyAdapter; private int colors[] = {android.R.color.holo_blue_bright, android.R.color.black, android.R.color.holo_red_dark}; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initData();
} private void initView() {
mRecyclerView = (RecyclerView) findViewById(R.id.id_recyclerView); //构造参数里面的2表示的是一行有两列
final GridLayoutManager manager = new GridLayoutManager(this, );
mRecyclerView.setLayoutManager(manager);
manager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {
@Override
public int getSpanSize(int position) {
int type = mRecyclerView.getAdapter().getItemViewType(position);
//若是TYPE_THREE,占用两列,否则占用一列
if (type == Person.TYPE_THREE) {
return manager.getSpanCount();
} else {
return ;
}
}
});
mMyAdapter = new MyAdapter(this); //给布局里的子view添加边距
mRecyclerView.addItemDecoration(new RecyclerView.ItemDecoration() {
@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
GridLayoutManager.LayoutParams layoutParams = (GridLayoutManager.LayoutParams) view.getLayoutParams();
int spanSize = layoutParams.getSpanSize();
int spanIndex = layoutParams.getSpanIndex();
outRect.top = ;
if (spanSize != manager.getSpanCount()) {
if (spanIndex == ) {
outRect.right = ;
} else {
outRect.right = ;
}
}
}
});
mRecyclerView.setAdapter(mMyAdapter); } private void initData() {
List<Person> list = new ArrayList<>();
for (int i = ; i < ; i++) {
Person p = new Person();
int type = (int) (Math.random() * + );
p.type = type;
p.content = "content" + ;
p.avaterColor = colors[type - ];
p.name = "name" + i;
list.add(p);
}
mMyAdapter.addList(list);
mMyAdapter.notifyDataSetChanged();
}
}
效果如图:

Android RecycleView实现混合Item布局的更多相关文章
- 2.Android 自定义通用的Item布局
转载:http://www.jianshu.com/p/e7ba4884dcdd BaseItemLayout 简介 在工作中经常会遇到下面的一些布局,如图标红处: 05.png 07.png 08. ...
- 对RecycleView的多种item布局的封装
本文是借鉴bingoogolapple写得BGAAdapter-Android而产生的,对此表示感谢. 效果 1.Adapter的使用 1.继承BaseAdapter 这里是我的adapter pub ...
- Android RecycleView多种布局实现(工厂模式)
RecycleView是个很常用的控件,很多APP中都可以看到它的身影,同时它也是个很难用的控件,主要就难在多种布局的实现. 在<第一行代码—Android>这本书里边有个RecycleV ...
- Android RecycleView 自定义Item的使用
自定义布局的RecycleView需要自己实现Adapter,ViewHolder和布局: 自定义Adapter继承RecycleView.Adapter,重写getItemCount(),onBin ...
- android RecycleView复杂多条目的布局
用RecycleView来实现布局形式.默认仅仅能指定一种布局格式.可是实际中我们的布局常常会用到多种类型的布局方式.怎样实现呢? 今天来说下经常使用的2钟方式. 第一种: 通过自己定义addHead ...
- 【转】Android ListView加载不同的item布局
原创教程,转载请保留出处:http://www.eoeandroid.com/thread-72369-1-1.html 最近有需求需要在listView中载入不同的listItem布局,开始 ...
- Android BaseAdapter加载多个不同的Item布局时出现UncaughtException in Thread main java.lang.ArrayIndexOutOfBoundsException: length=15; index=15
java.lang.ArrayIndexOutOfBoundsException: length=15; index=15 异常出现的场景:在做聊天界面时,需要插入表情,图片,文字,名片,还有几种较为 ...
- android RecycleView Adapter简单封装
早些时候我们使用系统提供个的BaseAdapter的时候为了满足大家的需要,我们总会对BaseAdapter做一层上层的封装,然后对于实际业务我们只需要关心getView里面的View即可,是代码可读 ...
- [Android] Android RecycleView和ListView 自定义Adapter封装类
在网上查看了很多对应 Android RecycleView和ListView 自定义Adapter封装类 的文章,主要存在几个问题: 一).网上代码一大抄,复制来复制去,大部分都运行不起来,或者 格 ...
随机推荐
- 什么是消息循环,一个简单的win32程序如何运行?
预备知识 1.什么是句柄? (HANDLE) 在win32编程中有各种句柄,那么什么是句柄呢? #define DECLARE_HANDLE(name) struct name##_ { int un ...
- 微信小程序分列显示数据
效果图 wxml代码 <view class='onehandle5'> <block wx:for="{{3}}" wx:for-index="k&q ...
- gulp使用文档
gulp的优势 易于使用:通过代码优于配置的策略,Gulp让简单的任务简单,复杂的任务可管理. 构建快速:利用 Node.js 流的威力,你可以快速构建项目并减少频繁的 IO 操作. 插件高质:Gul ...
- vue打包之后生成一个配置文件修改请求接口
问题描述: 在npm run build 生成dist后,url配置也被固定了,传到运行的前端服务器上后,假设某次,api服务器的ip修改了,改动只是更新下这个url,但是却需要回到前端源码,修改ur ...
- Nginx + Tomcat7 + redis session一致性问题
Nginx 作负载均衡时,由于是每次都需要把请求分发到不同的机器,同一个用户在一台机器上创建了 session,下一次的请求很有可能会转发到另外一台机器,会造成 session 丢失.我们可以使用 R ...
- Solr 6.7学习笔记(02)-- 配置文件 managed-schema (schema.xml)(1)
刚学Solr(版本6.7.0),新建一个core时,提示要求schema.xml文件,我找了半天也没在源码包中找到名为schema.xml的文件.这个版本其实用的是managed-schema文件,没 ...
- 《OD大数据实战》Spark入门实例
一.环境搭建 1. 编译spark 1.3.0 1)安装apache-maven-3.0.5 2)下载并解压 spark-1.3.0.tgz 3)修改make-distribution.sh VER ...
- linux中使用wget模拟爬虫抓取网页
如何在linux上或者是mac上简单使用爬虫或者是网页下载工具呢,常规的我们肯定是要去下载一个软件下来使用啦,可怜的这两个系统总是找不到相应的工具,这时wget出来帮助你啦!!!wget本身是拿来下载 ...
- Window安装配置Redis
一.下载windows版本的Redis github下载地址:https://github.com/MSOpenTech/redis/tags 二.安装启动Redis Redis 支持 32 位和 6 ...
- 浅谈关于SRAM与DRAM的区别
在上体系结构这门课之前,我只知道DRAM用作内存比较多,SRAM用作cache比较多.在今天讲到内存技术时,我对于这两个基础概念有了更加完整的认识.这篇文章是我的听课心得,现在分享给各位,仅供参考,若 ...