上一次我们学会了使用ListView以及对它进行优化,那么今天我们来学一下跟ListView特别像的一个控件,ExpandableListView。
跟ExpandableListView跟ListView名字就很像,多了一个Expand,是可拉伸的意思。ListView是一个一级列表,他是一个二级列表,话不多说,我们来看一下他的效果:

首先显示第几组是一级列表,点开以后是里面的数据,也就是二级列表。现在大家应该知道这个是什么意思了吧。
因为ExpandableListView和ListView太像了,所以就不一步一步地跟大家做了,我说一下流程和几个关键的步骤:
1.在.xml文件中添加一个标签<ExpandableListView,然后给上Id
2.在Activiy中创建ExpandableListView对象,通过findViewById查找到对应控件。
3.创建数据(是ExpandableListView的适配器接收的数据),一般来说我们用Map嵌套List的数据类型作为适配器的数据。
4.创建适配器类,注意我们ExpandableListView的适配器所继承的类不是BaseAdapter,而是BaseExpandableListAdapter,

随后在里面实现方法。但是我们会发现,这个适配器实现的方法远远比BaseAdapter实现的方法要多得多,我们来一个一个看一下:

首先这两个分别是获取到组的个数(就像上面我们看到的一共有多少个一级列表),和获取到某个组的子选项的个数(某个一级列表有多少个数据)。

这两个是获取我们的某一个组条目和获取某一个子条目,

这两个是获取组的Id和获取某一组的子条目的Id

这个方法我们暂时不说,因为使用的话暂时不用了解,等以后分析ExpandableListView的时候再说。

这个方法是我们的子条目是否可点击,如果返回false,则无法点击,就是子条目的点击事件无法被调用,返回true则恰恰相反。

而我们今天主要看的、主要写的就是这两个方法:获取组视图和获取某一个组视图的子视图。
现在我们来简单实现一下。
由于我们把Adapter接收的数据源类型设置为Map嵌套List,所以我们要在构造器(Adapter)里面创建一个Map类型对象来接收数据。当然还不能少了一个很重要的属性:上下文(Context)

没问题对吧,现在我们来想一个问题:我们接收的数据类型为Map嵌套List,也就是说我们把Map的Key值当成一级列表的名字,把每个Key储存的value(List类型)当做二级列表。这个应该可以理解吧。
但是我们都知道HaspMap是无序的,我们上面的各种方法的参数大多数都是position,也就是坐标,但是对于一个无序的Map是无法通过position来找到对应的value。所以在这之前我们要先做一点手脚:我们在适配器里面再创建一个List对象,用来存储 把Map的key值转化为的List。这样我们就可以通过List,得到对应position的key值,进而得到二级列表。我们来演示一下。

我们在适配器中添加了一个用于存储key的list,至于这个list的数据,我们在Activity中给它传入就好。(这个我们等会儿在写)。

在getGroupCount方法中,我们传入了map的size,这个大家都能看懂。
在getChildrenCount方法中,我们传入通过keyList和groupPosition得到了对应位置的key值,然后得到了对应的value(List类型),最后得到了list的size。

这两个方法跟上面的两个很像,大家应该可以看懂。

传入Id的方法,还是跟BaseAdapter一样,吧对应的参数返回就好。下面我们来看一看最重要的两个方法:大家还记得我们当时是怎么优化BaseAdapter的吗,我们创建了一个ViewHolder的对象用来接收已经加载过的布局的控件,而这里我们是有二级列表,所以我们需要两个ViewHolder。

我们使用的是最简单的数据类型,所以直接就是两个TextView。

跟BaseAdapter一样的逻辑,只是大家注意我们在给tv.setText时传入了key值。

我们在childholder传入值时候,首先通过keyList获取了map的key值,然后获取了子条目。
好了,现在我们的适配器就配置完了,下面我们来写我们的Activity界面。

init为初始化方法,bean为假数据添加方法。
KeyList为把key存入到List中的方法。

最后我们来看一下效果:

网友评论