android列表收缩与展开仿QQ好友列表(非常详细,附源码)
好友QQ列表,可以展开,可以收起,在android中,以往用的比较多的是listview,虽然可以实现列表的展示,但在某些情况下,我们还是希望用到可以分组并实现收缩的列表,那就要用到android的ExpandableListView,今天研究了一下这个的用法,也参考了很多资料动手写了一个小demo,实现了基本的功能,下面直接上效果图以及源代码~!
ExpandableListView是一个垂直滚动显示两级列表项的视图,与ListView不同的是,它可以有两层:每一层都能够被独立的展开并显示其子项。
本文效果:
效果一×××
效果二×××
目录:
一、实现原理
二、布局与代码
三、自定义图标
四、图标放置右边
一、实现原理
1,首先必须在布局文件中定义一个ExpandableListView
2,其次创建一级条目对应的布局文件group
3,创建二级条目对应的布局文件child
4,加载ExpandableListView组件的Activity必须继承自ExpandableListActivity
二、布局与代码
1、首先在主布局中activity_main.xml
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical"><ExpandableListViewandroid:id="@id/android:list"android:layout_width="fill_parent"android:layout_height="fill_parent"/></LinearLayout>
2、其次在drawable文件夹定义布局一级列表groups.xml
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:orientation="vertical"android:layout_width="fill_parent"android:layout_height="fill_parent"><TextViewandroid:id="@+id/textGroup"android:layout_width="fill_parent"android:layout_height="fill_parent"android:paddingLeft="40px"android:paddingTop="6px"android:paddingBottom="6px"android:textSize="25sp"android:text="Nodata"/></LinearLayout>
3、接着在drawable文件夹定义布局二级列表childs.xml
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:orientation="vertical"android:layout_width="fill_parent"android:layout_height="fill_parent"> <TextViewandroid:id="@+id/textChild"android:layout_width="fill_parent"android:layout_height="fill_parent"android:paddingLeft="60px"android:paddingTop="10px"android:paddingBottom="10px"android:textSize="20sp"android:text="NoData"/></LinearLayout>
4、然后就是初始化和使用了
packagecom.example.expandablelistview;importjava.util.ArrayList;importjava.util.HashMap;importjava.util.List;importjava.util.Map;importandroid.os.Bundle;importandroid.app.ExpandableListActivity;importandroid.util.DisplayMetrics;importandroid.view.View;importandroid.widget.ExpandableListView;importandroid.widget.SimpleExpandableListAdapter;importandroid.widget.Toast;publicclassMainActivityextendsExpandableListActivity{/***创建一级条目容器*/List<Map<String,String>>gruops=newArrayList<Map<String,String>>();/***存放内容,以便显示在列表中*/List<List<Map<String,String>>>childs=newArrayList<List<Map<String,String>>>();@OverridepublicvoidonCreate(BundlesavedInstanceState){super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);setListData();}/***设置列表内容*/publicvoidsetListData(){//创建二个一级条目标题Map<String,String>title_1=newHashMap<String,String>();Map<String,String>title_2=newHashMap<String,String>();Map<String,String>title_3=newHashMap<String,String>();title_1.put("group","林炳文");title_2.put("group","文炳林");gruops.add(title_1);gruops.add(title_2);//创建二级条目内容//内容一Map<String,String>title_1_content_1=newHashMap<String,String>();Map<String,String>title_1_content_2=newHashMap<String,String>();Map<String,String>title_1_content_3=newHashMap<String,String>();title_1_content_1.put("child","工人");title_1_content_2.put("child","学生");title_1_content_3.put("child","农民");List<Map<String,String>>childs_1=newArrayList<Map<String,String>>();childs_1.add(title_1_content_1);childs_1.add(title_1_content_2);childs_1.add(title_1_content_3);//内容二Map<String,String>title_2_content_1=newHashMap<String,String>();Map<String,String>title_2_content_2=newHashMap<String,String>();Map<String,String>title_2_content_3=newHashMap<String,String>();title_2_content_1.put("child","猩猩");title_2_content_2.put("child","老虎");title_2_content_3.put("child","狮子");List<Map<String,String>>childs_2=newArrayList<Map<String,String>>();childs_2.add(title_2_content_1);childs_2.add(title_2_content_2);childs_2.add(title_2_content_3);childs.add(childs_1);childs.add(childs_2);/***创建ExpandableList的Adapter容器参数:1.上下文2.一级集合3.一级样式文件4.一级条目键值*5.一级显示控件名6.二级集合7.二级样式8.二级条目键值9.二级显示控件名**/SimpleExpandableListAdaptersela=newSimpleExpandableListAdapter(this,gruops,R.drawable.groups,newString[]{"group"},newint[]{R.id.textGroup},childs,R.drawable.childs,newString[]{"child"},newint[]{R.id.textChild});//加入列表setListAdapter(sela);}/***列表内容按下*/@OverridepublicbooleanonChildClick(ExpandableListViewparent,Viewv,intgroupPosition,intchildPosition,longid){Toast.makeText(MainActivity.this,"您选择了"+gruops.get(groupPosition).toString()+"子编号"+childs.get(groupPosition).get(childPosition).toString(),Toast.LENGTH_SHORT).show();returnsuper.onChildClick(parent,v,groupPosition,childPosition,id);}/***二级标题按下*/@OverridepublicbooleansetSelectedChild(intgroupPosition,intchildPosition,booleanshouldExpandGroup){returnsuper.setSelectedChild(groupPosition,childPosition,shouldExpandGroup);}/***一级标题按下*/@OverridepublicvoidsetSelectedGroup(intgroupPosition){super.setSelectedGroup(groupPosition);}}
5、效果
这是我手机上的效果,点击工人。学生等二级列表时,我手机上会有提示框出现的,但是不知为什么录制下来就是没有。
三、自定义列表图标
上面的图标是系统自己生成的,下面我们要改成自己的
1、更改自定义图标
在drawable文件夹下新建expandablelistview_change.xml
<?xmlversion="1.0"encoding="utf-8"?><selectorxmlns:android="http://schemas.android.com/apk/res/android"><itemandroid:state_expanded="true"android:drawable="@drawable/w2"/><itemandroid:drawable="@drawable/w1"/></selector>
2、修改上面布局Activity.main.xml
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical"><ExpandableListViewandroid:id="@id/android:list"android:layout_width="fill_parent"android:layout_height="fill_parent"android:background="#f5f5f5"android:cacheColorHint="#f5f5f5"android:groupIndicator="@drawable/expandablelistview_change"/></LinearLayout>
其实就是加了一句android:groupIndicator="@drawable/expandablelistview_change"
下面我们再来看看效果:
四、图标放置右边
在上面MainActivity.java的函数setListData()加中:
//得到屏幕的大小DisplayMetricsdm=newDisplayMetrics();getWindowManager().getDefaultDisplay().getMetrics(dm);//图标设置在右边getExpandableListView().setIndicatorBounds(dm.widthPixels-60,dm.widthPixels);//设置指示图标的位置
效果:
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。