吸引用户的眼球,是我们至死不渝的追求;
第一时间呈现最有价值的信息,简明大方,告诉客户,你的选择是多么的明智,这正是你寻觅已久的东西。
分组的应用场合还是很多的,有数据集合的地方往往要分组显示;
分组的形式也很多,最常见的就是镶嵌在列表中,网上说的很多ExpandListView的也是一种。
Android自带的通讯录中的联系人是按照拼音首字母(A,B,C,D......)分组分类的,效果如下:
我们今天也是要实现这样类似的一个效果。
1.样本数据:
为了突出重点,直击要点,这里提供一个整理好的数据样本:
02 |
private List<String> list = new ArrayList<String>(); |
04 |
private List<String> listTag = new ArrayList<String>(); |
06 |
public void setData(){ |
19 |
for ( int i= 0 ;i< 30 ;i++){ |
2.Activity布局准备:
放置一个listView来呈现数据。
group_list_activity.xml:
01 |
<? xml version = "1.0" encoding = "utf-8" ?> |
03 |
android:orientation = "vertical" |
04 |
android:layout_width = "fill_parent" |
05 |
android:layout_height = "fill_parent" |
08 |
< ListView android:id = "@+id/group_list" |
09 |
android:layout_width = "fill_parent" |
10 |
android:layout_height = "fill_parent" |
11 |
android:cacheColorHint = "#00000000" /> |
3.自定义Adapter(本文继承ArrayAdapter):
这个是本文的重点和核心。
Adapter接口为数据和界面搭建了一个访问的桥梁,最重要的就是getView()方法,用这个方法我们可以实现一定程度的界面自定义。
ArrayAdapter间接实现了Adapter接口,这里我们简单起见,数据源只是提供单一的String数组。
01 |
private static class GroupListAdapter extends ArrayAdapter<String>{ |
04 |
private List<String> listTag = null ; |
05 |
public GroupListAdapter(Context context, List<String> objects, List<String> tags) { |
06 |
super (context, 0 , objects); |
11 |
public View getView( int position, View convertView, ViewGroup parent) { |
我们来看看getView方法:
4 |
View getView( int position, View convertView, ViewGroup parent); |
现在我们就是要重写getView方法,来实现列表中嵌入分组标签。
分组标签也是列表数据项之一,也是被一行一行的画上去的,但是它和其他数据项UI是不一致的,所以我们需要准备2套数据项布局模板:
数据项模板group_list_item.xml:
01 |
<? xml version = "1.0" encoding = "utf-8" ?> |
03 |
android:orientation = "horizontal" |
04 |
android:layout_width = "fill_parent" |
05 |
android:layout_height = "wrap_content" |
06 |
android:padding = "5dip" > |
10 |
android:src = "@drawable/list_icon" |
11 |
android:layout_width = "wrap_content" |
12 |
android:layout_height = "wrap_content" /> |
14 |
android:id = "@+id/group_list_item_text" |
15 |
android:layout_width = "wrap_content" |
16 |
android:layout_height = "fill_parent" |
17 |
android:paddingLeft = "5dip" |
18 |
android:gravity = "center_vertical" /> |
标签项模板group_list_item_tag.xml:
02 |
<? xml version = "1.0" encoding = "utf-8" ?> |
04 |
android:layout_width = "fill_parent" |
05 |
android:layout_height = "wrap_content" |
06 |
android:background = "#555555" |
07 |
android:paddingLeft = "10dip" > |
09 |
android:id = "@+id/group_list_item_text" |
10 |
android:layout_width = "wrap_content" |
11 |
android:layout_height = "20dip" |
12 |
android:textColor = "#ffffff" |
13 |
android:gravity = "center_vertical" /> |
好,我们现在把这两个模板应用到getView方法中去:
02 |
public View getView( int position, View convertView, ViewGroup parent) { |
03 |
View view = convertView; |
05 |
if (listTag.contains(getItem(position))){ |
07 |
view = LayoutInflater.from(getContext()).inflate(R.layout.group_list_item_tag, null ); |
10 |
view = LayoutInflater.from(getContext()).inflate(R.layout.group_list_item, null ); |
13 |
TextView textView = (TextView) view.findViewById(R.id.group_list_item_text); |
14 |
textView.setText(getItem(position)); |
4.禁止标签项的响应事件:
在ArrayAdapter的父类BaseAdapter中提供了isEnable的()方法,我们看看这个方法:
4 |
public boolean isEnabled ( int position) |
这个方法刚好用来禁用标签项的响应事件。具体实现如下:
2 |
public boolean isEnabled( int position) { |
3 |
if (listTag.contains(getItem(position))){ |
6 |
return super .isEnabled(position); |
现在标签项不会再有任何触控效果了,犹如一块死木板。
5.完整代码:
整个Activity和Adapter代码如下:
01 |
public class GroupListActivity extends Activity { |
03 |
private GroupListAdapter adapter = null ; |
04 |
private ListView listView = null ; |
05 |
private List<String> list = new ArrayList<String>(); |
06 |
private List<String> listTag = new ArrayList<String>(); |
09 |
protected void onCreate(Bundle savedInstanceState) { |
10 |
super .onCreate(savedInstanceState); |
11 |
setContentView(R.layout.group_list_activity); |
14 |
adapter = new GroupListAdapter( this , list, listTag); |
15 |
listView = (ListView)findViewById(R.id.group_list); |
16 |
listView.setAdapter(adapter); |
19 |
public void setData(){ |
32 |
for ( int i= 0 ;i< 30 ;i++){ |
36 |
private static class GroupListAdapter extends ArrayAdapter<String>{ |
38 |
private List<String> listTag = null ; |
39 |
public GroupListAdapter(Context context, List<String> objects, List<String> tags) { |
40 |
super (context, 0 , objects); |
45 |
public boolean isEnabled( int position) { |
46 |
if (listTag.contains(getItem(position))){ |
49 |
return super .isEnabled(position); |
52 |
public View getView( int position, View convertView, ViewGroup parent) { |
53 |
View view = convertView; |
54 |
if (listTag.contains(getItem(position))){ |
55 |
view = LayoutInflater.from(getContext()).inflate(R.layout.group_list_item_tag, null ); |
57 |
view = LayoutInflater.from(getContext()).inflate(R.layout.group_list_item, null ); |
59 |
TextView textView = (TextView) view.findViewById(R.id.group_list_item_text); |
60 |
textView.setText(getItem(position)); |
6.最终效果:
![](https://pic002.cnblogs.com/images/2011/31770/2011060717220256.png)