- ReplacementSpan介绍
android.text.style.ReplacementSpan是一个super span类，您可以扩展它以创建自定义的span类。您可以在自定义span类中绘制任何内容，然后使用它来替换TextView字符串中的指定字符。比如加粗、改变颜色、加链条、下划线等。
- ReplacementSpan类方法介绍
getSize方法返回值是int，指的是自定义span的宽度，高度呢？高度是已知的。原本显示的TextView的高度。事实上也是可以改变Span的高度，getSize方法中的参数有Paint.FontMetricsInt，通过改变 Paint. Font MetricsInt的asent和desent。参考DynamicDrawableSpan。
//计算span的大小
public abstract int getSize(@NonNull Paint paint, CharSequence text,
@IntRange(from = 0) int start, @IntRange(from = 0) int end,
@Nullable Paint.FontMetricsInt fm);
//span绘制到canvas
public abstract void draw(@NonNull Canvas canvas, CharSequence text,
@IntRange(from = 0) int start, @IntRange(from = 0) int end, float x,
int top, int y, int bottom, @NonNull Paint paint);
@Override
public int getSize(Paint paint, CharSequence text,
int start, int end,
Paint.FontMetricsInt fm) {
Drawable d = getCachedDrawable();
Rect rect = d.getBounds();
if (fm != null) {
fm.ascent = -rect.bottom;
fm.descent = 0;
fm.top = fm.ascent;
fm.bottom = 0;
}
return rect.right;
}
- 业务需求：文字加上圆角红色文案。
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.RectF;
import android.text.style.ReplacementSpan;
/**
* Created by guokun on 2018/5/24.
* 书籍和节目详情目录：title 加上 精品等tag。使用RadiusBackgroundSpan可以使用一个TextView，避免打开后重绘导致闪动tag的bug.
*/
public class RadiusBackgroundSpan extends ReplacementSpan {
private int mSize;
private int mColor;
private int mRadius;
private float mTextSize;
private int mTextColor;
private int mTextMargin;
private int mTopMargin;
private int mDivide;
/**
*
* @param color
* @param radius
* @param textSize
* @param textColor
* @param textMargin
* @param topMargin
* @param divide
*/
public RadiusBackgroundSpan(int color, int radius, int textSize, int textColor, int textMargin, int topMargin, int divide) {
mColor = color;
mRadius = radius;
mTextSize = textSize;
mTextColor = textColor;
mTextMargin = textMargin;
mTopMargin = topMargin;
mDivide = divide;
}
@Override
public int getSize(Paint paint, CharSequence text, int start, int end, Paint.FontMetricsInt fm) {
float oldTextSize = paint.getTextSize();
paint.setTextSize(mTextSize); //更改字体大小，重新测试宽度
mSize = (int) (paint.measureText(text, start, end) + 2 * mRadius + 2 * mTextMargin);
//mSize就是span的宽度，span有多宽，开发者可以在这里随便定义规则
//我的规则：这里text传入的是SpannableString，start，end对应setSpan方法相关参数
//可以根据传入起始截至位置获得截取文字的宽度，最后加上左右两个圆角的半径得到span宽度
paint.setTextSize(oldTextSize);
return mSize;
}
@Override
public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
float oldTextSize = paint.getTextSize(); //保存文字大小
int color = paint.getColor();//保存文字颜色
//x移动mDivide
x = x + mDivide;
paint.setTextSize(mTextSize); //设置字体大小
paint.setColor(mColor);//设置背景颜色
paint.setAntiAlias(true);// 设置画笔的锯齿效果
//oval就是文字背景矩形。这里在宽度为mSize，高度为bottom-top的矩形内新建了一个文字需要的矩形
//mTextSize为文字高度，这里加上了字体周围间距mRadius,mTextMargin,mTopMargin
RectF oval = new RectF(x, (top + bottom - mTextSize - mRadius - mTopMargin) / 2, x + mSize,
(top + bottom + mTextSize + mRadius + mTopMargin) / 2);
canvas.drawRoundRect(oval, mRadius, mRadius, paint);//绘制圆角矩形，第二个参数是x半径，第三个参数是y半径
paint.setColor(mTextColor);//设置画笔的文字颜色
//根据oval大小和字体，将文字绘制在oval居中位置
Paint.FontMetrics fontMetrics = paint.getFontMetrics();
float topTx = fontMetrics.top;//为基线到字体上边框的距离
float bottomTx = fontMetrics.bottom;//为基线到字体下边框的距离
int baseLineY = (int) (oval.centerY() - topTx / 2 - bottomTx / 2);//基线中间点的y轴计算公式
canvas.drawText(text, start, end, x + mRadius + mTextMargin, baseLineY, paint);//绘制文字
//恢复paint字体大小和颜色
paint.setTextSize(oldTextSize);
paint.setColor(color);
}
}
网友的实现对比
public class RadiusBackgroundSpan extends ReplacementSpan {
private int mBgColor;
private int mRadius;
private int mTextColor;
private int mTextSize;
private int mPaddingHorizontal;
private String mText;
private int mMarginLeft;
private int mMarginRight;
public RadiusBackgroundSpan(int bgColor, int radius, int textColor, int textSize, int paddingHorizontal, String text){
mBgColor = bgColor;
mRadius = radius;
mTextColor = textColor;
mTextSize = textSize;
mPaddingHorizontal = paddingHorizontal;
mText = text;
mMarginLeft = UIUtil.dpToPx(4);
mMarginRight = UIUtil.dpToPx(4);
}
@Override
public int getSize(Paint paint, CharSequence text, int start, int end, Paint.FontMetricsInt fm) {
paint.setTextSize(mTextSize);
return (int) paint.measureText(mText) + 2*mPaddingHorizontal + mMarginLeft + mMarginRight;
}
@Override
public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
final int offsetToTop = UIUtil.dpToPx(2);
paint.setTextSize(mTextSize);
paint.setAntiAlias(true);
RectF rect = new RectF();
rect.left = (int) x + mMarginLeft;
Paint.FontMetricsInt fontMetrics = paint.getFontMetricsInt();
int marginVertical = (bottom - top - fontMetrics.descent + fontMetrics.top)/2;
rect.top = top + marginVertical - offsetToTop; //视觉感觉偏下了，往上一点点
rect.bottom = bottom - marginVertical;
rect.right = rect.left + (int) paint.measureText(mText) + 2*mPaddingHorizontal;
paint.setColor(mBgColor);
canvas.drawRoundRect(rect, mRadius, mRadius, paint);
paint.setColor(mTextColor);
float fontShouldOffsetTop = ((fontMetrics.descent - fontMetrics.ascent)/2+fontMetrics.ascent)/2 - offsetToTop/2;
canvas.drawText(mText,x+mPaddingHorizontal+mMarginLeft,y + fontShouldOffsetTop,paint);
}
}
参考资料
教你自定义android中span
Android字符串进阶之三：字体属性及测量（FontMetrics）
