跳转到主内容
极星编程网:以代码为星,赴技术山海!

Android自定义View实现标签流效果

本文实例为大家分享了Android自定义View实现标签流效果的具体代码,供大家参考,具体内容如下

一、概述

Android自定义View实现标签流效果,一行放不下时会自动换行,用户可以自己定义单个标签的样式,可以选中和取消,可以监听单个标签的点击事件,功能还算强大,可以满足大部分开发需求,值得推荐,效果图如下:

二、实现代码

1.自定义View

定义属性文件FlowTagConfig.javapackage com.czhappy.effectdemo.flowtag;

import android.content.Context;import android.content.res.TypedArray;import android.util.AttributeSet;

import com.czhappy.effectdemo.R;

/*** Description:* User: chenzheng* Date: 2017/2/17 0017* Time: 10:23*/ public class FlowTagConfig {

private static final int DEFAULT_LINE_SPACING = 5;//默认行间距private static final int DEFAULT_TAG_SPACING = 10;//各个标签之间的默认距离private static final int DEFAULT_FIXED_COLUMN_SIZE = 3; //默认列数

private int lineSpacing;private int tagSpacing;private int columnSize;private boolean isFixed;

public FlowTagConfig(Context context,AttributeSet attrs){TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.FlowTagView);try {lineSpacing = a.getDimensionPixelSize(R.styleable.FlowTagView_lineSpacing, DEFAULT_LINE_SPACING);tagSpacing = a.getDimensionPixelSize(R.styleable.FlowTagView_tagSpacing, DEFAULT_TAG_SPACING);columnSize = a.getInteger(R.styleable.FlowTagView_columnSize, DEFAULT_FIXED_COLUMN_SIZE);isFixed = a.getBoolean(R.styleable.FlowTagView_isFixed,false);} finally {a.recycle();}}

public int getLineSpacing() {return lineSpacing;}

public void setLineSpacing(int lineSpacing) {this.lineSpacing = lineSpacing;}

public int getTagSpacing() {return tagSpacing;}

public void setTagSpacing(int tagSpacing) {this.tagSpacing = tagSpacing;}

public int getColumnSize() {return columnSize;}

public void setColumnSize(int columnSize) {this.columnSize = columnSize;}

public boolean isFixed() {return isFixed;}

public void setIsFixed(boolean isFixed) {this.isFixed = isFixed;}}FlowTagView.javapackage com.czhappy.effectdemo.flowtag;

import android.content.Context;import android.database.DataSetObserver;import android.graphics.Canvas;import android.util.AttributeSet;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;

/*** Description:* User: chenzheng* Date: 2017/2/17 0017* Time: 10:23*/ public class FlowTagView extends ViewGroup {

private int mLineSpacing;//行间距private int mTagSpacing;//各个标签之间的距离private BaseAdapter mAdapter;private TagItemClickListener mListener;private DataChangeObserver mObserver;

public FlowTagView(Context context) {super(context);init(context, null, 0);}

public FlowTagView(Context context, AttributeSet attrs) {super(context, attrs);init(context, attrs, 0);}

public FlowTagView(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);init(context, attrs, defStyle);}

private void init(Context context, AttributeSet attrs, int defStyle) {//获取属性FlowTagConfig config = new FlowTagConfig(context, attrs);mLineSpacing = config.getLineSpacing();mTagSpacing = config.getTagSpacing();}

private void drawLayout() {if (mAdapter == null || mAdapter.getCount() == 0) {return;}

this.removeAllViews();

for (int i = 0; i < mAdapter.getCount(); i++) {View view = mAdapter.getView(i,null,null);final int position = i;view.setOnClickListener(new OnClickListener() {@Override public void onClick(View v) {if (mListener != null) {mListener.itemClick(position);}}});this.addView(view);}}

@Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {int wantHeight = 0;int wantWidth = resolveSize(0, widthMeasureSpec);int paddingLeft = getPaddingLeft();int paddingRight = getPaddingRight();int paddingTop = getPaddingTop();int paddingBottom = getPaddingBottom();int childLeft = paddingLeft;int childTop = paddingTop;int lineHeight = 0;

//固定列的数量所需要的代码for (int i = 0; i < getChildCount(); i++) {final View childView = getChildAt(i);LayoutParams params = childView.getLayoutParams();childView.measure(getChildMeasureSpec(widthMeasureSpec, paddingLeft + paddingRight, params.width),getChildMeasureSpec(heightMeasureSpec, paddingTop + paddingBottom, params.height));//获取单个tag的宽高int childHeight = childView.getMeasuredHeight();int childWidth = childView.getMeasuredWidth();lineHeight = Math.max(childHeight, lineHeight);

//超过长度的新起一行if (childLeft + childWidth + paddingRight > wantWidth) {childLeft = paddingLeft;childTop += mLineSpacing + childHeight;lineHeight = childHeight;}

childLeft += childWidth + mTagSpacing;}wantHeight += childTop + lineHeight + paddingBottom;setMeasuredDimension(wantWidth, resolveSize(wantHeight, heightMeasureSpec));}

@Override protected void onLayout(boolean changed, int l, int t, int r, int b) {//固定列的数量所需要的代码

int width = r - l;int paddingLeft = getPaddingLeft();int paddingTop = getPaddingTop();int paddingRight = getPaddingRight();int childLeft = paddingLeft;int childTop = paddingTop;int lineHeight = 0;

for (int i = 0; i < getChildCount(); i++) {final View childView = getChildAt(i);if (childView.getVisibility() == View.GONE) {continue;}int childWidth = childView.getMeasuredWidth();int childHeight = childView.getMeasuredHeight();lineHeight = Math.max(childHeight, lineHeight);

if (childLeft + childWidth + paddingRight > width) {childLeft = paddingLeft;childTop += mLineSpacing + lineHeight;lineHeight = childHeight;}

childView.layout(childLeft, childTop, childLeft + childWidth, childTop + childHeight);childLeft += childWidth + mTagSpacing;}}

@Override protected void onDraw(Canvas canvas) {super.onDraw(canvas);}

@Override public LayoutParams generateLayoutParams(AttributeSet attrs) {return new LayoutParams(this.getContext(), attrs);}

public void setAdapter(BaseAdapter adapter){if (mAdapter == null){mAdapter = adapter;if (mObserver == null){mObserver = new DataChangeObserver();mAdapter.registerDataSetObserver(mObserver);}drawLayout();}}

public void setItemClickListener(TagItemClickListener mListener) {this.mListener = mListener;}

/*** 单击监听接口*/ public interface TagItemClickListener {void itemClick(int position);}

class DataChangeObserver extends DataSetObserver {@Override public void onChanged() {FlowTagView.this.drawLayout();}

@Override public void onInvalidated() {super.onInvalidated();}}}

2.测试类

FlowTagActivity.javapackage com.czhappy.effectdemo.activity;

import android.os.Bundle;import android.support.annotation.Nullable;import android.support.v7.app.AppCompatActivity;

import com.czhappy.effectdemo.R;import com.czhappy.effectdemo.adapter.EvaluateAdapter;import com.czhappy.effectdemo.flowtag.FlowTagView;import com.czhappy.effectdemo.model.Evaluate;

import java.util.ArrayList;import java.util.List;

/*** Description:* User: chenzheng* Date: 2017/2/17 0017* Time: 11:47*/ public class FlowTagActivity extends AppCompatActivity {

private FlowTagView mContainer;private EvaluateAdapter adapter;private List chooseList = new ArrayList();

@Override protected void onCreate(@Nullable Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_flowtag);

initView();initData();}

private void initData() {List list = new ArrayList();Evaluate e1 = new Evaluate("热情", "1");Evaluate e2 = new Evaluate("服务周到", "2");Evaluate e3 = new Evaluate("一般", "3");Evaluate e4 = new Evaluate("技术活杠杠的", "4");Evaluate e5 = new Evaluate("专业精通", "5");Evaluate e6 = new Evaluate("只会吹牛逼", "6");Evaluate e7 = new Evaluate("地下第一仅此一家", "7");list.add(e1);list.add(e2);list.add(e3);list.add(e4);list.add(e5);list.add(e6);list.add(e7);adapter.setItems(list);

}

private void initView() {mContainer = (FlowTagView) this.findViewById(R.id.container);adapter = new EvaluateAdapter(this);mContainer.setAdapter(adapter);mContainer.setItemClickListener(new FlowTagView.TagItemClickListener() {@Override public void itemClick(int position) {Evaluate e = (Evaluate) adapter.getItem(position);e.is_choosed = !e.is_choosed;if(e.is_choosed){chooseList.add(e);}else{chooseList.remove(e);}adapter.notifyDataSetChanged();}});}}EvaluateAdapter.javapackage com.czhappy.effectdemo.adapter;

import android.content.Context;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.TextView;

import com.czhappy.effectdemo.R;import com.czhappy.effectdemo.model.Evaluate;

import java.util.ArrayList;import java.util.List;

/*** Description:* User: chenzheng* Date: 2017/2/17 0017* Time: 11:43*/ public class EvaluateAdapter extends BaseAdapter {

private Context context;private LayoutInflater mInflater;private List list;

public EvaluateAdapter(Context context) {this.context = context;this.mInflater = LayoutInflater.from(context);this.list =  new ArrayList();

}

public List getList(){return list;}

public void setItems(List list){this.list = list;notifyDataSetChanged();}

@Override public int getCount() {return list == null ? 0 : list.size();}

@Override public Object getItem(int position) {return list.get(position);}@Override public long getItemId(int position) {// TODO Auto-generated method stub return 0;}

@Override public View getView(int position, View convertView, ViewGroup parent) {ViewHolder holder = null;if (convertView == null) {holder = new ViewHolder();convertView = mInflater.inflate(R.layout.evaluate_grid_item, null);holder.evaluate_tv = (TextView)convertView.findViewById(R.id.evaluate_tv);convertView.setTag(holder);

} else {

holder = (ViewHolder) convertView.getTag();}

final Evaluate ee = (Evaluate) getItem(position);holder.evaluate_tv.setText(ee.getName());if(ee.is_choosed){holder.evaluate_tv.setBackgroundResource(R.drawable.bg_round_corner_line_orange);}else{holder.evaluate_tv.setBackgroundResource(R.drawable.bg_round_corner_line_gray);}return convertView;}

private final class ViewHolder {private TextView evaluate_tv;}}布局文件

bg_round_corner_line_orange.xml

bg_round_corner_line_gray.xml

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

您可能感兴趣的文章:Android实现单行标签流式布局Android自定义ViewGroup实现标签流容器FlowLayout Android自定义ViewGroup实现标签流效果

相关文章