【Android】ExpandableListView二级列表使用介绍

ExpandableListView是一个用于垂直滚动展示二级列表的视图，与ListView不同的是它可以展示二级列表，分组可以 单独展开子选项。这些选项数据是通过ExpandableListView关联的。

创建布局文件

<ExpandableListView
                android:layout_width="match_parent"
                android:layout_height="match_parent">
            </ExpandableListView>

上述是简单的布局文件使用，同时也可以添加如下属性：

android:childDivider:制定各组内子类表项之间的分隔条，分隔表是一条直线

android:childDivider:制定各组内子类表项之间的分隔条，分隔表是一条直线
android:childIndicator:显示在子列表左边的Drawable对象，可以是一个图像
android:childIndicatorEnd:子列表指示符的结束约束位置
android:childIndicatorLeft:子列表指示符的左边约束位置
android:childIndicatorRight:子列表指示符的右边约束位置
android:childIndicatorStart:子列表指示符的开始约束位置
android:groupIndicator:显示在组列表旁边的DrawAble对象，可以是一个图像
android:indicatorEnd:组列表指示符的结束约束位置
android:indicatorLeft:组列表指示符的左边约束位置
android:indicatorRight:组列表指示符的右边约束位置
android:indicatorStart:组列表指示符的开始约束位置

父项布局文件：

<?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:paddingBottom="8dp"
    android:paddingTop="8dp">
    <TextView
        android:id="@+id/tv_item_list_group_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="40dp"
        android:text="文件夹"
        android:textAppearance="@style/TextAppearance.AppCompat.Title" />
</LinearLayout>

子项布局文件：

<?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="wrap_content"
    android:layout_marginLeft="5dp"
    android:orientation="horizontal"
    android:paddingLeft="16dp">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="25dp"
        android:layout_margin="8dp">

        <View
            android:id="@+id/v_list_item_priority"
            android:layout_width="5dp"
            android:layout_height="18dp"
            android:layout_alignParentLeft="true"
            android:layout_centerVertical="true"
            android:background="@color/colorWhite" />

        <TextView
            android:id="@+id/tv_list_item_list_name"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_centerVertical="true"
            android:layout_marginLeft="5dp"
            android:layout_toRightOf="@id/v_list_item_priority"
            android:gravity="center_vertical"
            android:text="清单名"
            android:textSize="20sp" />

        <TextView
            android:id="@+id/tv_list_item_stuffs"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:layout_marginRight="10dp"
            android:gravity="bottom"
            android:text="0"
            android:textSize="16dp" />
    </RelativeLayout>
</LinearLayout>

ExpandableAdapter数据适配器

实现ExpandableAdapter的三种方式

1、拓展BaseExpandableListAdapter实现ExpandableAdapter

2、使用simpleExpandableListAdapter将两个list集合包装成ExpandableAdapter

本demo使用第一种方式实现数据适配器，由于父项和子项都有一些点击事件，因此使用了接口回调的方式实现。

public class ListGroupExpandableAdapter extends BaseExpandableListAdapter {
    private static final String TAG = ListGroupExpandableAdapter.class.getSimpleName();
    private java.util.List<ListGroup> listGroups;
    private java.util.List<java.util.List<List>> lists;
    private OnChildClickListener mOnChildClickListener;
    private OnParentClickListener mOnParentClickListener;

    public ListGroupExpandableAdapter(java.util.List<ListGroup> listGroups, java.util.List<java.util.List<List>> lists) {
        this.listGroups = listGroups;
        this.lists = lists;
    }

    public void setOnChildClickListener(OnChildClickListener onChildClickListener){
        mOnChildClickListener = onChildClickListener;
    }

    public void setOnParentClickListener(OnParentClickListener onParentClickListener){
        mOnParentClickListener = onParentClickListener;
    }

    @Override
    public int getGroupCount() {  //获取父项数量
        return listGroups.size();
    }

    @Override
    public int getChildrenCount(int i) {  //获取子项数量
        return lists.get(i).size();
    }

    @Override
    public Object getGroup(int i) {  //获取父项
        return listGroups.get(i);
    }

    @Override
    public Object getChild(int i, int i1) {//获取子项
        return lists.get(i).get(i1);
    }

    @Override
    public long getGroupId(int i) {  //获取父项位置
        return i;
    }

    @Override
    public long getChildId(int i, int i1) {  //获取子项位置
        return i1;
    }

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

    @Override
    public View getGroupView(final int i, boolean b, View view, ViewGroup viewGroup) {  //获取父项布局
        GroupViewHolder groupViewHolder;
        if(view == null) {
            view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.list_group_group_item, null);
            groupViewHolder = new GroupViewHolder();
            groupViewHolder.view = view;
            groupViewHolder.listGroupNameTv = view.findViewById(R.id.tv_item_list_group_name);
            view.setTag(groupViewHolder);
        }else {
            groupViewHolder = (GroupViewHolder) view.getTag();
        }
        Log.d(TAG, "getGroupView: " + listGroups.get(i).getName());
        groupViewHolder.listGroupNameTv.setText(listGroups.get(i).getName());
        if(mOnParentClickListener != null) {
            groupViewHolder.view.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    mOnParentClickListener.onParentClickListener(view, i);
                }
            });
            groupViewHolder.view.setOnLongClickListener(new View.OnLongClickListener() {
                @Override
                public boolean onLongClick(View view) {
                    mOnParentClickListener.onParentLongClickListener(view, i);
                    return true;
                }
            });
        }
        return view;
    }

    @Override
    public View getChildView(final int i, final int i1, boolean b, View convertView, ViewGroup viewGroup) {  //获取子项布局
        ChildViewHolder childViewHolder;
        View view;
        if(convertView == null) {
            view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.list_item, null);
            childViewHolder = new ChildViewHolder();
            childViewHolder.view = view;
            childViewHolder.priorityColor = view.findViewById(R.id.v_list_item_priority);
            childViewHolder.listNameTv = view.findViewById(R.id.tv_list_item_list_name);
            childViewHolder.stuffNumTv = view.findViewById(R.id.tv_list_item_stuffs);
            view.setTag(childViewHolder);
        }else {
            view = convertView;
            childViewHolder = (ChildViewHolder) view.getTag();
        }
        switch (lists.get(i).get(i1).getPriority()) {
            case 1:
                childViewHolder.priorityColor.setBackgroundColor(childViewHolder.priorityColor.getResources().getColor(R.color.colorBule));
                break;
            case 2:
                childViewHolder.priorityColor.setBackgroundColor(childViewHolder.priorityColor.getResources().getColor(R.color.colorYellow));
                break;
            case 3:
                childViewHolder.priorityColor.setBackgroundColor(childViewHolder.priorityColor.getResources().getColor(R.color.colorAccent));
                break;
            default:
                childViewHolder.priorityColor.setBackgroundColor(childViewHolder.priorityColor.getResources().getColor(R.color.colorWhite));
                break;
        }
        childViewHolder.listNameTv.setText(lists.get(i).get(i1).getName());
        childViewHolder.stuffNumTv.setText(String.valueOf(lists.get(i).get(i1).getStuffs()));
        if(mOnChildClickListener != null) {
            childViewHolder.view.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    mOnChildClickListener.onChildClickListener(view, i, i1);
                }
            });
            childViewHolder.view.setOnLongClickListener(new View.OnLongClickListener() {
                @Override
                public boolean onLongClick(View view) {
                    mOnChildClickListener.onChildLongClickListener(view, i, i1);
                    return true;
                }
            });
        }
        return view;
    }

    @Override
    public boolean isChildSelectable(int i, int i1) {
        return true;
    }

    public interface OnChildClickListener {   //子项点击事件
        void onChildClickListener(View view, int parentPos, int childPos);
        void onChildLongClickListener(View view, int parentPos, int childPos);
    }

    public interface OnParentClickListener{   //父项点击事件
        void onParentClickListener(View view, int parentPos);
        void onParentLongClickListener(View view, int parentPos);
    }

    class GroupViewHolder {
        View view;
        TextView listGroupNameTv;
    }

    class ChildViewHolder {
        View view;
        View priorityColor;
        TextView listNameTv;
        TextView stuffNumTv;
    }
}

使用ExpandableListView

传入父项数据和子项数据，创建数据适配器，然后在expandableListView中设置数据适配器。

public void showAllLists(final java.util.List<ListGroup> listGroups, final java.util.List<java.util.List<List>> lists) {
        try{
            mListGroups = listGroups;
            mLists = lists;
            mExpandableAdapter = new ListGroupExpandableAdapter(mListGroups, mLists);
            mExpandableAdapter.setOnChildClickListener(new ListGroupExpandableAdapter.OnChildClickListener() {
                @Override
                public void onChildClickListener(View view, int parentPos, int childPos) {
                    try{
                        showListDetail(lists.get(parentPos).get(childPos));
                    }catch (Exception e){
                        e.printStackTrace();
                    }
                }

                @Override
                public void onChildLongClickListener(View view, final int parentPos, final int childPos) {
                    try{
                        getActivity().runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                                onChildLongClick(parentPos, childPos);
                            }
                        });
                    }catch (Exception e){
                        e.printStackTrace();
                    }
                }
            });
            mExpandableAdapter.setOnParentClickListener(new ListGroupExpandableAdapter.OnParentClickListener() {
                @Override
                public void onParentClickListener(View view, final int parentPos) {
                    try{
                        getActivity().runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                                if(mExpandableListView.isGroupExpanded(parentPos)) {
                                    mExpandableListView.collapseGroup(parentPos);
                                }else {
                                    mExpandableListView.expandGroup(parentPos);
                                }
                            }
                        });
                    }catch (Exception e){
                        e.printStackTrace();
                    }
                }

                @Override
                public void onParentLongClickListener(View view, final int parentPos) {
                    try{
                        getActivity().runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                                onParentLongClick(parentPos);
                            }
                        });
                    }catch (Exception e){
                        e.printStackTrace();
                    }
                }
            });
            getActivity().runOnUiThread(new Runnable() {
                @Override
                public void run() {
                    mExpandableListView.setAdapter(mExpandableAdapter);
                    mExpandableListView.setOnScrollListener(new AbsListView.OnScrollListener() {
                        @Override
                        public void onScrollStateChanged(AbsListView absListView, int i) {

                        }

                        @Override
                        public void onScroll(AbsListView absListView, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
                            View firstView = absListView.getChildAt(firstVisibleItem);
                            if (firstVisibleItem == 0 && (firstView == null || firstView.getTop() == 0)) {
                                mSwipeRefreshLayout.setEnabled(true);
                            } else {
                                mSwipeRefreshLayout.setEnabled(false);
                            }
                        }
                    });
                    int count = mExpandableListView.getCount();
                    for (int i = 0; i < count; i++) {   //默认展开所有父项
                        mExpandableListView.expandGroup(i);
                    }
                    mExpandableListView.setVisibility(View.VISIBLE);
                }
            });
        }catch (Exception e){
            e.printStackTrace();
        }
    }

最后实现的效果如下：

groupIndicator父项列表指示，也可以设置为不显示或者自定义指示器:

 mExpandableListView.setGroupIndicator(null);
 mExpandableListView.setGroupIndicator(getActivity().getResources().getDrawable(R.drawable.group_indicator));

指示器布局：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@mipmap/packup" android:state_expanded="true"/>
    <item android:drawable="@mipmap/unfold"/>
</selector>