今天我们要实现的效果如下：
当然列表中的标签显示的个数是可控的，实现个数可控的标签的话，我们就需要自定义View。
我们自定义一个抽象类继承LinearLayout并实现我们定义的接口：
BaseTagView:
/**
* 标签，继承此抽象类
* @author LinHai Gu
*
* @param <T>
*/
public abstract class BaseTagView<T> extends LinearLayout implements SelectTag<T>{
private Context mContext;
public BaseTagView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
mContext = context;
initView();
}
public BaseTagView(Context context, AttributeSet attrs) {
super(context, attrs);
mContext = context;
initView();
}
public BaseTagView(Context context) {
super(context);
mContext = context;
initView();
}
private void initView() {
setOrientation(LinearLayout.HORIZONTAL);
}
/**
* 添加标签，可配
* @param datas 数据源
* @param num 显示的标签数
*/
public void addTag(List<T> datas,int num) {
removeAllViews();
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
params.setMargins(0, 0, 10, 0);
if (datas.size() > num) {
for (int i = 0; i < num; i++) {
T data = datas.get(i);
TextView textView = (TextView) LayoutInflater.from(mContext)
.inflate(R.layout.tagtext_view, null);
textView.setText(getTag(data));
textView.setLayoutParams(params);
addView(textView);
}
} else {
for (int i = 0; i < datas.size(); i++) {
T data = datas.get(i);
TextView textView = (TextView) LayoutInflater.from(mContext)
.inflate(R.layout.tagtext_view, null);
textView.setText(getTag(data));
textView.setLayoutParams(params);
addView(textView);
}
}
}
}定义接口SelectTag：
/**
*
* @author LinHai Gu
*
* @param <T>
*/
public interface SelectTag<T> {
/**
* 获取标签内容
* @param data
* @return
*/
public abstract String getTag(T data);
}在这里为什么用到了泛型，这是因为我们需要的是一个公共的控件，而不是为某一个界面而写的。
在BaseTagView抽象类中的addTag方法中需要导入一个TextView布局文件:
tagtext_view:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/text_line"
android:textSize="12dp"
android:textColor="#999999"
android:padding="2dp"
>
</TextView>text_line:是专门给TextView外部添加标签的边框,当然你可以根据需要制作一些好看的标签样式
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@android:color/transparent" />
<corners android:topLeftRadius="1dp"
android:topRightRadius="1dp"
android:bottomRightRadius="1dp"
android:bottomLeftRadius="1dp"/>
<stroke android:width="1dp"
android:color="#999999"/>
</shape>以上我们的公共控件基本完成。
这时候假设有一个项目第一个页面从服务器获取到了标签列表，并显示在列表中，标签的值存放在一个PageObject对象中：
PageObject:
/**
* 假设这是某页面请求到的标签数据
* @author LinHai Gu
*
*/
public class PageObject implements Serializable{
private static final long serialVersionUID = 100230230204204021L;
public String tagName;
}接着我们就要显示这些标签，因此我们可以为不同的模块去创建不同的标签，假设第一个界面的标签View是这样的：
public class PageOneTagView extends BaseTagView<PageObject>{
public PageOneTagView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public PageOneTagView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public PageOneTagView(Context context) {
super(context);
}
public void setTagList(ArrayList<PageObject> list,int num){
addTag(list,num);
}
@Override
public String getTag(PageObject data) {
return data.tagName;
}
}通过子类定义setTagList方法传入我们想要显示的标签列表，并显示的个数就行了。
以下使我们的主布局：
MainActivity:
public class MainActivity extends Activity {
private Datapter datapter=new Datapter();
private ArrayList<PageObject> list=new ArrayList<PageObject>();
private ListView lv_tag;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
initView();
}
/**
* 假设这边是从服务获取到的标签列表
*/
private void initData(){
for(int i=0;i<10;i++){
PageObject obj=new PageObject();
obj.tagName="标签"+i;
list.add(obj);
}
}
private void initView(){
lv_tag=(ListView)findViewById(R.id.lv_list);
lv_tag.setAdapter(datapter);
}
class Datapter extends BaseAdapter {
@Override
public int getCount() {
return 23;
}
@Override
public Object getItem(int position) {
return position;
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
viewHolder viewh;
if (convertView == null) {
viewh = new viewHolder();
convertView = LayoutInflater.from(MainActivity.this).inflate(
R.layout.list_item, parent, false);
viewh.tag = (PageOneTagView) convertView.findViewById(R.id.page_tag);
convertView.setTag(viewh);
} else {
viewh = (viewHolder) convertView.getTag();
}
/*
* 添加标签,并显示4个标签
*/
viewh.tag.setTagList(list, 4);
return convertView;
}
}
class viewHolder {
public PageOneTagView tag;
}
}
activity_main:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.bill.MainActivity" >
<ListView
android:id="@+id/lv_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</ListView>
</RelativeLayout>list_item:(导入我们继承BaseTagView的类)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="@+id/iv_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_launcher" />
<com.bill.page1.PageOneTagView
android:id="@+id/page_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_toRightOf="@id/iv_logo" >
</com.bill.page1.PageOneTagView>
</RelativeLayout>
个人GitHub项目地址：https://github.com/LinhaiGu/TabView
转载请注明出处：http://blog.csdn.net/hai_qing_xu_kong/article/details/45919871情绪控_