ExpandListview应用（实现二级列表和实现新闻分类）

ExpandListView在我们开发中使用非常常见，但原生的ExpandListView往往会达不到我们使用的效果，我们会以两个例子为例来理解ExpandListView，现在我们看下如何做呢？

实现二级列表

首先我们看下效果图：

 

我们看下布局文件：

1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="fill_parent"
4. android:layout_height="fill_parent"
5. android:background="@color/back"
6. android:orientation="vertical" >
7.  
8.  
9.  
10. <LinearLayout
11. android:layout_width="fill_parent"
12. android:layout_height="44dp" >
13.  
14. <TextView
15. android:layout_width="fill_parent"
16. android:layout_height="wrap_content"
17. android:layout_gravity="center"
18. android:layout_marginLeft="1px"
19. android:gravity="center"
20. android:text="@string/message"
21. android:textColor="#DAC310"
22. android:textSize="20dp" />
23. </LinearLayout>
24.  
25. <LinearLayout
26. android:layout_width="wrap_content"
27. android:layout_height="wrap_content"
28. android:orientation="horizontal" >
29.  
30. <ExpandableListView
31. android:id="@+id/list"
32. android:layout_width="fill_parent"
33. android:layout_height="wrap_content"
34. android:layout_marginLeft="16dp"
35. android:layout_marginRight="16dp"
36. android:childDivider="@color/item_line_color"
37. android:divider="@null"
38. android:dividerHeight="1px"
39. android:gravity="center"
40. android:listSelector="#00000000"
41. android:scrollbars="none" >
42. </ExpandableListView>
43.  
44. </LinearLayout>
45.  
46. </LinearLayout>

我们还需要做一下的准备child_layout.xml；child_s_layout.xml；group_layout.xml：

child_layout.xml:

1. <?xml version="1.0" encoding="utf-8"?>
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="fill_parent"
4. android:layout_height="match_parent"
5. android:background="@color/white" >
6.  
7. <TextView
8. android:id="@+id/child_text"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentLeft="true"
12. android:layout_centerVertical="true"
13. android:layout_marginLeft="10dp"
14. android:textColor="@color/item_text_color"
15. android:textSize="20dp" />
16.  
17. <CheckBox
18. style="@style/my_CheckBox"
19. android:layout_width="wrap_content"
20. android:layout_height="wrap_content"
21. android:layout_alignParentRight="true"
22. android:layout_centerVertical="true" />
23.  
24. </RelativeLayout>

child_s_layout.xml：

1. <?xml version="1.0" encoding="utf-8"?>
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="fill_parent"
4. android:layout_height="match_parent"
5. android:background="@drawable/text_item_bottom_bg" >
6.  
7. <TextView
8. android:id="@+id/child_text"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_marginLeft="10dp"
12. android:layout_marginTop="15dp"
13. android:textColor="@color/item_text_color"
14. android:textSize="20dp" />
15.  
16. <LinearLayout
17. android:layout_width="fill_parent"
18. android:layout_height="match_parent"
19. android:layout_below="@id/child_text"
20. android:gravity="center_horizontal"
21. android:orientation="horizontal"
22. android:padding="10dp" >
23.  
24. <Button
25. android:layout_width="wrap_content"
26. android:layout_height="wrap_content"
27. android:background="@drawable/btn_nromal_bg"
28. android:paddingBottom="10dp"
29. android:paddingLeft="20dp"
30. android:paddingRight="20dp"
31. android:paddingTop="10dp"
32. android:text="是" />
33.  
34. <Button
35. android:layout_width="wrap_content"
36. android:layout_height="wrap_content"
37. android:layout_marginLeft="30dp"
38. android:background="@drawable/btn_pressed_bg"
39. android:paddingBottom="10dp"
40. android:paddingLeft="20dp"
41. android:paddingRight="20dp"
42. android:textColor="@color/white"
43. android:paddingTop="10dp"
44. android:text="有时" />
45.  
46. <Button
47. android:layout_width="wrap_content"
48. android:layout_height="wrap_content"
49. android:layout_marginLeft="30dp"
50. android:background="@drawable/btn_nromal_bg"
51. android:paddingBottom="10dp"
52. android:paddingLeft="20dp"
53. android:paddingRight="20dp"
54. android:paddingTop="10dp"
55. android:text="经常" />
56. </LinearLayout>
57.  
58. </RelativeLayout>

group_layout.xml：

1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="fill_parent"
4. android:layout_height="wrap_content"
5. android:orientation="vertical" >
6.  
7. <View
8. android:layout_width="fill_parent"
9. android:layout_height="10dp"
10. android:background="#00000000" />
11.  
12. <RelativeLayout
13. android:id="@+id/group_layout"
14. android:layout_width="fill_parent"
15. android:layout_height="wrap_content"
16. android:background="@drawable/text_item_bg"
17. android:paddingBottom="10dp"
18. android:paddingTop="10dp" >
19.  
20. <TextView
21. android:id="@+id/group_title"
22. android:layout_width="wrap_content"
23. android:layout_height="wrap_content"
24. android:layout_alignParentLeft="true"
25. android:layout_centerInParent="true"
26. android:layout_marginLeft="10dp"
27. android:textColor="@color/head_text_color"
28. android:textSize="20dp" />
29.  
30. <ImageView
31. android:id="@+id/group_state"
32. android:layout_width="wrap_content"
33. android:layout_height="wrap_content"
34. android:layout_alignParentRight="true"
35. android:layout_centerInParent="true"
36. android:layout_marginRight="10dp" />
37. </RelativeLayout>
38.  
39. </LinearLayout>

下面我们看下activity如何写：

1. package com.adth.eagleeducation.ui;
2.  
3. import java.util.ArrayList;
4. import java.util.List;
5.  
6. import android.app.Activity;
7. import android.content.pm.ActivityInfo;
8. import android.os.Bundle;
9. import android.view.View;
10. import android.view.View.OnClickListener;
11. import android.view.Window;
12. import android.widget.ImageView;
13. import android.widget.ListView;
14. import android.widget.TextView;
15. import android.widget.Toast;
16.  
17. import com.adth.eagleeducation.adapter.Today_activity_adapter;
18. import com.adth.eagleeducation.adapter.Today_course_Adapter;
19. import com.adth.eagleeducation.bean.Activityinformation;
20. import com.adth.eagleeducation.bean.Course;
21.  
22. public class DailyEventActivity extends Activity {
23.  
24. private ListView lv_daily_course;
25. private List<Course> list = new ArrayList<Course>();
26. private Course course;
27. private Today_course_Adapter adapter;
28.  
29. private ImageView btn_title_bar_without_cancel;
30. private TextView tv_title_bar_without_name;
31.  
32. private ListView lv_daily_event;
33. private List<Activityinformation> lv_activity = new ArrayList<Activityinformation>();
34. private Activityinformation actinfor;
35. private Today_activity_adapter adapter_activity;
36. private String date;
37. private TextView tv_daily_event_add;
38. @Override
39. protected void onCreate(Bundle savedInstanceState) {
40. super.onCreate(savedInstanceState);
41. requestWindowFeature(Window.FEATURE_NO_TITLE);
42. setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
43. setContentView(R.layout.fragment_daily_event);
44.  
45. date = this.getIntent().getStringExtra("date");
46. init();
47. }
48.  
49.  
50. public void init(){
51. btn_title_bar_without_cancel = (ImageView) findViewById(R.id.btn_title_bar_without_cancel);
52. btn_title_bar_without_cancel.setOnClickListener(new OnClickListener() {
53.  
54. @Override
55. public void onClick(View v) {
56. // TODO Auto-generated method stub
57. DailyEventActivity.this.finish();
58. }
59. });
60.  
61. tv_title_bar_without_name = (TextView) findViewById(R.id.tv_title_bar_without_name);
62. if(date != null){
63. tv_title_bar_without_name.setText(date);
64. }else{
65. tv_title_bar_without_name.setText("");
66. }
67.  
68. this.lv_daily_course = (ListView) this.findViewById(R.id.lv_daily_course);
69. course = new Course("1", "KeyStone", "Room 301", "9:00-9:40", "K11", "35");
70. list.add(course);
71. course = new Course("2", "Early starter", "Room 302", "10:00-10:40", "IN1A", "40");
72. list.add(course);
73. course = new Course("3", "Intensive", "Room 303", "2:00-2:40", "ST1A", "36");
74. list.add(course);
75. course = new Course("4", "Standard", "Room 304", "3:00-3:40", "ESA1", "37");
76. list.add(course);
77. adapter = new Today_course_Adapter(DailyEventActivity.this, list);
78. lv_daily_course.setAdapter(adapter);
79. //list of activity
80. lv_daily_event = (ListView) findViewById(R.id.lv_daily_event);
81. actinfor = new Activityinformation("1", "go to Nanjing School to study", "10:00-11:30");
82. lv_activity.add(actinfor);
83. adapter_activity = new Today_activity_adapter(this, lv_activity);
84. lv_daily_event.setAdapter(adapter_activity);
85.  
86. tv_daily_event_add = (TextView) findViewById(R.id.tv_daily_event_add);
87. tv_daily_event_add.setOnClickListener(new OnClickListener() {
88.  
89. @Override
90. public void onClick(View v) {
91. // TODO Auto-generated method stub
92. Toast.makeText(DailyEventActivity.this, "new event", 1).show();
93. }
94. });
95. }
96.  
97. }

实现新闻分类

我们看下效果图：

这里的布局文件是这样的：

1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.  
7. <ExpandableListView
8. android:id="@+id/expandableListView"
9. android:layout_width="match_parent"
10. android:layout_height="wrap_content"
11. android:background="@drawable/channel_expandablelistview_bg"
12. android:cacheColorHint="#00000000"
13. android:divider="#ebebeb"
14. android:dividerHeight="1dp"
15. android:footerDividersEnabled="false"
16. android:groupIndicator="@null" >
17. </ExpandableListView>
18.  
19. </RelativeLayout>

我们自定义一个ExpandableListViewAdapter.java:

1. package com.ziaho.ui;
2.  
3. import java.util.ArrayList;
4. import java.util.HashMap;
5.  
6. import com.cn.main.R;
7.  
8. import android.content.Context;
9. import android.graphics.Color;
10. import android.graphics.drawable.ColorDrawable;
11. import android.util.Log;
12. import android.view.LayoutInflater;
13. import android.view.View;
14. import android.view.ViewGroup;
15. import android.widget.AdapterView;
16. import android.widget.BaseExpandableListAdapter;
17. import android.widget.GridView;
18. import android.widget.ImageView;
19. import android.widget.SimpleAdapter;
20. import android.widget.TextView;
21. import android.widget.Toast;
22.  
23. public class ExpandableListViewAdapter extends BaseExpandableListAdapter {
24. public String[] group = { "常用", "搞笑", "原创", "资讯", "体育", "游戏", "汽车", "娱乐" };
25. public String[][] gridViewChild = {
26. { "明星八卦", "雷人囧事", "网络红人", "科技资讯", "美女花边", "游戏达人", "美女车模", "疯狂恶搞" },
27. { "疯狂恶搞", "搞笑综艺", "原创搞笑", "爆笑宠物", "雷人囧事" },
28. { "原创热点", "原创影视", "音乐动画", "火星搞笑", "校园作品", "网络红人", "拍客" },
29. { "社会资讯", "国内资讯", "国际资讯", "财富资讯", "科技资讯" },
30. { "篮球天地", "足球世界", "综合体育", "极限运动", "武术摔角", "美女花边" },
31. { "网络游戏", "电子竞技", "单机电玩", "游戏达人", "工会战队" },
32. { "新车速递", "车型推荐", "改装酷玩", "汽车广告", "评测报告", "美女车模" },
33. { "明星八卦", "影视资讯" } };
34. String[][] child = { { "" }, { "" }, { "" }, { "" }, { "" }, { "" },
35. { "" }, { "" } };
36. LayoutInflater mInflater;
37. Context context;
38.  
39. public ExpandableListViewAdapter(Context context) {
40. // TODO Auto-generated constructor stub
41. mInflater = LayoutInflater.from(context);
42. this.context = context;
43. }
44.  
45. @Override
46. public Object getChild(int groupPosition, int childPosition) {
47. // TODO Auto-generated method stub
48. return child[groupPosition][childPosition];
49. }
50.  
51. @Override
52. public long getChildId(int groupPosition, int childPosition) {
53. // TODO Auto-generated method stub
54. return childPosition;
55. }
56.  
57. @Override
58. public View getChildView(int groupPosition, int childPosition,
59. boolean isLastChild, View convertView, ViewGroup parent) {
60. // TODO Auto-generated method stub
61. if (convertView == null) {
62. mViewChild = new ViewChild();
63. convertView = mInflater.inflate(
64. R.layout.channel_expandablelistview_item, null);
65. mViewChild.gridView = (GridView) convertView
66. .findViewById(R.id.channel_item_child_gridView);
67. convertView.setTag(mViewChild);
68. } else {
69. mViewChild = (ViewChild) convertView.getTag();
70. }
71.  
72. SimpleAdapter mSimpleAdapter = new SimpleAdapter(context,
73. setGridViewData(gridViewChild[groupPosition]),
74. R.layout.channel_gridview_item,
75. new String[] { "channel_gridview_item" },
76. new int[] { R.id.channel_gridview_item });
77. mViewChild.gridView.setAdapter(mSimpleAdapter);
78. setGridViewListener(mViewChild.gridView);
79. mViewChild.gridView.setSelector(new ColorDrawable(Color.TRANSPARENT));
80. return convertView;
81. }
82.  
83. /**
84. * 设置gridview点击事件监听
85. *
86. * @param gridView
87. */
88. private void setGridViewListener(final GridView gridView) {
89. gridView.setOnItemClickListener(new GridView.OnItemClickListener() {
90. @Override
91. public void onItemClick(AdapterView<?> parent, View view,
92. int position, long id) {
93. // TODO Auto-generated method stub
94. if (view instanceof TextView) {
95. // 如果想要获取到哪一行，则自定义gridview的adapter，item设置2个textview一个隐藏设置id，显示哪一行
96. TextView tv = (TextView) view;
97. Toast.makeText(context,
98. "position=" + position + "||" + tv.getText(),
99. Toast.LENGTH_SHORT).show();
100. Log.e("hefeng", "gridView listaner position=" + position
101. + "||text=" + tv.getText());
102. }
103. }
104. });
105. }
106.  
107. /**
108. * 设置gridview数据
109. *
110. * @param data
111. * @return
112. */
113. private ArrayList<HashMap<String, Object>> setGridViewData(String[] data) {
114. ArrayList<HashMap<String, Object>> gridItem = new ArrayList<HashMap<String, Object>>();
115. for (int i = 0; i < data.length; i++) {
116. HashMap<String, Object> hashMap = new HashMap<String, Object>();
117. hashMap.put("channel_gridview_item", data[i]);
118. gridItem.add(hashMap);
119. }
120. return gridItem;
121. }
122.  
123. @Override
124. public int getChildrenCount(int groupPosition) {
125. // TODO Auto-generated method stub
126. return child[groupPosition].length;
127. }
128.  
129. @Override
130. public Object getGroup(int groupPosition) {
131. // TODO Auto-generated method stub
132. return group[groupPosition];
133. }
134.  
135. @Override
136. public int getGroupCount() {
137. // TODO Auto-generated method stub
138. return group.length;
139. }
140.  
141. @Override
142. public long getGroupId(int groupPosition) {
143. // TODO Auto-generated method stub
144. return groupPosition;
145. }
146.  
147. @Override
148. public View getGroupView(int groupPosition, boolean isExpanded,
149. View convertView, ViewGroup parent) {
150. // TODO Auto-generated method stub
151. if (convertView == null) {
152. mViewChild = new ViewChild();
153. convertView = mInflater.inflate(
154. R.layout.channel_expandablelistview, null);
155. mViewChild.textView = (TextView) convertView
156. .findViewById(R.id.channel_group_name);
157. mViewChild.imageView = (ImageView) convertView
158. .findViewById(R.id.channel_imageview_orientation);
159. convertView.setTag(mViewChild);
160. } else {
161. mViewChild = (ViewChild) convertView.getTag();
162. }
163.  
164. if (isExpanded) {
165. mViewChild.imageView
166. .setImageResource(R.drawable.channel_expandablelistview_top_icon);
167. } else {
168. mViewChild.imageView
169. .setImageResource(R.drawable.channel_expandablelistview_bottom_icon);
170. }
171. mViewChild.textView.setText(getGroup(groupPosition).toString());
172. return convertView;
173. }
174.  
175. @Override
176. public boolean hasStableIds() {
177. // TODO Auto-generated method stub
178. return true;
179. }
180.  
181. @Override
182. public boolean isChildSelectable(int groupPosition, int childPosition) {
183. // TODO Auto-generated method stub
184. return true;
185. }
186.  
187. ViewChild mViewChild;
188.  
189. static class ViewChild {
190. ImageView imageView;
191. TextView textView;
192. GridView gridView;
193. }
194. }

channel_expandablelistview_item.xml：

1. <?xml version="1.0" encoding="utf-8"?>
2. <com.ziaho.ui.CustomGridView xmlns:android="http://schemas.android.com/apk/res/android"
3. android:id="@+id/channel_item_child_gridView"
4. android:layout_width="match_parent"
5. android:layout_height="match_parent"
6. android:background="#f0f0f0"
7. android:numColumns="4" >
8.  
9. </com.ziaho.ui.CustomGridView>

CustomGridView.java:

1. package com.ziaho.ui;
2.  
3. import android.content.Context;
4. import android.util.AttributeSet;
5. import android.widget.GridView;
6.  
7.  
8. public class CustomGridView extends GridView {
9.  
10. public CustomGridView(Context context, AttributeSet attrs) {
11. super(context, attrs);
12. // TODO Auto-generated constructor stub
13. }
14.  
15. @Override
16. protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
17. // TODO Auto-generated method stub
18. int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2,
19. MeasureSpec.AT_MOST);
20. super.onMeasure(widthMeasureSpec, expandSpec);
21. }
22. }

channel_expandablelistview.xml:

1. <?xml version="1.0" encoding="utf-8"?>
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="fill_parent"
4. android:layout_height="wrap_content"
5. android:background="#ffffff"
6. android:orientation="horizontal"
7. android:padding="10dip" >
8.  
9. <View
10. android:id="@+id/channel_line"
11. android:layout_width="3dp"
12. android:layout_height="15dp"
13. android:layout_marginLeft="5dp"
14. android:layout_alignParentLeft="true"
15. android:layout_centerVertical="true"
16. android:background="#79BEF7" />
17.  
18. <TextView
19. android:id="@+id/channel_group_name"
20. android:layout_width="wrap_content"
21. android:layout_height="wrap_content"
22. android:layout_centerVertical="true"
23. android:layout_gravity="center"
24. android:layout_marginLeft="5dp"
25. android:layout_toRightOf="@id/channel_line"
26. android:text="体育"
27. android:textColor="#8e8e8e"
28. android:textSize="18sp" />
29.  
30. <ImageView
31. android:id="@+id/channel_imageview_orientation"
32. android:layout_width="wrap_content"
33. android:layout_height="wrap_content"
34. android:layout_alignParentRight="true"
35. android:layout_centerVertical="true"
36. android:layout_marginRight="5dp"
37. android:src="@drawable/channel_expandablelistview_bottom_icon" />
38.  
39. </RelativeLayout>

channel_gridview_item.xml:

1. <?xml version="1.0" encoding="utf-8"?>
2. <TextView xmlns:android="http://schemas.android.com/apk/res/android"
3. android:id="@+id/channel_gridview_item"
4. android:layout_width="fill_parent"
5. android:layout_height="wrap_content"
6. android:background="#f0f0f0"
7. android:paddingBottom="8dip"
8. android:paddingLeft="6dip"
9. android:paddingRight="6dip"
10. android:paddingTop="8dip"
11. android:text="篮球天地"
12. android:textColor="@color/channel_gridview_item_click"
13. android:textSize="15sp" />

最后我们来看MainActivity：

1. package com.ziaho.ui;
2.  
3. import com.cn.main.R;
4.  
5. import android.app.Activity;
6. import android.os.Bundle;
7. import android.util.Log;
8. import android.view.View;
9. import android.widget.ExpandableListView;
10.  
11.  
12. public class MainActivity extends Activity {
13. ExpandableListView mExpandableListView;
14. ExpandableListViewAdapter mExpandableListViewAdapter;
15. private static final String TAG = "Main";
16.  
17. @Override
18. protected void onCreate(Bundle savedInstanceState) {
19. super.onCreate(savedInstanceState);
20. setContentView(R.layout.activity_main);
21. mExpandableListView = (ExpandableListView) findViewById(R.id.expandableListView);
22. mExpandableListViewAdapter = new ExpandableListViewAdapter(this);
23. mExpandableListView.setAdapter(mExpandableListViewAdapter);
24. mExpandableListView.expandGroup(0);
25. mExpandableListView
26. .setOnGroupClickListener(new ExpandableListView.OnGroupClickListener() {
27. @Override
28. public boolean onGroupClick(ExpandableListView parent,
29. View v, int groupPosition, long id) {
30. return false;
31. }
32. });
33. mExpandableListView
34. .setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
35. @Override
36. public boolean onChildClick(ExpandableListView parent,
37. View v, int groupPosition, int childPosition,
38. long id) {
39. Log.e(TAG, "groupPosition=" + groupPosition
40. + ",childPosition=" + childPosition);
41. return false;
42. }
43. });
44.  
45. }
46.  
47. }

好了！希望对你们有帮助。

如下为下载链接：

http://download.csdn.net/detail/hehaiminginadth/9089793

--------------------- 本文来自 hehaiminginadth 的CSDN 博客 ，全文地址请点击：https://blog.csdn.net/hehaiminginadth/article/details/48294203?utm_source=copy