可折叠的listview

最新推荐文章于 2025-09-23 10:52:58 发布

原创最新推荐文章于 2025-09-23 10:52:58 发布 · 793 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#expandablelistview

ExpandableListView，也就是今天的主题了，可以折叠的listview

下面送上google源码传送门

使用ExpandableListView的步骤：

1.在布局文件中定义一个ExpandableListView，并指定id

    <ExpandableListView
        android:id="@+id/exlist_test"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:childDivider="#E02D2F">

    </ExpandableListView>

2.定义两个放itme的xml文件，一个是给定的gruop的item，一个是下拉菜单的child的item

child的item，item_child_expandablelist.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:padding="5dp">

    <ImageView
        android:id="@+id/child_img"
        android:layout_width="48dp"
        android:layout_height="40dp"
        android:focusable="false"
        android:src="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/child_text"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:layout_marginLeft="15dp"
        android:focusable="false"
        android:gravity="center_vertical"
        android:text="名字"
        android:textSize="18sp" />

</LinearLayout>

group的item，item_group_expandablelist

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/group_text"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        android:gravity="center_vertical"
        android:paddingLeft="30dp"
        android:text="group_name"
        android:textSize="20sp"
        android:textStyle="bold" />

</LinearLayout>

3.给ExpandableListView准备适配器

实现它的适配器有3种方法，类似于listview的适配器实现方法

第一种是继承BaseExpandableListAdapter，实现自己的adapter

第二种是用系统的SimpleExpandableListAdpater，把两个list组合成一个adapter

第三种是simpleCursorTreeAdapter，用cursor中的数据来构建adapter

我在这里介绍一下第一种方法。在继承并重写BaseExpandableListAdapter之前，我们要先创建两个类，一个用来放组的名称，一个用来放组中的数据：

Group类，用来存储组的名字：

public class Group {

    private String gName;

    public Group() {

    }

    public Group(String gName) {
        this.gName = gName;
    }

    public String getgName() {
        return gName;
    }

    public void setgName(String gName) {
        this.gName = gName;
    }
}

Chlid类，用来存储数据：

public class Child {

    private int cImgId;
    private String cName;

    public Child() {
    }

    public Child(int cImgId, String cName) {
        this.cImgId = cImgId;
        this.cName = cName;
    }

    public int getcImgId() {
        return cImgId;
    }

    public void setcImgId(int cImgId) {
        this.cImgId = cImgId;
    }

    public String getcName() {
        return cName;
    }

    public void setcName(String cName) {
        this.cName = cName;
    }
}

正式编写适配器MyBaseExpandableListAdapter：

public class MyBaseExpandableListAdapter extends BaseExpandableListAdapter {

    private ArrayList<Group> groupData;
    private ArrayList<ArrayList<Child>> childData;
    private Context mContext;

    public MyBaseExpandableListAdapter(ArrayList<Group> groupData, ArrayList<ArrayList<Child>> childData, Context mContext) {
        this.groupData = groupData;
        this.childData = childData;
        this.mContext = mContext;
    }

    //指定组的数量
    @Override
    public int getGroupCount() {
        return groupData.size();
    }

    //指定下拉菜单里数据的数量
    @Override
    public int getChildrenCount(int groupPosition) {
        return childData.get(groupPosition).size();
    }

    @Override
    public Object getGroup(int groupPosition) {
        return groupData.get(groupPosition);
    }

    @Override
    public Object getChild(int groupPosition, int childPosition) {
        return childData.get(groupPosition).get(childPosition);
    }

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

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

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

    public static class ViewHolderGroup {
        private TextView group_tv_name;
    }

    public static class ViewHolderChild {
        private ImageView child_img_icon;
        private TextView child_tv_name;
    }

    //取得用于显示给定分组的视图. 这个方法仅返回分组的视图对象
    @Override
    public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {

        ViewHolderGroup viewHolderGroup;
        if (convertView == null) {
            convertView = LayoutInflater.from(mContext).inflate(R.layout.item_group_expandablelist, parent, false);
            viewHolderGroup = new ViewHolderGroup();
            viewHolderGroup.group_tv_name = (TextView) convertView.findViewById(R.id.group_text);
            convertView.setTag(viewHolderGroup);
        } else {
            viewHolderGroup = (ViewHolderGroup) convertView.getTag();
        }

        viewHolderGroup.group_tv_name.setText(groupData.get(groupPosition).getgName());
        return convertView;
    }

    //取得用于显示给定分组的数据的视图. 这个方法仅返回数据的视图对象
    @Override
    public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {

        ViewHolderChild viewHolderChild;
        if (convertView == null) {
            convertView = LayoutInflater.from(mContext).inflate(R.layout.item_child_expandablelist, parent, false);
            viewHolderChild = new ViewHolderChild();
            viewHolderChild.child_img_icon = (ImageView) convertView.findViewById(R.id.child_img);
            viewHolderChild.child_tv_name = (TextView) convertView.findViewById(R.id.child_text);
            convertView.setTag(viewHolderChild);
        } else {
            viewHolderChild = (ViewHolderChild) convertView.getTag();
        }

        viewHolderChild.child_img_icon.setImageResource(childData.get(groupPosition).get(childPosition).getcImgId());
        viewHolderChild.child_tv_name.setText(childData.get(groupPosition).get(childPosition).getcName());

        return convertView;
    }

    //此处要返回true，否则不会触发item点击事件
    @Override
    public boolean isChildSelectable(int groupPosition, int childPosition) {
        return true;
    }
}

4.在activity中使用：

    //声明可折叠的listview
    private ExpandableListView mExpandableListView;
    //为可折叠listview准备数据
    private ArrayList<Group> mData_Group = null;
    private ArrayList<ArrayList<Child>> mData_Child = null;
    private ArrayList<Child> mData;
    //为可折叠listview准备适配器
    private MyBaseExpandableListAdapter mMyEListAdapter;

find一下：

mExpandableListView = (ExpandableListView) findViewById(R.id.exlist_test);

        //添加数据
        mData_Group = new ArrayList<>();
        mData_Group.add(new Group("1"));
        mData_Group.add(new Group("2"));
        mData_Group.add(new Group("3"));

        mData_Child = new ArrayList<>();

        //第一组
        mData = new ArrayList<>();
        mData.add(new Child(R.mipmap.iv_img_icon3, "11"));
        mData.add(new Child(R.mipmap.iv_img_icon4, "12"));
        mData.add(new Child(R.mipmap.iv_img_icon13, "13"));
        mData.add(new Child(R.mipmap.iv_img_icon14, "14"));
        mData_Child.add(mData);
        //第二组
        mData = new ArrayList<>();
        mData.add(new Child(R.mipmap.iv_img_icon1, "21"));
        mData.add(new Child(R.mipmap.iv_img_icon7, "22"));
        mData.add(new Child(R.mipmap.iv_img_icon8, "23"));
        mData.add(new Child(R.mipmap.iv_img_icon9, "24"));
        mData.add(new Child(R.mipmap.iv_img_icon11, "25"));
        mData_Child.add(mData);
        //第三组
        mData = new ArrayList<>();
        mData.add(new Child(R.mipmap.iv_img_icon2, "31"));
        mData.add(new Child(R.mipmap.iv_img_icon5, "32"));
        mData.add(new Child(R.mipmap.iv_img_icon6, "33"));
        mData.add(new Child(R.mipmap.iv_img_icon10, "34"));
        mData.add(new Child(R.mipmap.iv_img_icon12, "35"));
        mData_Child.add(mData);

        //new出来自定义的adapter
        mMyEListAdapter = new MyBaseExpandableListAdapter(mData_Group, mData_Child, getApplicationContext());
        //setadapter
        mExpandableListView.setAdapter(mMyEListAdapter);
        //添加点击事件
        mExpandableListView.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
            @Override
            public boolean onChildClick(ExpandableListView parent, View v, int groupPosition, int childPosition, long id) {

                Toast.makeText(getApplicationContext(),
                        mData_Child.get(groupPosition).get(childPosition).getcName(),
                        Toast.LENGTH_SHORT).show();

                return true;
            }
        });

over

其实很多步骤和listview很类似