继承FlexboxLayout自定义可自动换行的tag标签

实现效果如图：

继承FlexboxLayout自定义可自动换行的tag标签_第1张图片

通过继承自FlexboxLayout实现，Java代码：

package org.test;import android.content.Context;import android.graphics.Color;import android.graphics.drawable.GradientDrawable;import android.util.AttributeSet;import android.widget.LinearLayout;import android.widget.TextView;import androidx.annotation.NonNull;import androidx.annotation.Nullable;import com.google.android.flexbox.FlexDirection;import com.google.android.flexbox.FlexWrap;import com.google.android.flexbox.FlexboxLayout;import com.google.android.flexbox.JustifyContent;import java.util.ArrayList;import java.util.List;public class TagGroup extends FlexboxLayout {    private List mTexts;    private List mColors;    private Context mContext;    private int TAG_VIEW_COUNT = 0;    public TagGroup(Context context, AttributeSet attrs) {        super(context, attrs);        mContext = context;        init();    }    private void init() {        mTexts = new ArrayList<>();        mColors = new ArrayList<>();        this.setFlexDirection(FlexDirection.ROW);        this.setJustifyContent(JustifyContent.FLEX_START);        this.setFlexWrap(FlexWrap.WRAP);    }    public void setTagView(@NonNull List texts, @Nullable List colors) {        if (texts == null || texts.size() == 0) {            throw new RuntimeException("tag view文本字段不能为空");        }        this.mTexts = texts;        TAG_VIEW_COUNT = texts.size();        if (colors == null || colors.size() == 0) {            for (int i = 0; i < TAG_VIEW_COUNT; i++) {                mColors.clear();                mColors.add(Color.WHITE);            }        } else {            this.mColors = colors;        }        this.removeAllViews();        for (int i = 0; i < TAG_VIEW_COUNT; i++) {            TextView textView = makeTextView(mTexts.get(i), mColors.get(i));            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);            //设置每一个子View在整体布局中与其他子View的上下左右的margin            layoutParams.setMargins(0, 1, 5, 1);            this.addView(textView, layoutParams);        }        this.invalidate();    }    //绘制圆角描边的TextView    private TextView makeTextView(String s, Integer c) {        TextView textView = new TextView(mContext);        textView.setText(s);        textView.setPadding(10, 5, 10, 5);        int strokeWidth = 5; // 5px        int roundRadius = 15; // 15px        int strokeColor = Color.GRAY;        int fillColor = c;        GradientDrawable gd = new GradientDrawable();        gd.setColor(fillColor);        gd.setCornerRadius(roundRadius);        gd.setStroke(strokeWidth, strokeColor);        textView.setBackground(gd);        return textView;    }}

使用方式，把TagGroup当作一个普通布局使用，写入xml布局：

然后在上层，通过set方式，添加子tag标签实现：

        TagGroup tagGroup = findViewById(R.id.tag_group);        List texts = Arrays.asList("zhang", "phil", "csdn", "android", "zhang", "phil", "csdn", "android", "zhang", "phil", "csdn", "android");        List colors = Arrays.asList(Color.RED, Color.DKGRAY, Color.BLUE, Color.RED, Color.DKGRAY, Color.BLUE, Color.RED, Color.DKGRAY, Color.BLUE, Color.RED, Color.DKGRAY, Color.BLUE);        tagGroup.setTagView(texts, colors);

更多相关文章

随机推荐