Android高仿淘宝订单列表效果，列表中嵌套列表

2023-08-23 13:05| 来源: 网络整理| 查看: 265

Android高仿淘宝订单列表效果，列表中加列表，带刷新功能的列表嵌套列表

首先来看看效果图

是不是很熟悉？没错就是淘宝的订单页面

一开始看到的第一感觉是在RecyclerView中嵌套RecyclerView，一想到嵌套就完了，当然了也有大牛用嵌套很熟练的，本文采用iOS中的分组的概念进行拆分，一听是不是觉得很麻烦，其实也不麻烦，先来看看一张拆分图

如图所示，就是把一个item拆分为三个部分，Top，Content，Bottom 其实最主要的就是RecyclerView的adapter下面上代码

/** * @CreateDate: 2020/12/31 * @Author:lp * @Description: */ public class StoreAllOrderAdapter extends RecyclerView.Adapter { List list; //自定义item的点击事件接口 private OnRecyclerItemClick onRecyclerItemClick; public StoreAllOrderAdapter(List list) { this.list = list; } public void setOnRecyclerItemClick(OnRecyclerItemClick onRecyclerItemClick) { this.onRecyclerItemClick = onRecyclerItemClick; } @Override public BaseViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { BaseViewHolder vh = null; switch (viewType) { case 0: return new TopHolder(inflate(parent, R.layout.item_s_top)); case 1: return new BottomHolder(inflate(parent, R.layout.item_s_bottom)); case 2: return new GoodsHolder(inflate(parent, R.layout.item_s_in)); } return vh; } @Override public void onBindViewHolder(BaseViewHolder holder, int position) { holder.bindData(list.get(position), position); } @Override public int getItemCount() { return list == null ? 0 : list.size(); } @Override public int getItemViewType(int position) { Object content = list.get(position); if (content instanceof TopBean) { return 0; } if (content instanceof BottomBean) { return 1; } return 2; } private View inflate(ViewGroup parent, int layout) { return LayoutInflater.from(parent.getContext()).inflate(layout, parent, false); } public abstract class BaseViewHolder extends RecyclerView.ViewHolder { public BaseViewHolder(View itemView) { super(itemView); } public abstract void bindData(DATA data, int position); } /** * top部分 */ public class TopHolder extends BaseViewHolder { LinearLayout linearLayout; public TopHolder(View itemView) { super(itemView); linearLayout = itemView.findViewById(R.id.ist_ll); } @Override public void bindData(TopBean itemOrderTop, int position) { //TODO 处理数据 linearLayout.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if (onRecyclerItemClick != null) { onRecyclerItemClick.onItemChildClick(StoreAllOrderAdapter.this, v, itemOrderTop.getPosition()); } } }); } } /** * Bottom部分 */ public class BottomHolder extends BaseViewHolder { TextView rightTV; TextView leftTV; public BottomHolder(View itemView) { super(itemView); rightTV = itemView.findViewById(R.id.isb_right); leftTV = itemView.findViewById(R.id.isb_left); } @Override public void bindData(BottomBean itemOrderTop, int position) { //TODO 处理数据 rightTV.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if (onRecyclerItemClick != null) { onRecyclerItemClick.onItemChildClick(StoreAllOrderAdapter.this, v, itemOrderTop.getPosition()); } } }); leftTV.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if (onRecyclerItemClick != null) { onRecyclerItemClick.onItemChildClick(StoreAllOrderAdapter.this, v, itemOrderTop.getPosition()); } } }); } } /** * content部分 */ public class GoodsHolder extends BaseViewHolder { LinearLayout itemLL; public GoodsHolder(View itemView) { super(itemView); itemLL = itemView.findViewById(R.id.isi_ll); } @Override public void bindData(OrderBean orderBean, int position) { itemLL.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if (onRecyclerItemClick != null) { onRecyclerItemClick.onItemChildClick(StoreAllOrderAdapter.this, v, position); } } }); } } }

OnRecyclerItemClick是自定义的一个Item点击事件的接口

/** * @CreateDate: 2021/1/5 * @Author:lp * @Description: 自定义点击事件 */ public interface OnRecyclerItemClick{ void onItemChildClick(StoreAllOrderAdapter adapter, View view, int position); }

三个布局文件 item_s_top.xml

item_s_bottom.xml

item_s_in.xml

里面的一些冗余资源文件就不上传了，浪费空间，可以随便找找就行

TopBean.java

public class TopBean { int position; public TopBean() { } public TopBean(int position) { this.position = position; } public int getPosition() { return position; } public void setPosition(int position) { this.position = position; } }

BottomBean.java 以及OrderBean.java都和TopBean一样只是类名不一样而已，这里就不多于上传了，主要看功能需求，这里说一下为什么我要在三个实体类中添加一个position属性，主要就是为了区分在点击的时候是列表的位置，因为现在这个adapter是top一个item，内容是1+个item，底部是一个item，所以点击的时候是区分不了是列表的哪个位置如图：

因此在属性中添加了position标识数据，当然大家可能有更好的方案，这里赶项目就先这样写吧，后期在优化啦

这里写了一个初始化的方法，主要是看看数据格式：

private void initData2() { //一般都是从服务器拿过来的数据，这里随便写测试数据 List orderList = new ArrayList(); for (int i = 0; i < 15; i++) { List orderGroup = new ArrayList(); for (int k = 0; k < i + 1; k++) { OrderBean orderBean = new OrderBean(); orderGroup.add(orderBean); } orderList.add(orderGroup); } //拆分数据 if (orderList != null) { for (int i = 0; i < orderList.size(); i++) { orderContents2.add(new TopBean(i)); orderContents2.addAll(orderList.get(i)); orderContents2.add(new BottomBean(i)); } } allOrderAdapter.notifyDataSetChanged(); }

adapter的点击事件：

allOrderAdapter.setOnRecyclerItemClick(new OnRecyclerItemClick() { @Override public void onItemChildClick(StoreAllOrderAdapter adapter, View view, int position) { switch (view.getId()) { case R.id.ist_ll: showErrorToast("点击头部 item：" + position); break; case R.id.isb_right: showErrorToast("点击底部蓝色按钮 item：" + position); break; case R.id.isb_left: showErrorToast("点击底部灰色按钮 item：" + position); break; case R.id.isi_ll: showErrorToast("点击条目" + position); break; } } });

到这里基本也就结束啦，后期在优化吧

【本文地址】

公司简介

联系我们