ListView分类显示

第一个完整示例：

1. 引言

 

    在Android开发过程中往往有这样的需求，将ListView中的内容按年，月，日进行分类显示，要实现这样的效果我们可能有很多种方法，

 

    如：多ListView拼合，自定义ListView组件等，下面介绍一种比较简单，而且实现结构清晰的实现方式，效果图及实现如下。

 

2. 效果图

    

3. 功能实现

 

    (1) 主布局(main.xml)实现：

view plain

1. <?xml version="1.0" encoding="utf-8"?>  
2. <LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"  
3.     android:orientation = "vertical"  
4.     android:layout_width = "fill_parent"  
5.     android:layout_height = "fill_parent"  
6.     >  
7.     <ListView  
8.         android:id = "@+id/categoryList"  
9.         android:layout_width = "fill_parent"   
10.         android:layout_height = "fill_parent"  
11.         />  
12. </LinearLayout>   

 

    (2) 主Activity实现：

view plain

0. package com.flora;  
1. import android.app.Activity;  
2. import android.os.Bundle;  
3. import android.view.View;  
4. import android.view.ViewGroup;  
5. import android.widget.ArrayAdapter;  
6. import android.widget.ListView;  
7. import android.widget.TextView;  
8. public class ListViewCategoryActivity extends Activity {  
9.       
10.     private String [] mContacts = {"马英才", "张三", "李四"};  
11.     private String [] mMusic = {"素顔", "庐州月", "半城烟沙"};  
12.     private String [] mEBook = {"拆掉思维里的墙", "淡定力", "人脉决定命脉"};  
13.       
14.     @Override  
15.     public void onCreate(Bundle savedInstanceState) {  
16.         super.onCreate(savedInstanceState);  
17.         setContentView(R.layout.main);  
18.           
19.         mCategoryAdapter.addCategory("人名", new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, mContacts));  
20.           
21.         mCategoryAdapter.addCategory("音乐",new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, mMusic));  
22.           
23.         mCategoryAdapter.addCategory("书籍",new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, mEBook));  
24.           
25.         ListView categoryList = (ListView) findViewById(R.id.categoryList);  
26.           
27.         categoryList.setAdapter(mCategoryAdapter);  
28.     }  
29.       
30.     private CategoryAdapter mCategoryAdapter = new CategoryAdapter() {  
31.         @Override  
32.         protected View getTitleView(String title, int index, View convertView, ViewGroup parent) {  
33.             TextView titleView;  
34.               
35.             if (convertView == null) {  
36.                 titleView = (TextView)getLayoutInflater().inflate(R.layout.title, null);  
37.             } else {  
38.                 titleView = (TextView)convertView;  
39.             }  
40.               
41.             titleView.setText(title);  
42.               
43.             return titleView;  
44.         }  
45.     };  
46.       
47. }  

 

    (3) Adapter实现：

view plain

0. package com.flora;  
1. import java.util.ArrayList;  
2. import java.util.List;  
3. import android.view.View;  
4. import android.view.ViewGroup;  
5. import android.widget.Adapter;  
6. import android.widget.BaseAdapter;  
7. public abstract class CategoryAdapter extends BaseAdapter {  
8.     private List<Category> categories = new ArrayList<Category>();  
9.       
10.     public void addCategory(String title, Adapter adapter) {  
11.         categories.add(new Category(title, adapter));  
12.     }  
13.       
14.     @Override  
15.     public int getCount() {  
16.         int total = 0;  
17.           
18.         for (Category category : categories) {  
19.             total += category.getAdapter().getCount() + 1;  
20.         }  
21.           
22.         return total;  
23.     }  
24.     @Override  
25.     public Object getItem(int position) {  
26.         for (Category category : categories) {  
27.             if (position == 0) {  
28.                 return category;  
29.             }  
30.               
31.             int size = category.getAdapter().getCount() + 1;  
32.             if (position < size) {  
33.                 return category.getAdapter().getItem(position-1);  
34.             }  
35.             position -= size;  
36.         }  
37.           
38.         return null;  
39.     }  
40.     @Override  
41.     public long getItemId(int position) {  
42.         return position;  
43.     }  
44.       
45.     public int getViewTypeCount() {  
46.         int total = 1;  
47.           
48.         for (Category category : categories) {  
49.             total += category.getAdapter().getViewTypeCount();  
50.         }  
51.           
52.         return total;  
53.     }  
54.     public int getItemViewType(int position) {  
55.         int typeOffset = 1;  
56.           
57.         for (Category category : categories) {  
58.             if (position == 0) {  
59.                 return 0;  
60.             }  
61.               
62.             int size = category.getAdapter().getCount() + 1;  
63.             if (position < size) {  
64.                 return typeOffset + category.getAdapter().getItemViewType(position - 1);  
65.             }  
66.             position -= size;  
67.               
68.             typeOffset += category.getAdapter().getViewTypeCount();  
69.         }  
70.           
71.         return -1;  
72.     }  
73.     @Override  
74.     public View getView(int position, View convertView, ViewGroup parent) {  
75.         int categoryIndex = 0;  
76.           
77.         for (Category category : categories) {  
78.             if (position == 0) {  
79.                 return getTitleView(category.getTitle(), categoryIndex,convertView, parent);  
80.             }  
81.             int size = category.getAdapter().getCount()+1;  
82.             if (position < size) {  
83.                 return category.getAdapter().getView(position - 1, convertView, parent);  
84.             }  
85.             position -= size;  
86.               
87.             categoryIndex++;  
88.         }  
89.           
90.         return null;  
91.     }  
92.       
93.     protected abstract View getTitleView(String caption,int index,View convertView,ViewGroup parent);  
94.       
95. }   

 

    (4) 分类ValueBean实现：

view plain

0. package com.flora;  
1. import android.widget.Adapter;  
2. public class Category {  
3.     private String mTitle;  
4.       
5.     private Adapter mAdapter;  
6.     public Category(String title, Adapter adapter) {  
7.         mTitle = title;  
8.         mAdapter = adapter;  
9.     }  
10.       
11.     public void setTile(String title) {  
12.         mTitle = title;  
13.     }  
14.       
15.     public String getTitle() {  
16.         return mTitle;  
17.     }  
18.       
19.     public void setAdapter(Adapter adapter) {  
20.         mAdapter = adapter;  
21.     }  
22.       
23.     public Adapter getAdapter() {  
24.         return mAdapter;  
25.     }  
26.       
27. }   

 

    (5) 分类Title实现：

view plain

0. <?xml version="1.0" encoding="utf-8"?>  
1. <TextView  
2.     xmlns:android = "http://schemas.android.com/apk/res/android"  
3.     android:layout_width = "match_parent"  
4.     android:layout_height = "match_parent"  
5.     android:minHeight = "30dip"  
6.     android:gravity = "center_vertical"  
7.     android:paddingLeft = "10dip"  
8.     android:background = "@color/title_background_color"  
9.     />   

第二个完整示例

今天和大家分享关于“listview的分类显示”。现在有比较多的应用都有这个效果，比如在android的ICS风格的“设置”选项里面就有这个效果，先看看效果：

实现这个效果比较简单，在填充listview的adapter的时候，我们都会通过继承BaseAdapter来写我们自己的adapter，listview里面的item是通过getView(int position, View convertView, ViewGroup parent) 实现。其实这边有实现预加载，你只要在getview方法里面打印出log信息就会发现，listview刚开始显示的时候getview不会返回所有的item，只是返回了前面几个，当你往下拖拽的时候getview方法会加载剩下的item。这样做的好处大家都知道，如果不这样做估计早就出现了内存泄漏了。

好吧，我们回到主题，实现分类显示只需要你把你显示的数据打包好。Listview里面的item都是通过getView来生成，所以可以这样，如果在getview里面生成item的时候，你返回两次convertView不就可以了吗？也就是说平时我们都是通过convertView来返回item，但是现在多了一个操作就是你根据自身打包的数据，如果当前返回的item是和之前显示的item不属于同一类就返回两次convertView。这样理解这个就好实现多了吧。注意的是像上面图上“Label”、“类别1”、“类别2”是不可点击的，只要实现BaseAdapter里面的isEnabled(int position)的方法就可以。

下面介绍的实现方式是运用了工厂模式实现，下面是草图

新建了一个ListItems接口：

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

/***

 * <span class="referer">@author</span>  huangsm

 * @date 2012-8-29

 * <span class="referer">@email</span>  [e-mail]<script cf-hash="f9e31" type="text/javascript">

/* <![CDATA[ */!function(){try{var t="currentScript"in document?document.currentScript:function(){for(var t=document.getElementsByTagName("script"),e=t.length;e--;)if(t[e].getAttribute("cf-hash"))returnt[e]}();if(t&&t.previousSibling){var e,r,n,i,c=t.previousSibling,a=c.getAttribute("data-cfemail");if(a){for(e="",r=parseInt(a.substr(0,2),16),n=2;a.length-n;n+=2)i=parseInt(a.substr(n,2),16)^r,e+=String.fromCharCode(i);e=document.createTextNode(e),c.parentNode.replaceChild(e,c)}}}catch(u){}}();/* ]]> */</script>

 * @desc接口

 */

publicinterface ListItems {

 

    publicint getLayout();

     

    publicboolean isClickable();

     

    publicView getView(Context context, View convertView, LayoutInflater inflater);

     

}

其中LabelItem和ContentItem分别是显示的“类别”和“内容”，他们分别实现ListItems接口。LabelItem实现： 

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

/***

 * <span class="referer">@author</span>  huangsm

 * @date 2012-8-29

 * <span class="referer">@email</span>  [e-mail]<script cf-hash="f9e31" type="text/javascript">

/* <![CDATA[ */!function(){try{var t="currentScript"in document?document.currentScript:function(){for(var t=document.getElementsByTagName("script"),e=t.length;e--;)if(t[e].getAttribute("cf-hash"))returnt[e]}();if(t&&t.previousSibling){var e,r,n,i,c=t.previousSibling,a=c.getAttribute("data-cfemail");if(a){for(e="",r=parseInt(a.substr(0,2),16),n=2;a.length-n;n+=2)i=parseInt(a.substr(n,2),16)^r,e+=String.fromCharCode(i);e=document.createTextNode(e),c.parentNode.replaceChild(e,c)}}}catch(u){}}();/* ]]> */</script>

 * @desc标签

 */

publicclass LabelItem implementsListItems {

 

    privateString mLabel;

    publicLabelItem(String label){

        mLabel = label;

    }

     

    @Override

    publicint getLayout() {

        returnR.layout.label_layout;

    }

 

    @Override

    publicboolean isClickable() {

        returnfalse;

    }

 

    @Override

    publicView getView(Context context, View convertView, LayoutInflater inflater) {

        convertView = inflater.inflate(getLayout(), null);

        TextView title = (TextView) convertView;

        title.setText(mLabel);

        returnconvertView;

    }

 

}

ContentItem的实现： 

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

/***

 * <span class="referer">@author</span>  huangsm

 * @date 2012-8-29

 * <span class="referer">@email</span>  [e-mail]<script cf-hash="f9e31" type="text/javascript">

/* <![CDATA[ */!function(){try{var t="currentScript"in document?document.currentScript:function(){for(var t=document.getElementsByTagName("script"),e=t.length;e--;)if(t[e].getAttribute("cf-hash"))returnt[e]}();if(t&&t.previousSibling){var e,r,n,i,c=t.previousSibling,a=c.getAttribute("data-cfemail");if(a){for(e="",r=parseInt(a.substr(0,2),16),n=2;a.length-n;n+=2)i=parseInt(a.substr(n,2),16)^r,e+=String.fromCharCode(i);e=document.createTextNode(e),c.parentNode.replaceChild(e,c)}}}catch(u){}}();/* ]]> */</script>

 * @desc内容

 */

publicclass ContentItem implementsListItems {

 

    privateItem mItem;

    publicContentItem(Item item){

        mItem = item;

    }

     

    @Override

    publicint getLayout() {

        returnR.layout.content_layout;

    }

 

    @Override

    publicboolean isClickable() {

        returntrue;

    }

 

    @Override

    publicView getView(Context context, View convertView, LayoutInflater inflater) {

        convertView = inflater.inflate(getLayout(), null);

        ImageView iv = (ImageView) convertView.findViewById(R.id.content_image);

        iv.setImageResource(mItem.getResid());

        TextView tv = (TextView) convertView.findViewById(R.id.content_text);

        tv.setText(mItem.getTitle());

        returnconvertView;

    }

}

在activity中实现就相对来说比较麻烦一些。定义一个以ListItems为泛型的list集合mListItems，作为填充adapter的数据源，然后在adapter里面处理就很简单：

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

classPartAdapter extendsBaseAdapter {

 

        @Override

        publicint getCount() {

            returnmListItems.size();

        }

 

        @Override

        publicObject getItem(intposition) {

            returnmListItems.get(position);

        }

 

        @Override

        publiclong getItemId(intposition) {

            returnposition;

        }

         

        @Override

        publicboolean isEnabled(intposition) {

            returnmListItems.get(position).isClickable();

        }

 

        @Override

        publicView getView(intposition, View convertView, ViewGroup parent) {

            returnmListItems.get(position).getView(mContext, convertView, mInflater);

        }

    }

接下来是初始化数据，需要注意的是LabelItem的初始化，不过这个动作可以在你打包数据的时候处理好，这样在activity里面就不会那么麻烦了 

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

@Override

    protectedvoid onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.part_listview);

        mListView = (ListView) findViewById(R.id.part_list);

        mContext = this;

        mInflater = LayoutInflater.from(mContext);

        mListItems =  newArrayList

   <listitems>     ();

         

        //初始化数据

        LabelItem label1 = newLabelItem("Label");

        mListItems.add(label1);

         

        Item item1 = newItem();

        item1.setResid(R.drawable.ic_launcher);

        item1.setTitle(getString(R.string.app_name));

        ContentItem content1 = newContentItem(item1);

        mListItems.add(content1);

         

        for(inti = 0; i < 3; i++) {

            LabelItem label = newLabelItem("类别"+ (i + 1));

            mListItems.add(label);

             

            for(intj = 0; j < 3; j++) {

                Item item = newItem();

                item.setResid(R.drawable.ic_launcher_biz);

                item.setTitle("Content"+ (i + 1));

                ContentItem content = newContentItem(item);

                mListItems.add(content);

            }

        }

         

        //设置adapter

        PartAdapter adapter = newPartAdapter();

        mListView.setAdapter(adapter);

    }

   </listitems>

第三个完整示例：

我们有时候会遇到这么一个情况。就是我在一个ListView里面需要显示的东西其实是有种类之分的。比如我要分冬天，夏天，秋天，春天，然后在这每个季节下面再去加载各自的条目数据。还有，比如我们的通讯录，我们需要按A，B，C这样的字母顺序分类然后显示。这个怎么实现呢？

下面我们不用ExpandableListView，而是只用ListView来实现这一显示效果。

MainActivity.java

package com.xzq.listviewadapter;import android.app.Activity;import android.os.Bundle;import android.view.Window;import android.widget.ListView;public class MainActivity extends Activity {private String[] string = { "A", "B", "C", "D", "E", "F", "G", "H", "I","J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V","W", "X", "Y", "Z" };/** Called when the activity is first created. */@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.main);ListView listview = (ListView) findViewById(R.id.listview);MyCustomAdapter adapter = new MyCustomAdapter(this);int size = string.length;for (int i = 0; i < size; i++) {adapter.addSeparatorItem(string[i]);for (int k = 0; k < 5; k++) {adapter.addItem("item " + k);}}listview.setAdapter(adapter);}}

MyCustomAdapter.java

package com.xzq.listviewadapter;import java.util.ArrayList;import java.util.TreeSet;import android.content.Context;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.TextView;public class MyCustomAdapter extends BaseAdapter {private static final int TYPE_ITEM = 0;private static final int TYPE_SEPARATOR = 1;private static final int TYPE_MAX_COUNT = TYPE_SEPARATOR + 1;private ArrayList<String> data = new ArrayList<String>();private LayoutInflater inflater;private TreeSet<Integer> set = new TreeSet<Integer>();public MyCustomAdapter(Context context) {inflater = LayoutInflater.from(context);}public void addItem(String item) {data.add(item);}public void addSeparatorItem(String item) {data.add(item);set.add(data.size() - 1);}public int getItemViewType(int position) {return set.contains(position) ? TYPE_SEPARATOR : TYPE_ITEM;}@Overridepublic int getViewTypeCount() {return TYPE_MAX_COUNT;}@Overridepublic int getCount() {return data.size();}@Overridepublic Object getItem(int position) {return data.get(position);}@Overridepublic long getItemId(int position) {return position;}@Overridepublic View getView(int position, View convertView, ViewGroup parent) {ViewHolder holder = null;int type = getItemViewType(position);if (convertView == null) {holder = new ViewHolder();switch (type) {case TYPE_ITEM:convertView = inflater.inflate(R.layout.item1, null);holder.textView = (TextView) convertView.findViewById(R.id.item1);break;case TYPE_SEPARATOR:convertView = inflater.inflate(R.layout.item2, null);holder.textView = (TextView) convertView.findViewById(R.id.item2);break;}convertView.setTag(holder);} else {holder = (ViewHolder) convertView.getTag();}holder.textView.setText(data.get(position));return convertView;}public static class ViewHolder {public TextView textView;}}

main.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:background="#ffffff"android:orientation="vertical" ><ListViewandroid:id="@+id/listview"android:layout_width="fill_parent"android:layout_height="wrap_content"android:text="@string/hello" /></LinearLayout>

item1.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:background="#ffffff"android:orientation="vertical" ><TextViewandroid:id="@+id/item1"android:layout_width="fill_parent"android:layout_height="30dip"android:gravity="center_vertical" /></LinearLayout>

item2.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical" ><TextViewandroid:id="@+id/item2"android:layout_width="fill_parent"android:layout_height="30dip"android:background="#3c4857"android:gravity="center_vertical" /></LinearLayout>