RecyclerView多布局显示数据

前言

RecyclerView是一个十分牛逼的控件，在列表显示的时候，几乎离不开它。由于列表显示的多样性，对RecyclerView对应的RecyclerView.Adapter要求也更多了些。那么今天我将引领大家以一种不同的角度来实现RecyclerView的多布局列表显示。

今天涉及的内容：

RecyclerView多type显示基本思路
RecyclerView多布局显示新思路
DefaultAdapter2实现列表展示
MainActivity中调用范例
效果图及项目结构图
DefaultAdapter2源码

先来波效果图
相同布局效果图

相同布局.gif

不同布局效果图

不同布局.gif

空布局效果图

空布局.gif

一.RecyclerView多type显示基本思路

一般我们在设置不同布局的列表展示的时候，大致做法如下：

public class HomePageAdapter extends RecyclerView.Adapter {
    public static final int TYPE_BANNER = 0;
    public static final int TYPE_AD = 1;
    public static final int TYPE_TEXT = 2;
    public static final int TYPE_IMAGE = 3;
    public static final int TYPE_NEW = 4;
    private List<HomePageEntry> mData;

    public void setData(List<HomePageEntry> data) {
        mData = data;
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        switch (viewType){
            case TYPE_BANNER:
                return new BannerViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.home_banner_layout,null));
            case TYPE_AD:
                return new BannerViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.home_ad_item_layout,null));
            case TYPE_TEXT:
                return new BannerViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.home_text_item_layout,null));
            case TYPE_IMAGE:
                return new BannerViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.home_image_item_layout,null));
            case TYPE_NEW:
                return new BannerViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.home_news_item_layout,null));
        }
        return null;
    }

    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
        int type = getItemViewType(position);
        switch (type){
            case TYPE_BANNER:
                // banner 逻辑处理
                break;
            case TYPE_AD:
                // 广告逻辑处理
                break;
            case TYPE_TEXT:
                // 文本逻辑处理
                break;
            case TYPE_IMAGE:
               //图片逻辑处理
                break;
            case TYPE_NEW:
                //视频逻辑处理
                break;
            // ... 此处省去N行代码
        }
    }

    @Override
    public int getItemViewType(int position) {
        if(position == 0){
            return TYPE_BANNER;//banner在开头
        }else {
            return mData.get(position).type;//type 的值为TYPE_AD，TYPE_IMAGE，TYPE_AD，等其中一个
        }

    }

    @Override
    public int getItemCount() {
        return mData == null ? 0:mData.size();
    }



    public static class BannerViewHolder extends RecyclerView.ViewHolder{

        public BannerViewHolder(View itemView) {
            super(itemView);
            //绑定控件
        }
    }

    public static class NewViewHolder extends RecyclerView.ViewHolder{

        public VideoViewHolder(View itemView) {
            super(itemView);
            //绑定控件
        }
    }
    public static class AdViewHolder extends RecyclerView.ViewHolder{

        public AdViewHolder(View itemView) {
            super(itemView);
            //绑定控件
        }
    }
    public static class TextViewHolder extends RecyclerView.ViewHolder{

        public TextViewHolder(View itemView) {
            super(itemView);
            //绑定控件
        }
    }
    public static class ImageViewHolder extends RecyclerView.ViewHolder{

        public ImageViewHolder(View itemView) {
            super(itemView);
            //绑定控件
        }
    }
}

这样做会导致Adapter类代码量过大，不利于维护。

二.RecyclerView多布局显示新思路

基于多布局的情况，思路是将每个要设置的数据都从adapter中抽离成一个单独的data，然后在单独的data中去设置控件初始化，数据展示和点击事件等，然后让总的adapter不会因为布局添加的种类和个数而做修改。
据此，我写了一个 DefaultAdapter2 类，继承自 RecyclerView.Adapter，重写 DefaultAdapter2 中的 onCreateViewHolder，onBindViewHolder，getItemViewType 方法，将布局设置，数据设置和控件等初始化均封装到接口 InterItemData 中，所有需要展示的数据均封装到 InterItemData 中，然后在 adapter 中的数据以 InterItemData 形式展示出来。

三.DefaultAdapter2实现列表展示

3.1 DefaultAdapter2初始化

    //声明
    private DefaultAdapter2 mNameAdapter;
    private List<DefaultAdapter2.InterItemData>mItemDatas;
    
    //初始化
    mItemDatas=new ArrayList<>();
    mNameAdapter=new DefaultAdapter2(mItemDatas,MainActivity.this);
    mNameAdapter.setRecyclerManager(mRecyclerView);

3.2 DefaultAdapter2设置相同布局的数据

        List<String>names=new ArrayList<>();
        for (int i = 0; i < 10; i++) {
            names.add("aa"+i);
        }
        //将names中的数据用DefaultAdapter2.InterItemData封装然后展示
        for (int i = 0; i < names.size(); i++) {
            String name=names.get(i);
            DefaultAdapter2.InterItemData itemData=new DefaultAdapter2.InterItemData() {
                @Override
                public int getLayoutId() {
                    return R.layout.item_layout;
                }

                @Override
                public void onBindView(DefaultAdapter2.ViewHolder viewHolder, int position) {
                    //初始化
                    TextView tv = (TextView) viewHolder.getView(R.id.tv);
                    //设置数据
                    String name = mItemDatas.get(position).getData().toString();
                    tv.setText(name);
                    //点击事件
                    tv.setOnClickListener(new View.OnClickListener() {
                        @Override
                        public void onClick(View v) {
                            ToastUtil.longShow(name);
                        }
                    });
                }

                @Override
                public <T> T getData() {
                    //设置数据源
                    return (T) name;
                }
            };
            //添加数据
            mItemDatas.add(itemData);
        }

3.3 DefaultAdapter2设置不同布局的数据

        //布局一数据
        DefaultAdapter2.InterItemData itemData1=new DefaultAdapter2.InterItemData() {
            @Override
            public int getLayoutId() {
                return R.layout.item_layout;
            }

            @Override
            public void onBindView(DefaultAdapter2.ViewHolder viewHolder, int position) {
                //初始化
                TextView tv = (TextView) viewHolder.getView(R.id.tv);
                //设置数据
                String name = mItemDatas.get(position).getData().toString();
                tv.setText(name);
                //点击事件
                tv.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        ToastUtil.longShow(name + "  " + position);
                    }
                });
            }

            @Override
            public <T> T getData() {
                //设置数据源
                return (T)"我是布局一";
            }
        };

        //布局二数据
        DefaultAdapter2.InterItemData itemData2=new DefaultAdapter2.InterItemData() {
            @Override
            public int getLayoutId() {
                return R.layout.empty_layout;
            }

            @Override
            public void onBindView(DefaultAdapter2.ViewHolder viewHolder, int position) {
                //初始化
                Button btn= (Button) viewHolder.getView(R.id.btn_reload);
                //设置数据
                String name = mItemDatas.get(position).getData().toString();
                btn.setText(name);
                //点击事件
                btn.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        ToastUtil.longShow(name+"中的按钮");
                    }
                });

                //布局尺寸
                ViewGroup.LayoutParams params= viewHolder.getItemHolderView().getLayoutParams();
                params.height= ViewGroup.LayoutParams.WRAP_CONTENT;
                viewHolder.getItemHolderView().setLayoutParams(params);

                //布局点击
                viewHolder.getItemHolderView().setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        ToastUtil.longShow(name + "  " + position);
                    }
                });
            }

            @Override
            public <T> T getData() {
                //设置数据源
                return (T)"我是布局二";
            }
        };

        //添加数据
        mItemDatas.add(itemData1);
        mItemDatas.add(itemData2);

3.4 DefaultAdapter2设置空布局

        //加载空布局
        DefaultAdapter2.InterItemData itemDataEmpty=new DefaultAdapter2.InterItemData() {
            @Override
            public int getLayoutId() {
                return R.layout.empty_layout;
            }

            @Override
            public void onBindView(DefaultAdapter2.ViewHolder viewHolder, int position) {
                //初始化
                Button btn= (Button) viewHolder.getView(R.id.btn_reload);
                //设置数据
                String name = mItemDatas.get(position).getData().toString();
                btn.setText(name);
                //点击事件
                btn.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        ToastUtil.longShow(name + "  " + position);
                    }
                });
            }

            @Override
            public <T> T getData() {
                //设置数据源
                return (T)"重新加载";
            }
        };
        //添加数据
        mItemDatas.add(itemDataEmpty);

四.MainActivity中调用范例

/**
 * Title:
 *
 * description:
 * autor:pei
 * created on ${DATE}
 */
public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private Button mBtn1;
    private Button mBtn2;
    private Button mBtn3;
    private RecyclerView mRecyclerView;

    private DefaultAdapter2 mNameAdapter;
    private List<DefaultAdapter2.InterItemData>mItemDatas;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initData();
        setListener();
    }

    private void initData() {
        mBtn1 = findViewById(R.id.btn1);
        mBtn2 = findViewById(R.id.btn2);
        mBtn3 = findViewById(R.id.btn3);
        mRecyclerView = findViewById(R.id.rv);



        mBtn1.setText("相同布局");
        mBtn2.setText("不同布局");
        mBtn3.setText("空布局");

        mItemDatas=new ArrayList<>();
        mNameAdapter=new DefaultAdapter2(mItemDatas,MainActivity.this);
        mNameAdapter.setRecyclerManager(mRecyclerView);

    }

    private void setListener() {
        mBtn1.setOnClickListener(this);
        mBtn2.setOnClickListener(this);
        mBtn3.setOnClickListener(this);

    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.btn1://加载多条数据
                //清理
                mItemDatas.clear();
                //加载多条数据
                loadMoreData();
                mNameAdapter.notifyDataSetChanged();
                break;
            case R.id.btn2://加载不同布局
                //清理
                mItemDatas.clear();
                //加载不同布局
                loadDiffLayoutData();
                mNameAdapter.notifyDataSetChanged();
                break;
            case R.id.btn3://加载空布局
                //清理
                mItemDatas.clear();
                //加载空布局
                loadEmptyLayoutData();
                mNameAdapter.notifyDataSetChanged();
                break;
            default:
                break;
        }
    }

    /**加载多条数据**/
    private void loadMoreData(){
        List<String>names=new ArrayList<>();
        for (int i = 0; i < 10; i++) {
            names.add("aa"+i);
        }
        //将names中的数据用DefaultAdapter2.InterItemData封装然后展示
        for (int i = 0; i < names.size(); i++) {
            String name=names.get(i);
            DefaultAdapter2.InterItemData itemData=new DefaultAdapter2.InterItemData() {
                @Override
                public int getLayoutId() {
                    return R.layout.item_layout;
                }

                @Override
                public void onBindView(DefaultAdapter2.ViewHolder viewHolder, int position) {
                    //初始化
                    TextView tv = (TextView) viewHolder.getView(R.id.tv);
                    //设置数据
                    String name = mItemDatas.get(position).getData().toString();
                    tv.setText(name);
                    //点击事件
                    tv.setOnClickListener(new View.OnClickListener() {
                        @Override
                        public void onClick(View v) {
                            ToastUtil.longShow(name);
                        }
                    });
                }

                @Override
                public <T> T getData() {
                    //设置数据源
                    return (T) name;
                }
            };
            //添加数据
            mItemDatas.add(itemData);
        }
    }

    /**加载不同布局**/
    private void loadDiffLayoutData(){
        //布局一数据
        DefaultAdapter2.InterItemData itemData1=new DefaultAdapter2.InterItemData() {
            @Override
            public int getLayoutId() {
                return R.layout.item_layout;
            }

            @Override
            public void onBindView(DefaultAdapter2.ViewHolder viewHolder, int position) {
                //初始化
                TextView tv = (TextView) viewHolder.getView(R.id.tv);
                //设置数据
                String name = mItemDatas.get(position).getData().toString();
                tv.setText(name);
                //点击事件
                tv.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        ToastUtil.longShow(name + "  " + position);
                    }
                });
            }

            @Override
            public <T> T getData() {
                //设置数据源
                return (T)"我是布局一";
            }
        };

        //布局二数据
        DefaultAdapter2.InterItemData itemData2=new DefaultAdapter2.InterItemData() {
            @Override
            public int getLayoutId() {
                return R.layout.empty_layout;
            }

            @Override
            public void onBindView(DefaultAdapter2.ViewHolder viewHolder, int position) {
                //初始化
                Button btn= (Button) viewHolder.getView(R.id.btn_reload);
                //设置数据
                String name = mItemDatas.get(position).getData().toString();
                btn.setText(name);
                //点击事件
                btn.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        ToastUtil.longShow(name+"中的按钮");
                    }
                });

                //布局尺寸
                ViewGroup.LayoutParams params= viewHolder.getItemHolderView().getLayoutParams();
                params.height= ViewGroup.LayoutParams.WRAP_CONTENT;
                viewHolder.getItemHolderView().setLayoutParams(params);

                //布局点击
                viewHolder.getItemHolderView().setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        ToastUtil.longShow(name + "  " + position);
                    }
                });
            }

            @Override
            public <T> T getData() {
                //设置数据源
                return (T)"我是布局二";
            }
        };

        //添加数据
        mItemDatas.add(itemData1);
        mItemDatas.add(itemData2);
    }

    /**加载空布局**/
    private void loadEmptyLayoutData(){
        //加载空布局
        DefaultAdapter2.InterItemData itemDataEmpty=new DefaultAdapter2.InterItemData() {
            @Override
            public int getLayoutId() {
                return R.layout.empty_layout;
            }

            @Override
            public void onBindView(DefaultAdapter2.ViewHolder viewHolder, int position) {
                //初始化
                Button btn= (Button) viewHolder.getView(R.id.btn_reload);
                //设置数据
                String name = mItemDatas.get(position).getData().toString();
                btn.setText(name);
                //点击事件
                btn.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        //ToastUtil.longShow(name + "  " + position);
                        ToastUtil.longShow("这里你可以重新获取数据");
                    }
                });
            }

            @Override
            public <T> T getData() {
                //设置数据源
                return (T)"重新加载";
            }
        };
        //添加数据
        mItemDatas.add(itemDataEmpty);
    }

}

五.效果图及项目结构图

相同布局效果图

相同布局.gif

不同布局效果图

不同布局.gif

空布局效果图

空布局.gif

项目结构图

image.png

六.DefaultAdapter2源码

DefaultAdapter2源码如下：

还有 11% 的精彩内容

支付 ¥3.00 继续阅读

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 212,542评论 6赞 493
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 90,596评论 3赞 385
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 158,021评论 0赞 348
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 56,682评论 1赞 284
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 65,792评论 6赞 386
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 49,985评论 1赞 291
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 39,107评论 3赞 410
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 37,845评论 0赞 268
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 44,299评论 1赞 303
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 36,612评论 2赞 327
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 38,747评论 1赞 341
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 34,441评论 4赞 333
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 40,072评论 3赞 317
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 30,828评论 0赞 21
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 32,069评论 1赞 267
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 46,545评论 2赞 362
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 43,658评论 2赞 350