想做一个能够实现多种类型布局放在一个RecyclerView中的页面,Demo最终的效果是下面这个样子:
可以看到,整个列表中,有视频布局,纯文本的笑话布局,长图片布局,动态图片布局;最后两个可以合并在一个布局里去展示。
所以首先,要显示上面的东西需要用到下面这些控件:
1.节操播放器(大概是很久以前的名字了,这个控件经常改名字)
github地址:https://github.com/lipangit/JiaoZiVideoPlayer
使用方法是添加依赖:
compile 'cn.jzvd:jiaozivideoplayer:6.1.2'
2.Glide,这个就不谈了:
compile 'com.github.bumptech.glide:glide:3.7.0'
3.RecyclerView,这个更不谈了,反正和V7库什么的一起添加依赖吧。还有联网权限就不说了。
之前是使用的ListView去实现这个效果的,不过现在RecyclerView才是大势所趋呀(我是看《第二行代码》里面郭神说的),反正ListView能做的,RecyclerView都可以。
虽然使用过多次RecyclerView,但是具体怎么去实现这么一个效果还是有点小麻烦的,所以就上网看到了下面这两篇大佬(人人皆大佬,唯我一小生)的文章,简洁明了,蛮容易看懂:
RecyclerView用法(一)——展示多种类型Item数据
http://blog.csdn.net/cxc19890214/article/details/49226743
RecyclerView实现多种item布局
http://blog.csdn.net/zhumintao/article/details/53023920
想快速上手的小伙伴建议先去看上面的就OK了,我只是想记录一下我的学习成果,所以写的这篇文章。
如果是在ListView中去实现这样的效果,需要多写两个方法
@Override
public int getItemViewType(int position) {
return super.getItemViewType(position);
}
@Override
public int getViewTypeCount() {
return super.getViewTypeCount();
}
一个是获取item的类型,另外一个是获取所有类型的数量,如果有5种类型,下面那个方法就返回5。
但是在RecyclerView中,只能看得到第一个方法,而第二个方法就相当于onCreateViewHolder(ViewGroup parent, int viewType)中的第二个参数。
所以创建一个RecyclerView的适配器TypesNewsRecyclerAdapter;
public class TypesNewsRecyclerAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder>{
}
之前只有一种数据的时候,上面的ViewHolder就是这种数据的ViewHolder,不过现在有多种数据了,ViewHolder自然不能写成某一种,而是需要写成RecyclerView.ViewHolder,然后同样让所有类型的ViewHolder的继承RecyclerView.ViewHolder。
然后我需要三种类型的ViewHolder,分别是视频,文本,图片,所以首先创建三个标识符:
private static final int TYPE_VIDEO = 0; //视频类型
private static final int TYPE_IMAGE = 1; //图片类型
private static final int TYPE_TEXT = 2; //文本类型
接着在getItemViewType中分别给从网络返回的type数据赋值:
@Override
public int getItemViewType(int position) {
ManyTypesNewsBean.ShowapiResBodyBean.PagebeanBean.ContentlistBean data = dataList.get(position);
String type = data.getType();
int itemViewType = -1;
if ("41".equals(type)) {
itemViewType = TYPE_VIDEO;
} else if ("10".equals(type)) {
itemViewType = TYPE_IMAGE;
} else if ("29".equals(type)) {
itemViewType = TYPE_TEXT;
}
return itemViewType;
}
然后为每种类型创建对应的ViewHolder:
class VideoViewHolder extends RecyclerView.ViewHolder{
public VideoViewHolder(View itemView) {
super(itemView);
}
}
class ImageViewHolder extends RecyclerView.ViewHolder{
public ImageViewHolder(View itemView) {
super(itemView);
}
}
class TextViewHolder extends RecyclerView.ViewHolder{
public TextViewHolder(View itemView) {
super(itemView);
}
}
可以从最上面的最终效果看到,每一种布局都有相同的部分,