距离上次更新博客,时隔略长,诸事繁琐,赶在去广州答辩之前,分享下安卓 android 中的一个 列表收缩 类---ExpandableListView

先上效果图:

如果想直接看实现此页面的代码请下滑到 红线 下

站在巨人的肩膀上---重新自定义 android- ExpandableListView 收缩类,实现列表的可收缩扩展-LMLPHP

关于这个类的具体各函数的使用说明,这里不作详细说明,提供一个链接http://www.apkbus.com/android-124715-1-1.html,里面有关于此类的详细介绍。

我在这里主要通过源代码的注释和必要的说明,说明如何实现自定义的收缩列表。

必要的函数:

0->

 ExpandableListView expandListView = (ExpandableListView) this.findViewById(R.id.ecpandable);
expandListView.setGroupIndicator(null);//去掉默认的下指箭头
expandListView.setDivider(null);//去掉下行线

      1->

 @Override
public int getGroupCount() {
//用于返回大标题的数目,例如我上面的图片,共有7个大标题
return armTypes.length;
//armTypes 是用来存放大标题的数组,自定义
}

    2->

 @Override
public int getChildrenCount(int groupPosition) {
//用来返回一个大标题内的字标签数目,传入参数 groupPosition为当前
//大标题的下标,从0开始
return arms_two[groupPosition].length;
//arms_two 是自定义的,存放子标签的 二维 数组
}
//对应上面,这个二维字符串数组共有 7 行,每行对应一个大标签
//每行的列数是子标签数,对应当前大标签,有多少个就是有多少个孩子
private String[][] arms_two = new String[][]{ //
{"班车列表(30分钟/班)","清记甜品","石头城","贝壳屋",}, //0~--
{"小a","清记甜品","石头城","贝壳屋",},
{"小c","清记甜品","石头城","贝壳屋","羊肉丁",},
{"小d",},
{"小e",},
{"小f",},
{"小aa",},
};

      3->

//返回当前的大标签数目,对应上面的 getGroupCount 函数,传入的是谁
// 返回的就是对应谁的数目,上面是armTypes,那么就是它的数目
@Override
public long getGroupId(int groupPosition) {
return groupPosition; //注意,它是从0下标开始的
}

     4->

//返回对应的每个大标签的 子标签数目,传入的 groupPosition 是当前的大
//标签下标,.length 就是当前行的列数
@Override
public int getChildrenCount(int groupPosition) {
return arms_two[groupPosition].length;
}

     5->

@Override
public View getGroupView(int groupPosition, boolean isExpanded,View convertView, ViewGroup parent) {
//返回大标签对应的 布局 视图,可以纯代码,也可以使用 xml 布局文件
//使用 xml 布局文件例子
RelativeLayout group = (RelativeLayout) RelativeLayout.inflate(getBaseContext(), R.layout.extend_group, null);
return group;
}

     6->

@Override
public View getChildView(int groupPosition, int childPosition, boolean isLastChild,View convertView, ViewGroup parent) {
// 返回 子标签显示的 布局 视图,可以纯 代码,也可以 使用xml 布局文件
//xml 布局例子
LinearLayout child = (LinearLayout) LinearLayout.inflate(getBaseContext(), R.layout.extend_child, null);
//建议使用listView
return child;
}

----------------------------------*********必要的函数分析完毕*********--------------------------------------

----------------------------------现在上实现我上述图片的代码

主父布局

 <?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" >
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="50dp"
android:background="#ff19a9f8"
>
<Button
android:layout_marginLeft="5dp"
android:layout_width="30dp"
android:layout_height="25dp"
android:id="@+id/back"
android:background="@drawable/back"
android:layout_gravity="left|center_vertical"/>
<TextView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="路灯"
android:textSize="20sp"
android:textColor="#000000"
/>
</FrameLayout>
<TextView
android:alpha="0.6"
android:textColor="#ff19a9f8"
android:layout_marginTop="10dp"
android:layout_gravity="center"
android:id="@+id/guild"
android:textSize="20dp"
android:text="私人路线推荐"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<ExpandableListView
android:layout_marginTop="5dp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/ecpandable"
/> </LinearLayout>

group 布局

 <?xml version="1.0" encoding="utf-8"?>

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"> <ImageView android:layout_marginLeft="@dimen/extend_x_left"
android:id="@+id/entend_x"
android:background="@drawable/extend_x"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:alpha="0.8"
android:id="@+id/time_coustom"
android:layout_marginLeft="20dp"
android:text="1:00pm"
android:textSize="17dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/entend_x"
/>
<ImageView
android:id="@+id/entend_line"
android:layout_marginLeft="5dp"
android:background="@drawable/extend_line"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/time_coustom"
/>
<TextView
android:id="@+id/loca_name"
android:textSize="17dp"
android:text="北理乘车"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/entend_line"
/>
<ImageView
android:id="@+id/down"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_alignParentRight="true"
android:background="@drawable/right"
android:layout_width="15dp"
android:layout_height="15dp" />
</RelativeLayout>

子标签布局

<?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"> <LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_marginLeft="@dimen/extend_x_left"
android:id="@+id/entend_chile_x"
android:background="@drawable/extend_line"
android:layout_width="wrap_content"
android:layout_height="fill_parent" />
<LinearLayout
android:layout_marginLeft="40dp"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"> <LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="@+id/top"
android:textColor="#fff60807"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_marginLeft="10dp"
android:id="@+id/top_info"
android:text="班车列表(30分钟/班)"
android:layout_width="wrap_content"
android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout> </LinearLayout> </LinearLayout>

主页面 java 代码

 package com.LGH.weixin;

 import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AbsListView;
import android.widget.BaseExpandableListAdapter;
import android.widget.ExpandableListAdapter;
import android.widget.ExpandableListView;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView; import static com.LGH.weixin.R.id.time_coustom; /**
* updated by LinGuanHong on 2015.5.21
*/ public class extendList extends Activity{ private TextView time_custom;
private TextView top_left;
private TextView top_info;
//贴士
private TextView tips;
private TextView tips_info;
private TextView tips1;
private TextView tips_info1;
private TextView tips2;
private TextView tips_info2;
//特色
private TextView exp;
private TextView exp_info;
private TextView exp1;
private TextView exp_info1;
private TextView exp2;
private TextView exp_info2;
//路上
private TextView way;
private TextView way_info;
private TextView way1;
private TextView way_info1;
private TextView way2;
private TextView way_info2;
//推荐
private TextView push;
private TextView push_info;
private TextView push1;
private TextView push_info1;
private TextView push2;
private TextView push_info2; //linearLayout
LinearLayout[] way_linear = new LinearLayout[3];
LinearLayout[] exp_linear = new LinearLayout[3];
LinearLayout[] push_linear = new LinearLayout[3];
//LinearLayout push2_linear = new LinearLayout(extendList.this); LinearLayout child ; private TextView loca_name;
private ImageView down; @Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.el_main); /**BaseExpandableListAdapter实现了ExpandableListAdapter*/
ExpandableListAdapter adapter = new BaseExpandableListAdapter(){ /**----------定义数组-------------------------------------------------------------------*/
private String JianGe = " ";
private int[] images = new int[]{//子列表文字左边对应的图片
R.drawable.ic_launcher,
R.drawable.right,
R.drawable.show
};
private String[] time = new String[]{
"1:00pm","1:30pm","4:30pm","5:10pm","6:10pm",
"7:00pm","7:30pm"
};
private String[] armTypes = new String[]{
"北理乘车","华发商都","名人雕塑园","杨氏大祠堂","津滋味馆",
"普陀寺","返回北理"
};
private String[] top = new String[]{"贴士:","路上:","特色:","推荐:",}; private String[][] arms_two = new String[][]{ //
{"班车列表(30分钟/班)","清记甜品","石头城","贝壳屋",}, //0~--
{"小a","清记甜品","石头城","贝壳屋",},
{"小c","清记甜品","石头城","贝壳屋","羊肉丁",},
{"小d",},
{"小e",},
{"小f",},
{"小aa",},
}; private String[][] arms = new String[][]{ //tips 数组---------------------------------------------------
{"班车列表(30分钟/班)",}, //0~--
{"小a",},
{"小c",},
{"小d",},
{"小e",},
{"小f",},
{"小aa",},
};
private String[][] arms_way = new String[][]{
{"清记甜品","石头城","贝壳屋","羊肉丁",},
{"清记甜品",},
{"小aa",},
{"小cc",},
{"小ss",},
{"小da",},
{"小xxx",},
};
private String[][] arms_exp = new String[][]{
{"羊肉丁"},
{"小x",},
{"小xx",},
{"小g",},
{"小gg",},
{"小asa",},
{"小wc",},
};
private String[][] arms_push = new String[][]{
{"甜味滋"},
{"小m",},
{"a",},
{"s",},
{"ddd",},
{"aa",},
{"xxxx",},
}; /*===========组元素表示可折叠的列表项,子元素表示列表项展开后看到的多个子元素项=============*/ /**----------得到armTypes和arms中每一个元素的ID-------------------------------------------*/ //获取组在给定的位置编号,即armTypes中元素的ID
@Override
public long getGroupId(int groupPosition) {
return groupPosition; //从0下标开始
} //获取在给定的组的儿童的ID,就是arms中元素的ID
@Override
public long getChildId(int groupPosition, int childPosition) {
return childPosition;
} /**----------根据上面得到的ID的值,来得到armTypes、arms中元素的个数 ------------------------*/ //获取的群体数量,得到armTypes里元素的个数
@Override
public int getGroupCount() {
return armTypes.length;
} //取得指定组中的儿童人数,就是arms_two中个数
@Override
public int getChildrenCount(int groupPosition) {
return arms_two[groupPosition].length;
} /**----------利用上面getGroupId得到ID,从而根据ID得到armTypes中的数据,并填到TextView中 -----*/ //获取与给定的组相关的数据,得到数组armTypes中元素的数据
@Override
public Object getGroup(int groupPosition) {
return armTypes[groupPosition]; //这里返回字符对象
}
public String getCoustomText(int groupPosition){ //自定义文本输出
return time[groupPosition];
} //获取一个视图显示给定组,存放armTypes
@Override
public View getGroupView(int groupPosition, boolean isExpanded,View convertView, ViewGroup parent) {
RelativeLayout group = (RelativeLayout) RelativeLayout.inflate(getBaseContext(), R.layout.extend_group, null); time_custom = (TextView) group.findViewById(time_coustom);
loca_name = (TextView) group.findViewById(R.id.loca_name);
down = (ImageView) group.findViewById(R.id.down);
time_custom.setText(getCoustomText(groupPosition)); //不加 group 会蹦,会爆 nullPoint...
loca_name.setText(getGroup(groupPosition).toString()); return group;
} /**----------利用上面getChildId得到ID,从而根据ID得到arms中的数据,并填到TextView中---------*/ //获取与孩子在给定的组相关的数据,得到数组arms中元素的数据
@Override
public Object getChild(int groupPosition, int childPosition) {
return arms[groupPosition][childPosition];
} //获取一个视图显示在给定的组 的儿童的数据,就是存放arms
@Override
public View getChildView(int groupPosition, int childPosition, boolean isLastChild,View convertView, ViewGroup parent) {
//从布局文件中加载View
down.setBackground(getResources().getDrawable(R.drawable.show));
//child = (LinearLayout) LinearLayout.inflate(getBaseContext(), R.layout.extend, null);//放外面会造成 单一性
child = (LinearLayout) LinearLayout.inflate(getBaseContext(), R.layout.extend_child, null);//第二种方案
LinearLayout.LayoutParams layoutParams=new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, 0); //设置高为0,达到隐藏的目的 //init();
init_two();
if(childPosition==0) { //如果存在两行,那么第二行的设置如下 if 体
top_left.setText(top[0]);//贴士固定有
top_info.setText(arms_two[groupPosition][0]);//第一个总是 tips的信息
}
if(childPosition==1) { //如果存在两行,那么第二行的设置如下 if 体
top_left.setText(top[1]);
top_info.setText(arms_two[groupPosition][1]);
} if(childPosition==2) { //如果存在3行,那么第二行的设置如下 if 体
top_left.setText(JianGe);
top_info.setText(arms_two[groupPosition][2]);
} if(childPosition==3){ //证明路上有2个,这是第三行的设置
top_left.setText(JianGe);//左边空格
top_info.setText(arms_two[groupPosition][3]);
} if(childPosition==4){ //证明路上有3个,这是第4行的设置
top_left.setTextColor(getResources().getColor(R.color.underLine)); //改变颜色
top_left.setText(top[2]);//左边空格
top_info.setText(arms_two[groupPosition][4]);
} if(childPosition==5){ //这里是第五行,此时这是 特色
top_left.setText(JianGe);//左边空格
top_info.setText(arms_two[groupPosition][5]);
} if(childPosition==6){
top_left.setText(JianGe);//左边空格
top_info.setText(arms_two[groupPosition][6]);
} if(childPosition==7){
top_left.setTextColor(getResources().getColor(R.color.underLine)); //改变颜色
top_left.setText(top[3]);//左边空格
top_info.setText(arms_two[groupPosition][7]);
} if(childPosition==8){ //推荐开始
top_left.setText(JianGe);//左边空格
top_info.setText(arms_two[groupPosition][8]);
} if(childPosition==9){ //推荐开始 2
top_left.setText(JianGe);//左边空格
top_info.setText(arms_two[groupPosition][9]);
} //具体操作
/*tips.setText(top[0]); //第一个贴士固定不变
tips_info.setText(arms[groupPosition][0]); //目前只显示一条 tips,故列下标是 0
LinearLayout.LayoutParams layoutParams=new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, 0); //设置高为0,达到隐藏的目的
if(groupPosition>=0){
//way 路上设置;
way.setText(top[1]);
if( arms_way[groupPosition].length ==1){//只有1列
way_info.setText(arms_way[groupPosition][0]);
way_linear[1].setLayoutParams(layoutParams);
way_linear[2].setLayoutParams(layoutParams);
}
if( arms_way[groupPosition].length ==2){//最多3 列
way1.setText(JianGe);
way_info.setText(arms_way[groupPosition][0]);
way_info1.setText(arms_way[groupPosition][1]);
way_linear[2].setLayoutParams(layoutParams);
}
if( arms_way[groupPosition].length ==3){
way1.setText(JianGe);
way2.setText(JianGe);
way_info.setText(arms_way[groupPosition][0]);
way_info1.setText(arms_way[groupPosition][1]);
way_info2.setText(arms_way[groupPosition][2]);
}
} // 特色设置
if(groupPosition>=0){ exp.setText(top[2]);
if( arms_exp[groupPosition].length ==1){//只有1列
exp_info.setText(arms_exp[groupPosition][0]);
exp_linear[1].setLayoutParams(layoutParams);
exp_linear[2].setLayoutParams(layoutParams);
}
if( arms_exp[groupPosition].length ==2){//只有2列
exp1.setText(JianGe);
exp_info.setText(arms_exp[groupPosition][0]);
exp_info.setText(arms_exp[groupPosition][1]);
exp_linear[2].setLayoutParams(layoutParams);
}
if( arms_exp[groupPosition].length ==3){//只有3列
exp1.setText(JianGe);
exp2.setText(JianGe);
exp_info.setText(arms_exp[groupPosition][0]);
exp_info.setText(arms_exp[groupPosition][1]);
exp_info.setText(arms_exp[groupPosition][2]);
}
} // 推荐设置
if(groupPosition>=0){ push.setText(top[3]);
if( arms_push[groupPosition].length ==1){//只有1列
push_info.setText(arms_push[groupPosition][0]);
push_linear[1].setLayoutParams(layoutParams);
push_linear[2].setLayoutParams(layoutParams);
}
if( arms_push[groupPosition].length ==2){//只有1列
push1.setText(JianGe);
push_info.setText(arms_push[groupPosition][0]);
push_info.setText(arms_push[groupPosition][1]);
push_linear[2].setLayoutParams(layoutParams);
}
if( arms_push[groupPosition].length ==3){//只有1列
push1.setText(JianGe);
push2.setText(JianGe);
push_info.setText(arms_push[groupPosition][0]);
push_info.setText(arms_push[groupPosition][1]);
push_info.setText(arms_push[groupPosition][2]);
}
}*/ // Toast.makeText(extendList.this, groupPosition+ "---", Toast.LENGTH_LONG).show();
/* LinearLayout ll = new LinearLayout(extendList.this);
ll.setOrientation(LinearLayout.HORIZONTAL);//定义为纵向排列
ImageView logo = new ImageView(extendList.this);
logo.setImageResource(images[groupPosition]);//添加图片
ll.addView(logo);
TextView textView = getTextView();//调用定义的getTextView()方法
textView.setText(getChild(groupPosition,childPosition).toString());//添加数据
ll.addView(textView);*/
return child;
} /**------------------自定义一个设定TextView属性的方法----------------------------------------------*/ //定义一个TextView
private TextView getTextView(){
AbsListView.LayoutParams lp = new AbsListView.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT,40);
TextView textView = new TextView(extendList.this);
textView.setLayoutParams(lp);
textView.setTextSize(20);
return textView;
} /**-------------------其他设置-------------------------------------------------------------------*/ //孩子在指定的位置是可选的,即:arms中的元素是可点击的
@Override
public boolean isChildSelectable(int groupPosition,int childPosition) {
return true;
} //表示孩子是否和组ID是跨基础数据的更改稳定
public boolean hasStableIds() {
return true;
}
}; /**使用适配器*/
ExpandableListView expandListView = (ExpandableListView) this.findViewById(R.id.ecpandable);
expandListView.setGroupIndicator(null);//去掉默认的下指箭头
expandListView.setDivider(null);//去掉下行线
/* expandListView.setOnGroupClickListener(new ExpandableListView.OnGroupClickListener() {
@Override
public boolean onGroupClick(ExpandableListView parent, View v, int groupPosition, long id) {
down.setBackground(getResources().getDrawable(R.drawable.show));
return true;
}
});*/
expandListView.setAdapter(adapter);
}
private void init(){
for(int j =0;j<way_linear.length;j++){
way_linear[j] = new LinearLayout(extendList.this);
exp_linear[j] = new LinearLayout(extendList.this);
push_linear[j] = new LinearLayout(extendList.this);
}
//初始化
tips = (TextView) child.findViewById(R.id.tips);
tips_info = (TextView) child.findViewById(R.id.tips_info); way = (TextView) child.findViewById(R.id.way);
way_info = (TextView) child.findViewById(R.id.way_info);
way1 = (TextView) child.findViewById(R.id.way1);
way_info1 = (TextView) child.findViewById(R.id.way_info1);
way2 = (TextView) child.findViewById(R.id.way2);
way_info2 = (TextView) child.findViewById(R.id.way_info2); exp = (TextView) child.findViewById(R.id.exp);
exp_info = (TextView) child.findViewById(R.id.exp_info);
exp1 = (TextView) child.findViewById(R.id.exp1);
exp_info1 = (TextView) child.findViewById(R.id.exp_info1);
exp2 = (TextView) child.findViewById(R.id.exp2);
exp_info2 = (TextView) child.findViewById(R.id.exp_info2); push = (TextView) child.findViewById(R.id.push);
push_info = (TextView) child.findViewById(R.id.push_info);
push1 = (TextView) child.findViewById(R.id.push1);
push_info1 = (TextView) child.findViewById(R.id.push_info1);
push2 = (TextView) child.findViewById(R.id.push2);
push_info2 = (TextView) child.findViewById(R.id.push_info2); way_linear[0] = (LinearLayout) child.findViewById(R.id.way_linear);
way_linear[1] = (LinearLayout) child.findViewById(R.id.way1_linear);
way_linear[2] = (LinearLayout) child.findViewById(R.id.way2_linear);
exp_linear[0] = (LinearLayout) child.findViewById(R.id.exp_linear);
exp_linear[1] = (LinearLayout) child.findViewById(R.id.exp1_linear);
exp_linear[2] = (LinearLayout) child.findViewById(R.id.exp2_linear);
push_linear[0] = (LinearLayout) child.findViewById(R.id.push_linear);
push_linear[1] = (LinearLayout) child.findViewById(R.id.push1_linear);
push_linear[2] = (LinearLayout) child.findViewById(R.id.push2_linear);
}
public void init_two(){
top_left = (TextView) child.findViewById(R.id.top);
top_info = (TextView) child.findViewById(R.id.top_info);
}
}

OK,觉得还可以的话,麻烦帮忙点下右下角的推荐。

05-11 13:17