Android自定义View实现标签流效果
更新时间：2022年02月16日 11:45:58 作者：风云正
这篇文章主要为大家详细介绍了Android自定义View实现标签流效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
本文实例为大家分享了Android自定义View实现标签流效果的具体代码，供大家参考，具体内容如下
一、概述
Android自定义View实现标签流效果，一行放不下时会自动换行，用户可以自己定义单个标签的样式，可以选中和取消，可以监听单个标签的点击事件，功能还算强大，可以满足大部分开发需求，值得推荐，效果图如下：
二、实现代码
1.自定义View
定义属性文件
<declare-styleable name="FlowTagView"> <attr name="lineSpacing" format="dimension" /> <attr name="tagSpacing" format="dimension" /> <!-- 是否是固定布局 --> <attr name="isFixed" format="boolean" /> <attr name="columnSize" format="integer" /> </declare-styleable>
FlowTagConfig.java
package 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.java
package 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.java
package 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<Evaluate> chooseList = new ArrayList<Evaluate>();
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_flowtag);
initView();
initData();
}
private void initData() {
List<Evaluate> 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.java
package 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<Evaluate> list;
public EvaluateAdapter(Context context) {
this.context = context;
this.mInflater = LayoutInflater.from(context);
this.list = new ArrayList<Evaluate>();
}
public List<Evaluate> getList(){
return list;
}
public void setItems(List<Evaluate> 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;
}
}布局文件
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <com.czhappy.effectdemo.flowtag.FlowTagView android:id="@+id/container" android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="10dp" app:tagSpacing="10dp" app:lineSpacing="10dp"/> </LinearLayout>
bg_round_corner_line_orange.xml
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" > <solid android:color="#ffffff" /> <corners android:radius="5dp" /> <stroke android:width="0.5dp" android:color="#FF6700"/> </shape>
bg_round_corner_line_gray.xml
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" > <solid android:color="#ffffff" /> <corners android:radius="5dp" /> <stroke android:width="0.5dp" android:color="#cccccc"/> </shape>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
这篇文章主要为大家介绍了替换so文件来动态替换Flutter代码实现详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-01-01
Android基于google Zxing实现各类二维码扫描效果
这篇文章主要介绍了Android基于google Zxing实现各类二维码扫描效果的相关资料，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-02-02
本文介绍了Android数据双向绑定的原理和实现方式，包括基于观察者模式和数据绑定框架的实现方法，以及应用场景和优缺点的分析，帮助开发者了解和应用数据双向绑定技术，提升应用的交互性和响应速度2023-04-04
这篇文章主要为大家详细介绍了Android实现计步传感器功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-01-01
详解android 用webview加载网页(https和http)
这篇文章主要介绍了详解android 用webview加载网页(https和http)，详细的介绍了两个错误的解决方法，有兴趣的可以了解一下2017-11-11
这篇文章主要介绍了Android+SQLite数据库实现的生词记事本功能,结合具体实例形式分析了Android操作SQLite数据库实现生词记录功能的操作步骤与相关注意事项,需要的朋友可以参考下2017-09-09
这篇文章主要给大家介绍了关于Android Studio支持安卓手机投屏功能的相关资料,文中通过图文介绍的非常详细,对有需要的朋友具有一定的参考学习价值,需要的朋友可以参考下2023-01-01
这篇文章主要为大家详细介绍了Flutter质感设计之进度条，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-08-08
Android MPAndroidChart开源图表库之饼状图的代码
MPAndroidChart是一款基于Android的开源图表库，MPAndroidChart不仅可以在Android设备上绘制各种统计图表，而且可以对图表进行拖动和缩放操作，应用起来非常灵活2018-05-05
Android使用HttpURLConnection实现网络访问流程
早些时候其实我们都习惯性使用HttpClient，但是后来Android6.0之后不再支持HttpClient，需要添加Apache的jar才行，所以，就有很多开发者放弃使用HttpClient了，HttpURLConnection毕竟是标准Java接口(java.net) ，适配性还是很强的2022-12-12
最新评论