網上大部分的Android 流式標簽實現方式

1. 自定義ViewGroup,如 Android 實現FlowLayout流式布局（類似熱門標簽）
2. 使用RecyclerView的LayoutManager,如快速利用RecyclerView的LayoutManager搭建流式布局
   今天我所要使用的方式是自定義TextView的Span,簡單輕巧

• 首先繼承ReplacementSpan,繪制自己所需要的tag,下面給出一種我需要的Tag繪制樣式,你可以根據自己需求繪制出更加符合你所需的樣式.

import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.RectF;
import android.text.style.ClickableSpan;
import android.text.style.ReplacementSpan;
import android.text.style.UpdateLayout;
import android.view.View;

/**
 * @author呂志豪 .
 * @date 17-12-7  上午9:09.
 * Github :https://github.com/lvzhihao100
 * E-Mail：1030753080@qq.com
 * 簡書 :http://www.itdecent.cn/u/6e525b929aac
 */

public class TagSpan extends ReplacementSpan {
    private int mSize;
    private int mColor;
    private int mRadius;
    private int mSpace;
    private int lenth = 0;
    private CharSequence text;
    private TextClick textClick;

    /**
     * @param color  背景顏色
     * @param radius 圓角半徑
     */
    public TagSpan(int color, int radius, int space) {
        mColor = color;
        mRadius = radius;
        mSpace = space;
    }

    @Override
    public int getSize(Paint paint, CharSequence text, int start, int end, Paint.FontMetricsInt fm) {
        mSize = (int) (paint.measureText(text, start, end) + 2 * mRadius + 2 * mSpace);
        //mSize就是span的寬度，span有多寬，開發(fā)者可以在這里隨便定義規(guī)則
        //我的規(guī)則：這里text傳入的是SpannableString，start，end對應setSpan方法相關參數
        //可以根據傳入起始截至位置獲得截取文字的寬度，最后加上左右兩個圓角的半徑得到span寬度
        this.text=  text.subSequence(start,end);
        return mSize;
    }
    public int getSize(){
        return mSize;
    }

    @Override
    public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
        int color = paint.getColor();//保存文字顏色
        paint.setColor(mColor);//設置背景顏色
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(6);
        paint.setAntiAlias(true);// 設置畫筆的鋸齒效果
        RectF oval = new RectF(x + mSpace, y + paint.ascent(), x + mSize - mSpace, y + paint.descent());
        //設置文字背景矩形，x為span其實左上角相對整個TextView的x值，y為span左上角相對整個View的y值。paint.ascent()獲得文字上邊緣，paint.descent()獲得文字下邊緣
        canvas.drawRoundRect(oval, mRadius, mRadius, paint);//繪制圓角矩形，第二個參數是x半徑，第三個參數是y半徑
        paint.setColor(color);//恢復畫筆的文字顏色
        paint.setStrokeWidth(1);
        paint.setStyle(Paint.Style.FILL_AND_STROKE);
        canvas.drawText(text, start, end, x + mRadius + mSpace, y, paint);//繪制文字
        this.lenth = text.length();
    }

    public int length() {
        return lenth;
    }

    public void onClick(View v) {
        if (textClick != null) {
            textClick.click(text);
        }
    }

    public void setTextClick(TextClick textClick) {
        this.textClick = textClick;
    }

    public interface TextClick{
        void click(CharSequence text);
    }
}

• 處理Span點擊事件,需要重寫MovementMethod,然后使用

textView.setMovementMethod( ClickMovementMethod.getInstance());

import android.text.Layout;
import android.text.Selection;
import android.text.Spannable;
import android.text.method.BaseMovementMethod;
import android.text.method.MovementMethod;
import android.view.MotionEvent;
import android.widget.TextView;

import com.eqdd.yiqidian.box.span.TagSpan;

/**
 * @author呂志豪 .
 * @date 18-3-2  下午2:05.
 * Github :https://github.com/lvzhihao100
 * E-Mail：1030753080@qq.com
 * 簡書 :http://www.itdecent.cn/u/6e525b929aac
 */

public class ClickMovementMethod extends BaseMovementMethod {
    @Override
    public boolean onTouchEvent(TextView widget, Spannable buffer,
                                MotionEvent event) {
        int action = event.getAction();

        if (action == MotionEvent.ACTION_UP || action == MotionEvent.ACTION_DOWN) {
            int x = (int) event.getX();
            int y = (int) event.getY();

            x -= widget.getTotalPaddingLeft();
            y -= widget.getTotalPaddingTop();

            x += widget.getScrollX();
            y += widget.getScrollY();

            Layout layout = widget.getLayout();
            int line = layout.getLineForVertical(y);
            TagSpan[] links = buffer.getSpans(0, buffer.length(), TagSpan.class);

            if (links.length != 0) {
                if (action == MotionEvent.ACTION_UP) {
                    if (x < layout.getLineWidth(line)) {
                        for (int i = 0; i < line; i++) {
                            x += layout.getLineWidth(i);
                        }
                        int num = 0;
                        for (TagSpan link : links) {
                            if (x >= num && x < num + link.getSize()) {
                                link.onClick(widget);
                                break;
                            }
                            num += link.getSize();
                        }
                    }
                } else if (action == MotionEvent.ACTION_DOWN) {
                    Selection.setSelection(buffer,
                            buffer.getSpanStart(links[0]),
                            buffer.getSpanEnd(links[0]));
                }
                return true;
            } else {
                Selection.removeSelection(buffer);
            }
        }

        return super.onTouchEvent(widget, buffer, event);
    }



    public static MovementMethod getInstance() {
        if (sInstance == null)
            sInstance = new ClickMovementMethod();

        return sInstance;
    }

    private static ClickMovementMethod sInstance;
}

• 使用的時候

        textView.setText("");
        String[] split = data.split(",");//獲取標簽數組
        for (String s : split) {
            SpannableString spanString = new SpannableString(s);
            TagSpan tagSpan = new TagSpan(Color.GREEN, 10, 10);
            tagSpan.setTextClick(text -> {//設置點擊事件
                // TODO: 做點擊處理
            });
            spanString.setSpan(tagSpan, 0, s.length(), Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
            textView.append(spanString);
        }
        textView.setMovementMethod(new ClickMovementMethod());