在许多App上都能看到时光轴的效果，比如携程等等，那么我们今天就利用ExpandableListView来实现一个时光轴效果，先来看看效果图：
效果还是挺简单的，这里我们主要是采用ExpandableListView来实现，关于ExpandableListView的详细使用参见(android开发之ExpandableListView的使用，实现类似QQ好友列表)，我们这里主要介绍这个效果的实现：
先来看看主布局文件：
1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
2. "http://schemas.android.com/tools"
3. "match_parent"
4. "match_parent" >
5.
6. <TextView
7. "@+id/title_p"
8. "wrap_content"
9. "wrap_content"
10. "true"
11. "12dp"
12. "center"
13. "2015年11月"
14. "18sp" />
15.
16. <View
17. "@+id/hor_div"
18. "match_parent"
19. "1dp"
20. "@id/title_p"
21. "#9F79EE" />
22.
23. <View
24. "@+id/ver_div"
25. "1dp"
26. "match_parent"
27. "@id/hor_div"
28. "70dp"
29. "#9F79EE" />
30.
31. <TextView
32. "@+id/title_c"
33. "match_parent"
34. "wrap_content"
35. "@id/hor_div"
36. "60dp"
37. "12dp"
38. "18dp"
39. "12dp"
40. "时光轴"
41. "24sp" />
42.
43. <ExpandableListView
44. "@+id/lv"
45. "match_parent"
46. "match_parent"
47. "@id/title_c"
48. "60dp"
49. "@null"
50. "false"
51. "@null" >
52. </ExpandableListView>
53.
54. </RelativeLayout>
两条分割线用View来做，整体不难，不多说，看看MainActivity
1. public class MainActivity extends Activity {
2.
3. private List<TimeLineBean> list;
4. private ExpandableListView lv;
5.
6. @Override
7. protected void onCreate(Bundle savedInstanceState) {
8. super.onCreate(savedInstanceState);
9. requestWindowFeature(Window.FEATURE_NO_TITLE);
10. setContentView(R.layout.activity_main);
11. initData();
12. initView();
13. }
14.
15. private void initView() {
16. this.findViewById(R.id.lv);
17. new MyAdapter(MainActivity.this, list));
18. for (int i = 0; i < list.size(); i++) {
19. lv.expandGroup(i);
20. }
21. null);
22. new OnGroupClickListener() {
23.
24. @Override
25. public boolean onGroupClick(ExpandableListView parent, View v, int groupPosition, long id) {
26. return true;
27. }
28. });
29. }
30.
31. private void initData() {
32. new ArrayList<TimeLineBean>();
33. new ArrayList<String>();
34. "六王毕，四海一；");
35. "蜀山兀，阿房出。");
36. "覆压三百余里，隔离天日。");
37. new TimeLineBean("11月24日", things));
38. new ArrayList<String>();
39. "骊山北构而西折，");
40. "直走咸阳。");
41. "二川溶溶，流入宫墙。");
42. new TimeLineBean("11月23日", things));
43. new ArrayList<String>();
44. "五步一楼，十步一阁；");
45. "廊腰缦回，");
46. new TimeLineBean("11月22日", things));
47. new ArrayList<String>();
48. "檐牙高啄；");
49. "各抱地势，钩心斗角。");
50. "盘盘焉，囷囷焉，蜂房水涡，");
51. "矗不知乎几千万落！");
52. new TimeLineBean("11月21日", things));
53. new ArrayList<String>();
54. "长桥卧波，未云何龙？");
55. "複道行空，不霁何虹？");
56. "高低冥迷，不知西东。");
57. new TimeLineBean("11月20日", things));
58. new ArrayList<String>();
59. "歌台暖响，");
60. "春光融融；");
61. new TimeLineBean("11月19日", things));
62. new ArrayList<String>();
63. "舞殿冷袖，");
64. "风雨凄凄。");
65. "一日之内，一宫之间，");
66. "而气候不齐。");
67. new TimeLineBean("11月18日", things));
68. }
69. }
在MainActivity中我们先初始化模拟数据，然后初始化View，初始化View的过程中，通过一个for循环让所有的group展开，然后再屏蔽掉group的点击事件，好了，再来看看Adapter：
1. public class MyAdapter extends BaseExpandableListAdapter {
2.
3. private Context context;
4. private List<TimeLineBean> list;
5.
6. public MyAdapter(Context context, List<TimeLineBean> list) {
7. this.context = context;
8. this.list = list;
9. }
10.
11. @Override
12. public Object getChild(int groupPosition, int childPosition) {
13. return list.get(groupPosition).getThings();
14. }
15.
16. @Override
17. public long getChildId(int groupPosition, int childPosition) {
18. return childPosition;
19. }
20.
21. @Override
22. public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView,
23. ViewGroup parent) {
24. null;
25. if (convertView == null) {
26. null);
27. new ChildHolder();
28. holder.tv = (TextView) convertView.findViewById(R.id.ci_thing);
29. convertView.setTag(holder);
30. else {
31. holder = (ChildHolder) convertView.getTag();
32. }
33. holder.tv.setText(list.get(groupPosition).getThings().get(childPosition));
34. return convertView;
35. }
36.
37. @Override
38. public int getChildrenCount(int groupPosition) {
39. return list.get(groupPosition).getThings().size();
40. }
41.
42. @Override
43. public Object getGroup(int groupPosition) {
44. return list.get(groupPosition).getDate();
45. }
46.
47. @Override
48. public int getGroupCount() {
49. return list.size();
50. }
51.
52. @Override
53. public long getGroupId(int groupPosition) {
54. return groupPosition;
55. }
56.
57. @Override
58. public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
59. null;
60. if (convertView == null) {
61. null);
62. new GroupHolder();
63. holder.tv = (TextView) convertView.findViewById(R.id.gi_date);
64. convertView.setTag(holder);
65. else {
66. holder = (GroupHolder) convertView.getTag();
67. }
68. holder.tv.setText(list.get(groupPosition).getDate());
69. return convertView;
70. }
71.
72. @Override
73. public boolean hasStableIds() {
74. return false;
75. }
76.
77. @Override
78. public boolean isChildSelectable(int groupPosition, int childPosition) {
79. return false;
80. }
81.
82. class GroupHolder {
83. TextView tv;
84. }
85.
86. class ChildHolder {
87. TextView tv;
88. }
89.
90. }
这个Adapter也没啥讲的，大家如果有疑问可以参见
android开发之ExpandableListView的使用，实现类似QQ好友列表
，这里有ExpandableListView的详细介绍。最后就是两个item文件：
group_item.xml
1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. "match_parent"
4. "match_parent"
5. "horizontal" >
6.
7. <View
8. "20dp"
9. "20dp"
10. "22dp"
11. "@drawable/circle" />
12.
13. <TextView
14. "@+id/gi_date"
15. "match_parent"
16. "wrap_content"
17. "16dp"
18. "12dp"
19. "18dp"
20. "11月24号"
21. "22sp" />
22.
23. </LinearLayout>
child_item.xml:
1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. "match_parent"
4. "match_parent"
5. "vertical" >
6.
7. <TextView
8. "@+id/ci_thing"
9. "match_parent"
10. "wrap_content"
11. "22dp"
12. "8dp"
13. "11月24号"
14. "#999999"
15. "16sp" />
16.
17. </LinearLayout>
每个group_item的前面有一个红色的实心球，这个球我们用shape来绘制，关于shape的使用参见
android开发之shape详解
：
circle.xml
好了，这个东西貌似没难度，其实就是ExpandableListView的使用。
1. <?xml version="1.0" encoding="utf-8"?>
2. <shape xmlns:android="http://schemas.android.com/apk/res/android"
3. "oval" >
4.
5. "10dp" />
6.
7. <size
8. "10dp"
9. "10dp" />
10.
11. "#FF6A6A" />
12.
13. </shape>
