Android 标签控件

转载：http://blog.csdn.net/wangjinyu501/article/details/38089061

在有的应用中可能需要设置一些标签来方便用去去查询某些信息，比如手机助手或者购物软件之类都会有一些标签。对于软件开发初期来说，直接使用TextView、Button实现是最为简单的一种方式。但是这种方法也有其局限性，比如不能控制换行、耦合性低等缺点。所以除了解决这些问题之外，最好能够封装一个类库出来，方便以后使用。

  首先新建一个Tag类，

[html]  view plain copy

1. import java.io.Serializable;  
2.   
3. public class Tag implements Serializable {  
4.        
5.       /**  
6.       *  
7.       */  
8.       private static final long serialVersionUID = 2684657309332033242L;  
9.        
10.       private int backgroundResId ;  
11.       private int id ;  
12.       private boolean isChecked ;  
13.       private int leftDrawableResId ;  
14.       private int rightDrawableResId ;  
15.       private String title;  
16.   
17.       public Tag() {  
18.             
19.      }  
20.   
21.       public Tag( int paramInt, String paramString) {  
22.            this .id = paramInt;  
23.            this .title = paramString;  
24.      }  
25.   
26.       public int getBackgroundResId() {  
27.            return this .backgroundResId ;  
28.      }  
29.   
30.       public int getId() {  
31.            return this .id ;  
32.      }  
33.   
34.       public int getLeftDrawableResId() {  
35.            return this .leftDrawableResId ;  
36.      }  
37.   
38.       public int getRightDrawableResId() {  
39.            return this .rightDrawableResId ;  
40.      }  
41.   
42.       public String getTitle() {  
43.            return this .title ;  
44.      }  
45.   
46.       public boolean isChecked() {  
47.            return this .isChecked ;  
48.      }  
49.   
50.       public void setBackgroundResId( int paramInt) {  
51.            this .backgroundResId = paramInt;  
52.      }  
53.   
54.       public void setChecked( boolean paramBoolean) {  
55.            this .isChecked = paramBoolean;  
56.      }  
57.   
58.       public void setId(int paramInt) {  
59.            this .id = paramInt;  
60.      }  
61.   
62.       public void setLeftDrawableResId( int paramInt) {  
63.            this .leftDrawableResId = paramInt;  
64.      }  
65.   
66.       public void setRightDrawableResId( int paramInt) {  
67.            this .rightDrawableResId = paramInt;  
68.      }  
69.   
70.       public void setTitle(String paramString) {  
71.            this .title = paramString;  
72.      }  
73. }  

  这个类封装了标签视图的背景图片资源、id、是否check等。

  然后新建TagView类，继承自ToggleButton，

[html]  view plain copy

1. import com.niceapp.lib.tagview.R;  
2.   
3. import android.content.Context;  
4. import android.util.AttributeSet;  
5. import android.widget.ToggleButton;  
6.   
7. public class TagView extends ToggleButton {  
8.        
9.       private boolean mCheckEnable = true;  
10.   
11.       public TagView(Context paramContext) {  
12.            super (paramContext);  
13.           init();  
14.      }  
15.   
16.       public TagView(Context paramContext, AttributeSet paramAttributeSet) {  
17.            super (paramContext, paramAttributeSet);  
18.           init();  
19.      }  
20.   
21.       public TagView(Context paramContext, AttributeSet paramAttributeSet,  
22.                int paramInt) {  
23.            super (paramContext, paramAttributeSet, 0);  
24.           init();  
25.      }  
26.   
27.       private void init() {  
28.           setTextOn( null );  
29.           setTextOff( null );  
30.           setText( "" );  
31.           setBackgroundResource(R.drawable. tag_bg );  
32.      }  
33.   
34.       public void setCheckEnable( boolean paramBoolean) {  
35.            this .mCheckEnable = paramBoolean;  
36.            if (!this .mCheckEnable ) {  
37.                super .setChecked( false);  
38.           }  
39.      }  
40.   
41.       public void setChecked( boolean paramBoolean) {  
42.            if (this .mCheckEnable ) {  
43.                super .setChecked(paramBoolean);  
44.           }  
45.      }  
46. }  

  这个TagView就是标签视图，标签信息由他来显示。相应的xml文件如下，tag.xml:

[html]  view plain copy

1. <? xml version= "1.0" encoding = "utf-8"?>  
2. < com.niceapp.lib.tagview.widget.TagView xmlns:android ="http://schemas.android.com/apk/res/android"  
3.     android:layout_width= "wrap_content"  
4.     android:layout_height= "wrap_content"  
5.     android:drawablePadding= "5.0dip"  
6.     android:minHeight= "0.0dip"  
7.     android:paddingBottom= "4.5dip"  
8.     android:paddingLeft= "20.0dip"  
9.     android:paddingRight= "20.0dip"  
10.     android:paddingTop= "4.5dip"  
11.     android:textColor= "#ff000000"  
12.     android:textSize= "16.0sp" />  

显示如下：

 

 在github上有一个 android-flowlayout 控件，它是根据子视图的大小来动态包裹视图，如图：

 

  因此，控制换行就可以利用这个控件去实现，无需重复发明轮子。android-flowlayout功能实现的类是FlowLayout，所以通过继承这个类来完成标签控件的实现。

[html]  view plain copy

1. import java.util.ArrayList;  
2. import java.util.List;  
3. import com.niceapp.lib.tagview.R;  
4. import android.content.Context;  
5. import android.util.AttributeSet;  
6. import android.util.TypedValue;  
7. import android.view.View;  
8. import android.view.View.OnClickListener;  
9. import android.widget.CompoundButton;  
10.   
11. /**  
12. * @author kince  
13. *   
14. */  
15. public class TagListView extends FlowLayout implements OnClickListener {  
16.   
17.      private boolean mIsDeleteMode;  
18.      private OnTagCheckedChangedListener mOnTagCheckedChangedListener;  
19.      private OnTagClickListener mOnTagClickListener;  
20.      private int mTagViewBackgroundResId;  
21.      private int mTagViewTextColorResId;  
22.      private final List<Tag> mTags = new ArrayList<Tag>();  
23.   
24.      /**  
25.      * @param context  
26.      */  
27.      public TagListView(Context context) {  
28.           super(context);  
29.           // TODO Auto-generated constructor stub  
30.           init();  
31.      }  
32.   
33.      /**  
34.      * @param context  
35.      * @param attributeSet  
36.      */  
37.      public TagListView(Context context, AttributeSet attributeSet) {  
38.           super(context, attributeSet);  
39.           // TODO Auto-generated constructor stub  
40.           init();  
41.      }  
42.   
43.      /**  
44.      * @param context  
45.      * @param attributeSet  
46.      * @param defStyle  
47.      */  
48.      public TagListView(Context context, AttributeSet attributeSet, int defStyle) {  
49.           super(context, attributeSet, defStyle);  
50.           // TODO Auto-generated constructor stub  
51.           init();  
52.      }  
53.   
54.      @Override  
55.      public void onClick(View v) {  
56.           if ((v instanceof TagView)) {  
57.                Tag localTag = (Tag) v.getTag();  
58.                if (this.mOnTagClickListener != null) {  
59.                     this.mOnTagClickListener.onTagClick((TagView) v, localTag);  
60.                }  
61.           }  
62.      }  
63.   
64.      private void init() {  
65.   
66.      }  
67.   
68.      private void inflateTagView(final Tag t, boolean b) {  
69.   
70.           TagView localTagView = (TagView) View.inflate(getContext(),  
71.                     R.layout.tag, null);  
72.           localTagView.setText(t.getTitle());  
73.           localTagView.setTag(t);  
74.   
75.           if (mTagViewTextColorResId <= 0) {  
76.                int c = getResources().getColor(R.color.blue);  
77.                localTagView.setTextColor(c);  
78.   
79.           }  
80.   
81.           if (mTagViewBackgroundResId <= 0) {  
82.                mTagViewBackgroundResId = R.drawable.tag_bg;  
83.                localTagView.setBackgroundResource(mTagViewBackgroundResId);  
84.           }  
85.   
86.           localTagView.setChecked(t.isChecked());  
87.           localTagView.setCheckEnable(b);  
88.           if (mIsDeleteMode) {  
89.                int k = (int) TypedValue.applyDimension(1, 5.0F, getContext()  
90.                          .getResources().getDisplayMetrics());  
91.                localTagView.setPadding(localTagView.getPaddingLeft(),  
92.                          localTagView.getPaddingTop(), k,  
93.                          localTagView.getPaddingBottom());  
94.                localTagView.setCompoundDrawablesWithIntrinsicBounds(0, 0,  
95.                          R.drawable.forum_tag_close, 0);  
96.           }  
97.           if (t.getBackgroundResId() > 0) {  
98.                localTagView.setBackgroundResource(t.getBackgroundResId());  
99.           }  
100.           if ((t.getLeftDrawableResId() > 0) || (t.getRightDrawableResId() > 0)) {  
101.                localTagView.setCompoundDrawablesWithIntrinsicBounds(  
102.                          t.getLeftDrawableResId(), 0, t.getRightDrawableResId(), 0);  
103.           }  
104.           localTagView.setOnClickListener(this);  
105.           localTagView  
106.                     .setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {  
107.                          public void onCheckedChanged(  
108.                                    CompoundButton paramAnonymousCompoundButton,  
109.                                    boolean paramAnonymousBoolean) {  
110.                               t.setChecked(paramAnonymousBoolean);  
111.                               if (TagListView.this.mOnTagCheckedChangedListener != null) {  
112.                                    TagListView.this.mOnTagCheckedChangedListener  
113.                                              .onTagCheckedChanged(  
114.                                                        (TagView) paramAnonymousCompoundButton,  
115.                                                        t);  
116.                               }  
117.                          }  
118.                     });  
119.           addView(localTagView);  
120.      }  
121.   
122.      public void addTag(int i, String s) {  
123.           addTag(i, s, false);  
124.      }  
125.   
126.      public void addTag(int i, String s, boolean b) {  
127.           addTag(new Tag(i, s), b);  
128.      }  
129.   
130.      public void addTag(Tag tag) {  
131.           addTag(tag, false);  
132.      }  
133.   
134.      public void addTag(Tag tag, boolean b) {  
135.           mTags.add(tag);  
136.           inflateTagView(tag, b);  
137.      }  
138.   
139.      public void addTags(List<Tag> lists) {  
140.           addTags(lists, false);  
141.      }  
142.   
143.      public void addTags(List<Tag> lists, boolean b) {  
144.           for (int i = 0; i < lists.size(); i++) {  
145.                addTag((Tag) lists.get(i), b);  
146.           }  
147.      }  
148.   
149.      public List<Tag> getTags() {  
150.           return mTags;  
151.      }  
152.   
153.      public View getViewByTag(Tag tag) {  
154.           return findViewWithTag(tag);  
155.      }  
156.   
157.      public void removeTag(Tag tag) {  
158.           mTags.remove(tag);  
159.           removeView(getViewByTag(tag));  
160.      }  
161.   
162.      public void setDeleteMode(boolean b) {  
163.           mIsDeleteMode = b;  
164.      }  
165.   
166.      public void setOnTagCheckedChangedListener(  
167.                OnTagCheckedChangedListener onTagCheckedChangedListener) {  
168.           mOnTagCheckedChangedListener = onTagCheckedChangedListener;  
169.      }  
170.   
171.      public void setOnTagClickListener(OnTagClickListener onTagClickListener) {  
172.           mOnTagClickListener = onTagClickListener;  
173.      }  
174.   
175.      public void setTagViewBackgroundRes(int res) {  
176.           mTagViewBackgroundResId = res;  
177.      }  
178.   
179.      public void setTagViewTextColorRes(int res) {  
180.           mTagViewTextColorResId = res;  
181.      }  
182.   
183.      public void setTags(List<? extends Tag> lists) {  
184.           setTags(lists, false);  
185.      }  
186.   
187.      public void setTags(List<? extends Tag> lists, boolean b) {  
188.           removeAllViews();  
189.           mTags.clear();  
190.           for (int i = 0; i < lists.size(); i++) {  
191.                addTag((Tag) lists.get(i), b);  
192.           }  
193.      }  
194.   
195.      public static abstract interface OnTagCheckedChangedListener {  
196.           public abstract void onTagCheckedChanged(TagView tagView, Tag tag);  
197.      }  
198.   
199.      public static abstract interface OnTagClickListener {  
200.           public abstract void onTagClick(TagView tagView, Tag tag);  
201.      }  
202.   
203. }  

  这个类最要的部分还是inflateTagView这个方法，它将TagView解析出来出来，然后显示出TagListView所要显示的标签。

  最后Activity的代码如下：

[html]  view plain copy

1. import java.util.ArrayList;  
2. import java.util.List;  
3. import com.niceapp.lib.tagview.widget.Tag;  
4. import com.niceapp.lib.tagview.widget.TagListView;  
5. import android.app.Activity;  
6. import android.os.Bundle;  
7.   
8. public class MainActivity extends Activity {  
9.   
10.      private TagListView mTagListView;  
11.      private final List<Tag> mTags = new ArrayList<Tag>();  
12.      private final String[] titles = { "安全必备", "音乐", "父母学", "上班族必备",   
13.                "360手机卫士", "QQ","输入法", "微信", "最美应用", "AndevUI", "蘑菇街" };  
14.   
15.      @Override  
16.      protected void onCreate(Bundle savedInstanceState) {  
17.           super.onCreate(savedInstanceState);  
18.           setContentView(R.layout.select_tag_activity);  
19.   
20.           mTagListView = (TagListView) findViewById(R.id.tagview);  
21.           setUpData();  
22.           mTagListView.setTags(mTags);  
23.      }  
24.   
25.      private void setUpData() {  
26.           for (int i = 0; i < 10; i++) {  
27.                Tag tag = new Tag();  
28.                tag.setId(i);  
29.                tag.setChecked(true);  
30.                tag.setTitle(titles[i]);  
31.                mTags.add(tag);  
32.           }  
33.      }  
34. }  

真机显示效果如下：

  

  当然，这个TagView的外观还是可以自己设置的，包括字体、背景等等。

  项目代码下载地址： http://download.csdn.net/detail/wangjinyu501/7673827