首页 > 代码库 > RecyclerView让列表嵌套如此简单

RecyclerView让列表嵌套如此简单

平常开发时,相信像这样的页面,大家一定是遇到过的。这里比较坑爹的地方在于呢:列表嵌套。订单列表中的每一项,都包含一个商品列表。像这种需求,大家会如何实现呢?

技术分享

这里呢,说一下我自己的思路,我没有使用列表嵌套,而是,将原有的Order拆分成了三个布局类型:Head、Body、Foot,一个Body就是一个商品,有多个商品就有多个Body。

然后,使用我自己封装的一套Adapter,让多布局更加简单易用。关于我的这个Adapter库,详见:Adapter的封装之路

不过,这里稍稍麻烦的一点就是,得到网络数据之后,我们需要对原始的List<Order>进行加工,转换成我们需要的List<LayoutWrapper>,具体转换的方法,类似于我这里的mockData里面的方法。

每一个LayoutWrapper都会持有:布局id、实体类、实体的展示类

其实,这里的实体展示类,如果是公用的,最好不要做成内部类,做成外部类

/** * 今日订单数 * <p> * 作者:余天然 on 2017/3/6 下午12:01 */@Route(path = "/home/order")public class TodayOrderActivity extends BaseActivity {    @BindView(R.id.rv_content)    RecyclerView rvContent;    int[] layoutIds = {            R.layout.item_home_order_head,            R.layout.item_home_order_body,            R.layout.item_home_order_foot,            R.layout.item_divider10_gray,            R.layout.item_divider10_white,    };    SuperAdapter adapter;    @Override    protected int createLayoutId() {        return R.layout.activity_today_order;    }    @Override    public void initWidget() {        setTitleText("今日订单");        rvContent.setLayoutManager(new LinearLayoutManager(this));        adapter = new SuperAdapter(this, layoutIds);        rvContent.setAdapter(adapter);        DividerFactory.setDivider(rvContent, DividerType.FOOT, R.color.gray_divider, R.dimen.divider_1, LinearLayoutManager.VERTICAL);        adapter.setData(mockData());    }    private List<LayoutWrapper> mockData() {        List<LayoutWrapper> wrappers = new ArrayList<>();        wrappers.add(new LayoutWrapper(R.layout.item_divider10_gray, "", null));        wrappers.add(new LayoutWrapper(R.layout.item_home_order_head, "广州尚都布业", headDisplayer));        wrappers.add(new LayoutWrapper(R.layout.item_home_order_body, "一键开单", bodyDisplayer));        wrappers.add(new LayoutWrapper(R.layout.item_home_order_foot, new FootItem(1, "90.00"), footDisplayer));        wrappers.add(new LayoutWrapper(R.layout.item_divider10_gray, "", null));        wrappers.add(new LayoutWrapper(R.layout.item_home_order_head, "王鹏", headDisplayer));        wrappers.add(new LayoutWrapper(R.layout.item_home_order_body, "全棉色织格子布", bodyDisplayer));        wrappers.add(new LayoutWrapper(R.layout.item_divider10_white, "", null));        wrappers.add(new LayoutWrapper(R.layout.item_home_order_body, "尼龙", bodyDisplayer));        wrappers.add(new LayoutWrapper(R.layout.item_home_order_foot, new FootItem(2, "170.00"), footDisplayer));        return wrappers;    }    DataDisplayer<String> headDisplayer = new DataDisplayer<String>() {        @Override        public void bindData(BaseViewHolder holder, String item, int position) {            holder.setText(R.id.tv_name, item);        }    };    DataDisplayer<String> bodyDisplayer = new DataDisplayer<String>() {        @Override        public void bindData(BaseViewHolder holder, String item, int position) {            holder.setText(R.id.tv_goods, item);        }    };    DataDisplayer<FootItem> footDisplayer = new DataDisplayer<FootItem>() {        @Override        public void bindData(BaseViewHolder holder, FootItem item, int position) {            String price = String.format("合计  ¥%s", item.price);            String number = String.format("(共%s件商品 优惠¥12 运费到付)", item.number);            holder.setText(R.id.tv_total_price, price);            holder.setText(R.id.tv_total_number, number);        }    };    class FootItem {        Integer number;        String price;        public FootItem(Integer number, String price) {            this.number = number;            this.price = price;        }    }}

 

 

RecyclerView让列表嵌套如此简单