ExpandableListView多及列表(三级列表)

最新推荐文章于 2023-08-25 17:18:29 发布
最新推荐文章于 2023-08-25 17:18:29 发布
阅读量3.1k 收藏 15
点赞数 5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lijinweii/article/details/73200578
版权

上一篇我们介绍了ExpandableListView多级列表的二级列表，见天我们分析下多级列表(三级)的情况。我们先看下效果图：

通过效果图分析：这是一个三级列表分类 ，主要是由ExpandableListView 控件实现，和上一篇二级列表相似。下面我们看一下代码：

1.先看一下主类的xml文件 和 主代码：通过ExpandableListView实现。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.fanhaichao.myapplication.MainActivity">

    <ExpandableListView
        android:id="@+id/eList"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:groupIndicator="@null" />

</RelativeLayout>
再看下代码： 

/**
 * @email shexiaoheng@163.com
 * @blog <a href='http://blog.csdn.net/shexiaoheng'>http://blog.csdn.net/shexiaoheng</a >
 * @Detail 本Demo为ExpandableListView嵌套ExpandableListView实现三级菜单的例子
 * #ParentAdapter.OnChildTreeViewClickListener
 */
public class MainActivity extends AppCompatActivity implements ExpandableListView.OnGroupExpandListener, ParentAdapter.OnChildTreeViewClickListener {
    
    private Context mContext;
    private ExpandableListView eList;
    private ArrayList<ParentEntity> parents;
    private ParentAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mContext = this;
        loadData();//获取数据，假数据
        initEList();//初始化

    }
    
    /**
     * 初始化菜单数据源
     */
    private void loadData() {

        parents = new ArrayList<ParentEntity>();
        for (int i = 0; i < 15; i++) {
            ParentEntity parent = new ParentEntity(); //父类对象
            parent.setGroupName("父类父分组第" + i + "项");//假数据 ，设置一级列表数据
            parent.setGroupColor(getResources().getColor(android.R.color.holo_red_light));//红色 ，一级列表颜色

            ArrayList<ChildEntity> childs = new ArrayList<ChildEntity>();
            for (int j = 0; j < 10; j++) {
                ChildEntity child = new ChildEntity(); //子类对象
                child.setGroupName("子类父分组第" + j + "项");//假数据 ，二级列表数据
                child.setGroupColor(Color.parseColor("#ff00ff"));//紫色   二级列表颜色

                ArrayList<String> childNames = new ArrayList<String>();
                ArrayList<Integer> childColors = new ArrayList<Integer>();

                for (int k = 0; k < 5; k++) {
                    childNames.add("子类第" + k + "项");//假数据 三级列表数据
                    childColors.add(Color.parseColor("#ff00ff"));//紫色

                }
                child.setChildNames(childNames);
                childs.add(child);
            }
            parent.setChilds(childs);
            parents.add(parent);
        }
    }

    /**
     * 初始化ExpandableListView
     */
    private void initEList() {
        eList = (ExpandableListView) findViewById(R.id.eList);
        eList.setOnGroupExpandListener(this);
        adapter = new ParentAdapter(mContext, parents);//父类分组适配器
        eList.setAdapter(adapter);
        adapter.setOnChildTreeViewClickListener(this);//设置条目点击事件

    }
    
    /**
     * 点击子ExpandableListView的子项时，回调本方法，根据下标获取值来做相应的操作
     */
    @Override
    public void onClickPosition(int parentPosition, int groupPosition, int childPosition) {
        // do something
        String childName = parents.get(parentPosition).getChilds()
                .get(groupPosition).getChildNames().get(childPosition)
                .toString();
        Toast.makeText(
                mContext,
                "点击的下标为： parentPosition=" + parentPosition
                        + "   groupPosition=" + groupPosition
                        + "   childPosition=" + childPosition + "\n点击的是："
                        + childName, Toast.LENGTH_SHORT).show();
    }

    /**
     * 展开一项，关闭其他项，保证每次只能展开一项
     */
    @Override
    public void onGroupExpand(int groupPosition) {
        for (int i = 0; i < parents.size(); i++) {
            if (i != groupPosition) {
                eList.collapseGroup(i);//关闭状态
            }
        }
    }
}

2.看下 父类分组的适配器 ParentAdapter 及 xml 文件。

/**
 * 父类分组的适配器
 * 方法 {@link #getChildView(int, int, boolean, View, ViewGroup)}
 * color='#ff00ff' size='2'>极其重要
 */

public class ParentAdapter extends BaseExpandableListAdapter {

    private Context mContext;// 上下文
    private ArrayList<ParentEntity> mParents;// 数据源
    private OnChildTreeViewClickListener mTreeViewClickListener;// 点击子ExpandableListView子项的监听

    public ParentAdapter(Context context, ArrayList<ParentEntity> parents) {
        this.mContext = context;
        this.mParents = parents;
    }

    //  获得某个父项的某个子项
    @Override
    public ChildEntity getChild(int groupPosition, int childPosition) {
        return mParents.get(groupPosition).getChilds().get(childPosition);
    }

    //  获得某个父项的某个子项的id
    @Override
    public long getChildId(int groupPosition, int childPosition) {
        return childPosition;
    }

    //  获得某个父项的子项数目
    @Override
    public int getChildrenCount(int groupPosition) {
        return mParents.get(groupPosition).getChilds() != null ? mParents.get(groupPosition).getChilds().size() : 0;
    }

    //  获得子项显示的view
    @Override
    public View getChildView(final int groupPosition, final int childPosition, boolean isExpanded, View convertView, ViewGroup parent) {

        final ExpandableListView eListView = getExpandableListView();
        ArrayList<ChildEntity> childs = new ArrayList<ChildEntity>();
        final ChildEntity child = getChild(groupPosition, childPosition);

        childs.add(child);
        final ChildAdapter childAdapter = new ChildAdapter(this.mContext, childs);//三级列表adapter
        eListView.setAdapter(childAdapter);

        /**
         *点击子ExpandableListView子项时，调用回调接口
         */
        eListView.setOnChildClickListener(new OnChildClickListener() {
            @Override
            public boolean onChildClick(ExpandableListView arg0, View arg1, int groupIndex, int childIndex, long arg4) {

                if (mTreeViewClickListener != null) {
                    mTreeViewClickListener.onClickPosition(groupPosition, childPosition, childIndex);
                }
                return false;
            }
        });


        /**
         *         子ExpandableListView展开时，因为group只有一项，所以子ExpandableListView的总高度=
         *         （子ExpandableListView的child数量 + 1 ）* 每一项的高度
         */
        eListView.setOnGroupExpandListener(new OnGroupExpandListener() {
            @Override
            public void onGroupExpand(int groupPosition) {
                LayoutParams lp = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (child.getChildNames().size() + 1) * (int) mContext.getResources().getDimension(R.dimen.parent_expandable_list_height));
                eListView.setLayoutParams(lp);
            }
        });

        /**
         *         子ExpandableListView关闭时，此时只剩下group这一项，
         *         所以子ExpandableListView的总高度即为一项的高度
         */
        eListView.setOnGroupCollapseListener(new OnGroupCollapseListener() {
            @Override
            public void onGroupCollapse(int groupPosition) {
                LayoutParams lp = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (int) mContext.getResources().getDimension(R.dimen.parent_expandable_list_height));
                eListView.setLayoutParams(lp);
            }
        });
        return eListView;

    }

    /**
     * 动态创建子ExpandableListView
     */
    public ExpandableListView getExpandableListView() {
        ExpandableListView mExpandableListView = new ExpandableListView(mContext);
        LayoutParams lp = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (int) mContext.getResources().getDimension(R.dimen.parent_expandable_list_height));
        mExpandableListView.setLayoutParams(lp);
        mExpandableListView.setDividerHeight(0);// 取消group项的分割线
        mExpandableListView.setChildDivider(null);// 取消child项的分割线
        mExpandableListView.setGroupIndicator(null);// 取消展开折叠的指示图标
        return mExpandableListView;
    }

    //  获得某个父项
    @Override
    public Object getGroup(int groupPosition) {
        return mParents.get(groupPosition);
    }

    //  获得父项的数量
    @Override
    public int getGroupCount() {
        return mParents != null ? mParents.size() : 0;
    }

    //  获得某个父项的id
    @Override
    public long getGroupId(int groupPosition) {
        return groupPosition;
    }

    //  获得父项显示的view
    @Override
    public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
        GroupHolder holder = null;
        if (convertView == null) {
            convertView = LayoutInflater.from(mContext).inflate(R.layout.parent_group_item, null);
            holder = new GroupHolder(convertView);
            convertView.setTag(holder);
        } else {
            holder = (GroupHolder) convertView.getTag();
        }
        holder.update(mParents.get(groupPosition));
        return convertView;
    }

    /**
     * Holder优化
     */
    class GroupHolder {
        
        private TextView parentGroupTV;
        public GroupHolder(View v) {
            parentGroupTV = (TextView) v.findViewById(R.id.parentGroupTV);
        }

        public void update(ParentEntity model) {
            parentGroupTV.setText(model.getGroupName());
            parentGroupTV.setTextColor(model.getGroupColor());
        }
    }

    //  按函数的名字来理解应该是是否具有稳定的id，这个方法目前一直都是返回false，没有去改动过
    @Override
    public boolean hasStableIds() {
        return false;
    }

    //  子项是否可选中，如果需要设置子项的点击事件，需要返回true
    @Override
    public boolean isChildSelectable(int groupPosition, int childPosition) {
        return false;
    }

    /**
     * 设置点击子ExpandableListView子项的监听
     */
    public void setOnChildTreeViewClickListener(OnChildTreeViewClickListener treeViewClickListener) {
        this.mTreeViewClickListener = treeViewClickListener;
    }

    /**
     * 点击子ExpandableListView子项的回调接口
     */
    public interface OnChildTreeViewClickListener {

        void onClickPosition(int parentPosition, int groupPosition, int childPosition);
    }

}
布局文件 parent_group_item.xml 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingLeft="@dimen/parent_expandable_list_group_padding_left" >

    <TextView
        android:id="@+id/parentGroupTV"
        android:layout_width="wrap_content"
        android:layout_height="@dimen/parent_expandable_list_height"
        android:gravity="center_vertical" />

</RelativeLayout>
oK，这里我们哟格外注意：getExpandableListView() 方法. 

 /**
     * 动态创建子ExpandableListView
     */
    public ExpandableListView getExpandableListView() {
        ExpandableListView mExpandableListView = new ExpandableListView(mContext);
        LayoutParams lp = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (int) mContext.getResources().getDimension(R.dimen.parent_expandable_list_height));
        mExpandableListView.setLayoutParams(lp);
        mExpandableListView.setDividerHeight(0);// 取消group项的分割线
        mExpandableListView.setChildDivider(null);// 取消child项的分割线
        mExpandableListView.setGroupIndicator(null);// 取消展开折叠的指示图标
        return mExpandableListView;
    }

3.看一下 子类分组适配器  ChildAdapter 及 xml 文件。

/**
 * 子类分组的适配器
 * 方法{@link #isChildSelectable(int, int)} color='#ff00ff'
 * size='2'>必须返回true
 */
public class ChildAdapter extends BaseExpandableListAdapter {

    private Context mContext;// 上下文
    private ArrayList<ChildEntity> mChilds;// 数据源
    
    public ChildAdapter(Context context, ArrayList<ChildEntity> childs) {
        this.mContext = context;
        this.mChilds = childs;
    }

    @Override
    public int getChildrenCount(int groupPosition) {
        return mChilds.get(groupPosition).getChildNames() != null ? mChilds.get(groupPosition).getChildNames().size() : 0;
    }

    @Override
    public String getChild(int groupPosition, int childPosition) {
        if (mChilds.get(groupPosition).getChildNames() != null && mChilds.get(groupPosition).getChildNames().size() > 0)
            return mChilds.get(groupPosition).getChildNames().get(childPosition).toString();
        return null;
    }

    @Override
    public long getChildId(int groupPosition, int childPosition) {
        return childPosition;
    }

    @Override
    public View getChildView(int groupPosition, int childPosition, boolean isExpanded, View convertView, ViewGroup parent) {
        ChildHolder holder = null;
        if (convertView == null) {
            convertView = LayoutInflater.from(mContext).inflate(R.layout.child_child_item, null);
            holder = new ChildHolder(convertView);
            convertView.setTag(holder);
        } else {
            holder = (ChildHolder) convertView.getTag();
        }
        holder.update(getChild(groupPosition, childPosition));
        return convertView;
    }

    /**
     * Holder优化
     */
    class ChildHolder {

        private TextView childChildTV;
        public ChildHolder(View v) {
            childChildTV = (TextView) v.findViewById(R.id.childChildTV);
        }

        public void update(String str) {
            childChildTV.setText(str);
            childChildTV.setTextColor(Color.parseColor("#00ffff"));//蓝色
        }
    }

    @Override
    public Object getGroup(int groupPosition) {
        if (mChilds != null && mChilds.size() > 0)
            return mChilds.get(groupPosition);
        return null;
    }

    @Override
    public int getGroupCount() {
        return mChilds != null ? mChilds.size() : 0;
    }

    @Override
    public long getGroupId(int groupPosition) {
        return groupPosition;
    }

    @Override
    public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
        GroupHolder holder = null;
        if (convertView == null) {
            convertView = LayoutInflater.from(mContext).inflate(R.layout.child_group_item, null);
            holder = new GroupHolder(convertView);
            convertView.setTag(holder);
        } else {
            holder = (GroupHolder) convertView.getTag();
        }
        holder.update(mChilds.get(groupPosition));
        return convertView;
    }

    /**
     * Holder优化
     */
    class GroupHolder {

        private TextView childGroupTV;
        public GroupHolder(View v) {
            childGroupTV = (TextView) v.findViewById(R.id.childGroupTV);
        }

        public void update(ChildEntity model) {
            childGroupTV.setText(model.getGroupName());
            childGroupTV.setTextColor(model.getGroupColor());
        }
    }

    @Override
    public boolean hasStableIds() {
        return false;
    }

    @Override
    public boolean isChildSelectable(int groupPosition, int childPosition) {
        /**
         * ==============================================
         * 此处必须返回true，否则无法响应子项的点击事件===============
         * ==============================================
         **/
        return true;
    }
}
布局文件 child_group_item.xml  及 child_child_item.xml 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="@dimen/parent_expandable_list_height" >

        <TextView
            android:id="@+id/childGroupTV"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:paddingLeft="@dimen/child_expandable_list_group_padding_left" />
    </RelativeLayout>

</LinearLayout>

child_child_item.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="@dimen/parent_expandable_list_height" >

        <TextView
            android:id="@+id/childChildTV"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:paddingLeft="@dimen/child_expandable_list_child_padding_left" />
    </RelativeLayout>

</LinearLayout>

然后看下父类及子类的实体类 

/**
 * 子类分组的实体
 */

public class ParentEntity {

    private int groupColor;

    private String groupName;

    private ArrayList<ChildEntity> childs;

	
	/* ==========================================================
     * ======================= get method =======================
	 * ========================================================== */

    public int getGroupColor() {
        return groupColor;
    }

    public String getGroupName() {
        return groupName;
    }

    public ArrayList<ChildEntity> getChilds() {
        return childs;
    }

	/* ==========================================================
     * ======================= set method =======================
	 * ========================================================== */

    public void setGroupColor(int groupColor) {
        this.groupColor = groupColor;
    }

    public void setGroupName(String groupName) {
        this.groupName = groupName;
    }

    public void setChilds(ArrayList<ChildEntity> childs) {
        this.childs = childs;
    }


/**
 * 父类分组的实体
 */

public class ChildEntity {

    private int groupColor;
    private String groupName;
    private ArrayList<String> childNames;


	/* ==========================================================
     * ======================= get method =======================
	 * ========================================================== */

    public int getGroupColor() {
        return groupColor;
    }

    public String getGroupName() {
        return groupName;
    }

    public ArrayList<String> getChildNames() {
        return childNames;
    }

	/* ==========================================================
     * ======================= set method =======================
	 * ========================================================== */

    public void setGroupColor(int groupColor) {
        this.groupColor = groupColor;
    }

    public void setGroupName(String groupName) {
        this.groupName = groupName;
    }

    public void setChildNames(ArrayList<String> childNames) {
        this.childNames = childNames;
    }

}
最后看下dimens.xml 

<resources>
    <!-- Default screen margins, per the Android Design guidelines. -->
    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">16dp</dimen>

    <dimen name="parent_expandable_list_height">50dp</dimen>
    <dimen name="parent_expandable_list_group_padding_left">10dp</dimen>
    <dimen name="child_expandable_list_group_padding_left">40dp</dimen>
    <dimen name="child_expandable_list_child_padding_left">75dp</dimen>
</resources>

除此之外我们参考下：http://blog.csdn.net/shexiaoheng/article/details/41351247

http://blog.csdn.net/sysukehan/article/details/51960473


源码：http://download.csdn.net/detail/shexiaoheng/8212209

快乐的金豆
关注
ExpandableListView使用解析（三级列表的实现）
茅屋
06-16 1万+
ExpandableListView 使用解析（三级列表的实现）在往常的设计中，往往有类似于QQ的二级列表的样式，而使用ExpandableListView变可以实现这种类似的效果。当然，如果ExpandableListView嵌套ExpandableListView便可以实现三级列表，甚至多级条目，而本博客最终的实现效果便是三级条目。首先看一下效果：当然样式比较丑，这里只实现基本的逻辑。具体的样式
android ExpandableListView三级菜单的使用
07-19
android ExpandableListView三级菜单的使用，多级菜单下拉与隐藏，ExpandableListView的简单使用
Android 使用ExpandableListView实现三级列表
小北的博客
07-11 799
本文将介绍如何使用ExpandableListView 来实现一个三级列表。通过嵌套使用这两个组件，我们可以轻松地显示具有父级、子级和子子级的层次结构数据。
在android里用ExpandableListView实现二层和三层列表源码
weixin_30293079的博客
11-13 179
二层列表是直接用androidAPI中的ExpandableListView即可实现，三层列表其实是对二层列表的一个嵌套，实现起来会相对繁琐。 部分代码： SuperTreeViewAdapter.java public class SuperTreeViewAdapter extends BaseExpandableListAdapter { static public ...
超级吊的ExpandableListView三级目录
JustingWang_1的博客
07-07 831
MainActivity:public class MainActivityTest extends Activity { private ExpandableListView expandableListView; private List<String>grounpList=new ArrayList<>(); private ParentExpandAdapter pa
ExpandableListView三级列表实现(带选择联动效果)
bigname22的博客
09-11 4782
ExpandableListView三级列表实现原理(带CheckBox全选功能)好久没写文章，为什么？还不是忙了，我都担心自己最近会不会猝死在电脑前。或者走着走着躺地上担心没人救我，毕竟长得帅的人会给人一种距离感。说回正题，场景：多选车辆，并且在同一个页面实现。 （数据结构：公司-线路-车辆三层）那么第一时间想到的只能是 ExpandableListView 这个神奇的组件了，但常规就两层，那要
AndroidExpandableListView实现三级列表显示
贰佰没有伍
01-22 5030
项目中要做一个类似三级列表点击可展开的效果，首先想到的是嵌套list，然后碰到的问题是，下一级list获取到角标一直为零，所以换了个思路（这个坑跟list源码有关），舍弃了嵌套list，改成使用expandablelistview来addview，demo没有，不好copy出来因为没有数据，大概能明白思路就行，下面直接看代码，最主要代码是adapter中的getChildView。 1.frag
使用expandableListView实现三级列表
chw12341的博客
02-22 662
        时间过得很快，转眼年也过完了，在匆匆的岁月长河里总是莫名的心慌，可能时间真的是最残忍的那个，无论你喜或悲、乐与乏，他都持续流逝着，不快不慢。废话不多说，在开工的前一天（昨天）陈闲暇之时写了一个通过expandableListView实现三级列表的demo，昨天写完demo就没时间了，今天写到博客里，算是新年开工第一篇了。首先看一下效果图：我们都知道，通过expandableList...
Android ExpandableListView双层嵌套实现三级树形菜单
08-26
对于需要展现多级菜单的情况，如三级树形菜单，`ExpandableListView` 可以通过双层嵌套的方式来实现。下面将详细介绍如何使用 `ExpandableListView` 来构建这样的菜单。 首先，我们要理解 `ExpandableListView` 的...
三级伸缩列表expandableListView
08-09
在这个特定的案例中，我们讨论的是一个实现了三级伸缩列表的解决方案，这意味着用户可以点击一级、二级甚至三级列表项来展开或隐藏其子项，这种功能在很多应用中，如导航菜单、分类目录等都有广泛应用。 **1. ...
带二级和三级目录的列表ExpandableListView
07-25
带二级和三级目录的列表ExpandableListView
ExpandableListView
03-29
Android无限极树状(tree)结构Demo
UI开发第二篇——多级列表（ExpandableListView）
shinfocom
10-26 292
开发中很多地方使用到了多级列表，android可以使用ExpandableListView很好的实现，下面模仿了手机qq的实现，见下图。 多级列表使用了ExpandableListView，自定义了Adapter； 代码可以到http://www.devdiv.com/viewthread.php?tid=39473&amp;extra= 下载 /*** @author 张兴业* 邮箱：x...
安卓开发，通用ExpandableListView三级选择列表。
最新发布
weixin_45920642的博客
08-25 357
ExpandableListView的三级选择列表。
多级列表——ExpandableListView
weixin_33753845的博客
08-12 131
ExpandableListView控件提供的是一个多级列表（一般是两级），我们先来看一下效果图，如图4.18所示为头部列表，单击其中的每一项下面会显示第二级列表，如图4.19所示。   从图4.18和图4.19中可以看出，ExpandableListView为我们提供了一个极好的两级列表的展示控件。 但是如何实现这个两级列表呢？既然ExpandableListView采用列表的形式...
Android ExpandableListView同时显示多种不同类型字列表
muhuitao的博客
05-07 370
MainActivity.java public class MainActivity extends AppCompatActivity { private ExpandableListView mExpandableListView; @Override protected void onCreate(Bundle savedInstanceState) { ...
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值