使用RecyclerView写树形结构的TreeRecyclerView

本文介绍如何在Android中创建树形结构的控件,通过使用RecyclerView而非嵌套ListView。通过调整Item的marginLeft反映层级关系,动态添加或删除Item来实现展开和收起效果。讲解了数据模型、ViewHolder及Adapter的实现,并提供了Demo的Github链接。
摘要由CSDN通过智能技术生成

简介

android是不提供树形控件的,如果需要使用树形控件,我们应该怎么做呢?
先看效果
GIF
上图是一个明显的树形结构

实现原理

在逻辑上,它们是包含关系,数据结构上是多叉树,这是毋庸置疑的。但是,显示的时候,我们有必要嵌套ListView或RecyclerView吗?当然没有必要!

  • 每一而Item,在显示的时候,都是平级的,只是它们marginLeft不同而已。
  • 更新marginLeft来体现它们的层级关系。marginLeft的值与item在逻辑上的深度有线性关系。
  • 展开一个Item的时候,是动态的添加一系列的item。
  • 收起一个Item的时候,我们是删除一系列的item.

好了,原理已经说明白了,那就看看源码怎么写吧。

注:

  • 我们以android的文件系统的树形结构为例
  • 为了动画的流畅性,我们使用RecyclerView,注意,ListView在添加和删除item时,是直接突变的。

Code

  • 数据模型ItemData

public class ItemData implements Comparable<ItemData> {
   

    public static final int ITEM_TYPE_PARENT = 0;
    public static final int ITEM_TYPE_CHILD = 1;

    private String uuid;

    private int type;// 显示类型
    private String text;
    private String path;// 路径
    private int treeDepth = 0;// 路径的深度

    private List<ItemData> children;

    private boolean expand;// 是否展开

    ...

}
  • 父节点对应的ViewHolder

/**
 * @Author Zheng Haibo
 * @PersonalWebsite http://www.mobctrl.net
 * @Description
 */
public class ParentViewHolder extends BaseViewHolder {
   

    public ImageView image;
    public TextView text;
    public ImageView expand;
    public TextView count;
    public RelativeLayout relativeLayout;
    private int itemMargin;

    public ParentViewHolder(View itemView) {
        super(itemView);
        image = (ImageView) itemView.findViewById(R.id.image);
        text = (TextView) itemView.findViewById(R.id.text);
        expand = (ImageView) itemView.findViewById(R.id.expand);
        count = (TextView) itemView.findViewById(R.id.count);
        relativeLayout = (RelativeLayout) itemView.findViewById(R.id.container);
        itemMargin = itemView.getContext().getResources()
                .getDimensionPixelSize(R.dimen.item_margin);
    }

    public void bindView(final ItemData itemData, final int position,
            final ItemDataClickListener imageClickListener) {
        RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) expand
                .getLayoutParams();
        params.leftMargin = itemMargin * itemData.getTreeDepth();
        expand.setLayoutParams(params);
        text.setText(itemData.getText());
        if (itemData.isExpand()) {
            expand.setRotation(45);
            List<ItemData> children = itemData.getChildren();
            if (children != null) {
                count.setText(String.format("(%s)", itemData.getChildren()
                        .size()));
            }
            count.setVisib
快速实现Android多级树形列表,这个库是在鸿洋多级树形列表demo中修改而来。解决的问题:支持ID为int类型和String类型。支持多级复选框选中,使用只需一行代码。支持动态更新数据并保持原有展开/关闭状态。支持ListViewRecyclerView。USE我们关联列表树需要有三个必须元素,当前id、父级id即pid,显示的内容。id和pid可以为int或者String以及其他类型。要显示的内容需要包装一下://id pid name  FileNode为实际用的实体Bean对象 mlist.add(new Node("223","0","我也是添加的root节点",new FileNode()));对于ListView,需要继承自TreeListViewAdapter,如:public class SimpleTreeAdapter extends TreeListViewAdapter {     public SimpleTreeAdapter(ListView mTree, Context context, List datas, int defaultExpandLevel, int iconExpand, int iconNoExpand) {         super(mTree, context, datas, defaultExpandLevel, iconExpand, iconNoExpand);     }     public SimpleTreeAdapter(ListView mTree, Context context, List datas,                              int defaultExpandLevel) {         super(mTree, context, datas, defaultExpandLevel);     }     @Override     public View getConvertView(final Node node , int position, View convertViewViewGroup parent)     {        final ViewHolder viewHolder ;         if (convertView == null) {             convertView = mInflater.inflate(R.layout.list_item, parent, false);             viewHolder = new ViewHolder();             viewHolder.cb = (CheckBox) convertView                     .findViewById(R.id.cb_select_tree);             viewHolder.label = (TextView) convertView                     .findViewById(R.id.id_treenode_label);             viewHolder.icon = (ImageView) convertView.findViewById(R.id.icon);             convertView.setTag(viewHolder);         } else {             viewHolder = (ViewHolder) convertView.getTag();         }         viewHolder.cb.setOnClickListener(new View.OnClickListener() {             @Override             public void onClick(View v) {                 setChecked(node,viewHolder.cb.isChecked());             }         });         if (node.isChecked()){             viewHolder.cb.setChecked(true);         }else {             viewHolder.cb.setChecked(false);         }         if (node.getIcon() == -1) {             viewHolder.icon.setVisibility(View.INVISIBLE);         } else {             viewHolder.icon.setVisibility(View.VISIBLE);             viewHolder.icon.setImageResource(node.getIcon());         }         viewHolder.label.setText(node.getName());         return convertView;     }     private final class ViewHolder     {         ImageView icon;         CheckBox cb;         TextView label;     } }对于RecyclerView,需继承自TreeRecyclerAdapter,如:public class SimpleTreeRecyclerAdapter extends TreeRecyclerAdapter {     public SimpleTreeRecyclerAdapter(RecyclerView mTree, Context context, List datas, int defaultExpandLevel, int iconExpand, int iconNoExpand) {         super(mTree, context, datas, defaultExpandLevel, iconExpand, iconNoExpand);     }     public SimpleTreeRecyclerAdapter(RecyclerView mTree, Context context, List datas, int defaultExpandLevel) {         super(mTree, context, datas, defaultExpandLevel);     }     @Override     public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {         return new MyHoder(View.inflate(mContext, R.layout.list_item,null));     }     @Override     public void onBindViewHolder(final Node node, RecyclerView.ViewHolder holder, int position) {         final MyHoder viewHolder = (MyHoder) holder;         //todo do something         viewHolder.cb.setOnClickListener(new View.OnClickListener() {             @Override             public void onClick(View v) {                 setChecked(node,viewHolder.cb.isChecked());             }         });         if (node.isChecked()){             viewHolder.cb.setChecked(true);         }else {             viewHolder.cb.setChecked(false);         }         if (node.getIcon() == -1) {             viewHolder.icon.setVisibility(View.INVISIBLE);         } else {             viewHolder.icon.setVisibility(View.VISIBLE);             viewHolder.icon.setImageResource(node.getIcon());         }         viewHolder.label.setText(node.getName());     }     class MyHoder extends RecyclerView.ViewHolder{         public CheckBox cb;         public TextView label;         public ImageView icon;         public MyHoder(View itemView) {             super(itemView);             cb = (CheckBox) itemView                     .findViewById(R.id.cb_select_tree);             label = (TextView) itemView                     .findViewById(R.id.id_treenode_label);             icon = (ImageView) itemView.findViewById(R.id.icon);         }     } }初始化: ListView://第一个参数  ListView //第二个参数  上下文 //第三个参数  数据集 //第四个参数  默认展开层级数 0为不展开 //第五个参数  展开的图标 //第六个参数  闭合的图标 mAdapter = new SimpleTreeAdapter(mTree, ListViewActivity.this,                         mDatas, 1,R.mipmap.tree_ex,R.mipmap.tree_ec); mTree.setAdapter(mAdapter);RecyclerView://第一个参数  RecyclerView //第二个参数  上下文 //第三个参数  数据集 //第四个参数  默认展开层级数 0为不展开 //第五个参数  展开的图标 //第六个参数  闭合的图标 mAdapter = new SimpleTreeRecyclerAdapter(mTreeRecyclerViewActivity.this,                 mDatas, 1,R.mipmap.tree_ex,R.mipmap.tree_ec); mTree.setAdapter(mAdapter);添加数据,可以保持原有选中或者展开状态:List mlist = new ArrayList(); mlist.add(new Node("223","0","我也是添加的root节点",new FileNode())); mAdapter.addData(0,mlist);获取选中内容:如果node的isChecked()为true,即为选中状态。StringBuilder sb = new StringBuilder(); //获取排序过的nodes //如果不需要刻意直接用 mDatas既可 final List allNodes = mAdapter.getAllNodes(); for (int i = 0; i < allNodes.size(); i ) {    if (allNodes.get(i).isChecked()){        sb.append(allNodes.get(i).getName() ",");    } } String strNodesName = sb.toString(); if (!TextUtils.isEmpty(strNodesName))    Toast.makeText(this, strNodesName.substring(0, strNodesName.length()-1),Toast.LENGTH_SHORT).show();控制父子之间联动的选中与取消状态,只需调用setChecked方法既可,注意如果在setOnCheckedChangeListener中处理会有问题:因为如果要子节点/父节点选中或者取消需要刷新页面,而刷新页面又会触发viewHolder.cb.setChecked(true/false);的判断从而又会进入setOnCheckedChangeListener,会导致如果父节点选中某些子节点取消不了的情况。//viewHolder.cb 为CheckBox  viewHolder.cb.setOnClickListener(new View.OnClickListener() {             @Override             public void onClick(View v) {                 setChecked(node,viewHolder.cb.isChecked());             }         });
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值