ExpandableListView多级列表(二级列表)

今天研究下ExpandableListView 多级列表的用法，先来看看效果图：

我们分析下效果图：

1.效果图中左边是一个ListView ，右边是一个ExpandableListView  ，并且左右联动，点击左边右边也会相应的发生变化。

2.右边ExpandableListView 是一个二级列表（这篇文章我们先介绍二级列表，三级列表或四级列表以后介绍），点击一级列表会展开二级列表。其主要实现的控件就是ExpandableListView 

1.先看下布局文件xml ：

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

        <ImageView
            android:id="@+id/ib_back"
            android:layout_width="45dp"
            android:layout_height="48dp"
            android:layout_marginLeft="5dp"
            android:padding="15dp"
            android:scaleType="centerInside"
            android:src="@drawable/back" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:text="全部分类"
            android:textColor="@color/white"
            android:textSize="@dimen/titlebar_title_tv_size" />

    </RelativeLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal">

        <ListView
            android:id="@+id/listView"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="4dp"
            android:layout_weight="2"
            android:background="@color/white"
            android:choiceMode="singleChoice"
            android:divider="@color/tv_f3"
            android:listSelector="#00000000"
            android:scrollbars="none">

        </ListView>

        <ExpandableListView
            android:id="@+id/expendlistview"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="3"
            android:numColumns="2"
            android:layout_marginTop="10dp"
            android:horizontalSpacing="8dp"
            android:verticalSpacing="8dp"
            android:layout_marginLeft="10dp"
            android:divider="@null"
            android:layout_marginRight="10dp"
            android:scrollbars="none">

        </ExpandableListView>

    </LinearLayout>
</LinearLayout>

通过布局文件我们可以看到，左边是listView ，右边是ExpandableListView.

2.看下代码： 先看下主类

/**
     * Created by FanHaiChao on 2017/2/10.
     * 需求类目的分类列表
     */
    public class DemandClassifyActivity extends BaseActivity {
        private ImageView ib_back;
        private ListView listView;
        private ExpandableListView expendlistview;
        private DemandClassifyBean demandClassifyBean;
        private DemandExpandAdapter demandExpandAdapter;
        private DemandClassifyFirstAdapter firstAdapter;

        @Override
        public int getLayoutResId() {
            return R.layout.activity_demand_classify;
        }

        @Override
        protected void initView() {
            ib_back = (ImageView) findViewById(R.id.ib_back);
            listView = (ListView) findViewById(R.id.listView);
            expendlistview = (ExpandableListView) findViewById(R.id.expendlistview);
            //取消默认的左边的上下翻箭头
            expendlistview.setGroupIndicator(null);
        }

        @Override
        protected void initListener() {
            ib_back.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    finish();
                }
            });
            //左边ListView 的点击事件，关联右边的多级列表
            listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
                @Override
                public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                    //点击ListView的条目，展示与LIstView中该条目对应的ExpandableListView的列表
                    demandExpandAdapter = new DemandExpandAdapter(activity,demandClassifyBean.classList.get(position).dataList);
                    expendlistview.setAdapter(demandExpandAdapter);

                    for(int i = 0; i < demandExpandAdapter.getGroupCount(); i++){
                        expendlistview.expandGroup(i);//多级列表初始化展开状态
//                    expendlistview.collapseGroup(i);//关闭
                    }
                    firstAdapter.setSelectedPosition(position);//设置选中的条目
                    firstAdapter.notifyDataSetInvalidated();
                }
            });
        }

        @Override
        protected void initData() {
            if (demandClassifyBean != null){
                List<DemandClassifyBean.ClassListBean> classFirstList = demandClassifyBean.classList;
                //ListView 的Adapter
                firstAdapter = new DemandClassifyFirstAdapter(activity,classFirstList);
                listView.setAdapter(firstAdapter);

                if (demandClassifyBean.classList != null && demandClassifyBean.classList.size() != 0) {
                    //Expandable 的Adapter   ，get(0).dataList 默认展示ListView中第一个条目对应的ExpandableListView列表。
                    demandExpandAdapter = new DemandExpandAdapter(activity, demandClassifyBean.classList.get(0).dataList);
                    expendlistview.setAdapter(demandExpandAdapter);

                    for(int i = 0; i < demandExpandAdapter.getGroupCount(); i++){
                        expendlistview.expandGroup(i);//多级列表初始化展开状态
//                    expendlistview.collapseGroup(i);//多级列表初始关闭状态
                    }
                }
            }else {
                onLoad();
            }

        }

        /**
         * 获取需求类目
         */
        private void onLoad(){
            ServiceApi.getDemandClasses(new MyString2Callback() {
                @Override
                public void onError(Call call, Exception e) {
                    ToastUtils.showInternetErrorToast();
                }

                @Override
                public void onResponse(Call call, String s) {
                    // TODO: 2017/2/9
                    demandClassifyBean = new Gson().fromJson(s,DemandClassifyBean.class);
                    if (demandClassifyBean.code == 0){
                        initData();

                    }else {
                        ToastUtils.showToast(demandClassifyBean.msg);
                    }
                }
            });
        }
}

2.之后我们看一下adapter  的代码

先看下ListVIew 的Adapter

/**
 * Created by FanHaiChao on 2017/2/10.
 * 需求类目一级
 */
public class DemandClassifyFirstAdapter extends BaseAdapter {
    private List<DemandClassifyBean.ClassListBean> list;
    Activity activity;
    LayoutInflater inflater;
    private int selectedPosition = 0;

    public DemandClassifyFirstAdapter(Activity activity, List<DemandClassifyBean.ClassListBean> list) {
        this.activity = activity;
        this.list = list;
        inflater = LayoutInflater.from(activity);
    }

    @Override
    public int getCount() {
        return list.size();
    }

    @Override
    public Object getItem(int position) {
        return list.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder = null;
        if (convertView == null) {
            convertView = inflater.inflate(R.layout.item_demand_classify_left, null);
            holder = new ViewHolder();
            holder.textView = (TextView) convertView.findViewById(R.id.textview);
            holder.colorlayout = (LinearLayout) convertView.findViewById(R.id.colorlayout);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }
        // 设置选中效果
        if (selectedPosition == position) {
            holder.textView.setTextColor(Color.parseColor("#ff8400"));
            holder.colorlayout.setBackgroundColor(Color.parseColor("#fff3f3f3"));

        } else {//默认效果
            holder.textView.setTextColor(Color.BLACK);
            holder.colorlayout.setBackgroundColor(Color.WHITE);
        }

        holder.textView.setText(list.get(position).CLASS_NAME.trim());

        return convertView;
    }

    public static class ViewHolder {
        public TextView textView;
        public LinearLayout colorlayout;
    }

    //设置选中的条目
    public void setSelectedPosition(int position) {
        selectedPosition = position;
    }
}

再看下ExpandableListView的Adapter

/**
 * Created by FanHaiChao on 2017/2/10.
 *
 * 需求管理二三级菜单
 */
public class DemandExpandAdapter extends BaseExpandableListAdapter {
    private List<DemandClassifyBean.ClassListBean.DataListBeanX> groupData;
    private Activity activity;

    public DemandExpandAdapter(Activity activity, List<DemandClassifyBean.ClassListBean.DataListBeanX> groupData) {
        this.activity = activity;
        this.groupData = groupData;
    }

    @Override
    public int getGroupCount() {
        return groupData.size();//一级列表数量
    }

    @Override
    public int getChildrenCount(int groupPosition) {
        return groupData.get(groupPosition).dataList == null ? 0:groupData.get(groupPosition).dataList.size();//二级列表数量
    }

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

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

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

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

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

    @Override
    public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
        GroupHolder groupHolder;
        if (convertView == null){
            convertView = LayoutInflater.from(activity).inflate(R.layout.item_demand_classify_group,null);
            groupHolder = new GroupHolder();
            groupHolder.tv_item = (TextView) convertView.findViewById(R.id.tv_item);
            convertView.setTag(groupHolder);
        }else {
            groupHolder = (GroupHolder) convertView.getTag();
        }

        groupHolder.tv_item.setText(groupData.get(groupPosition).CLASS_NAME);
        if (isExpanded){ //一级条目展开和关闭展示的不同颜色
            groupHolder.tv_item.setSelected(true);
        }else {
            groupHolder.tv_item.setSelected(false);
        }
        return convertView;
    }

    @Override
    public View getChildView(final int groupPosition, final int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {
        ChildHolder childHolder;
        if (convertView == null){
            convertView =  LayoutInflater.from(activity).inflate(R.layout.item_demand_classify_expand,null);
            childHolder = new ChildHolder();
            childHolder.tv_item = (TextView) convertView.findViewById(R.id.tv_item);
            convertView.setTag(childHolder);
        }else {
            childHolder = (ChildHolder) convertView.getTag();
        }

        childHolder.tv_item.setText(groupData.get(groupPosition).dataList.get(childPosition).CLASS_NAME);
        //二级列表条目点击事件，返回数据
        childHolder.tv_item.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent = new Intent();
                intent.putExtra("id",groupData.get(groupPosition).dataList.get(childPosition).ID);
                intent.putExtra("name",groupData.get(groupPosition).dataList.get(childPosition).CLASS_NAME);
                activity.setResult(Activity.RESULT_OK,intent);
                activity.finish();
            }
        });
        return convertView;
    }

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

    private class GroupHolder{
        TextView tv_item;
    }

    private class ChildHolder{
        TextView tv_item;
    }
}

详细的介绍在代码中已经介绍了，我就不在一一介绍了，不了解的请参阅： http://blog.csdn.net/shexiaoheng/article/details/41351247 

http://blog.csdn.net/wangkeke1860/article/details/46477361