Android - 使用ReplacementSpan为SpannableStringBuilder添加保证金

Question

我正在尝试在TextView/EditText中格式化Hashtags(比如Material Design Specs中提到的Chips).我可以使用格式化背景ReplacementSpan.但问题是我无法增加TextView/EditText中的行间距.见下图

问题是如何为主题标签添加顶部和底部边距？

这是我在文本中添加背景的代码:

   /**
     * First draw a rectangle
     * Then draw text on top
     */
    @Override
    public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
        RectF rect = new RectF(x, top, x + measureText(paint, text, start, end), bottom);
        paint.setColor(backgroundColor);
        canvas.drawRoundRect(rect, CORNER_RADIUS, CORNER_RADIUS, paint);
        paint.setColor(textColor);
        canvas.drawText(text, start, end, x, y, paint);
    }

Answer 1

我不久前遇到过类似的问题,这是我提出的解决方案:

在xml中托管TextView:

<TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="18dp"
        android:paddingBottom="18dp"
        android:paddingLeft="8dp"
        android:paddingRight="8dp"
        android:gravity="fill"
        android:textSize="12sp"
        android:lineSpacingExtra="10sp"
        android:textStyle="bold"
        android:text="@{viewModel.renderedTagBadges}">

自定义版本 ReplacementSpan

public class TagBadgeSpannable extends ReplacementSpan implements LineHeightSpan {

    private static int CORNER_RADIUS = 30;
    private final int textColor;
    private final int backgroundColor;
    private final int lineHeight;

    public TagBadgeSpannable(int lineHeight, int textColor, int backgroundColor) {
        super();
        this.textColor = textColor;
        this.backgroundColor = backgroundColor;
        this.lineHeight = lineHeight;
    }

    @Override
    public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
        final float textSize = paint.getTextSize();
        final float textLength = x + measureText(paint, text, start, end);
        final float badgeHeight = textSize * 2.25f;
        final float textOffsetVertical = textSize * 1.45f;

        RectF badge = new RectF(x, y, textLength, y + badgeHeight);
        paint.setColor(backgroundColor);
        canvas.drawRoundRect(badge, CORNER_RADIUS, CORNER_RADIUS, paint);

        paint.setColor(textColor);
        canvas.drawText(text, start, end, x, y + textOffsetVertical, paint);
    }

    @Override
    public int getSize(Paint paint, CharSequence text, int start, int end, Paint.FontMetricsInt fm) {
        return Math.round(paint.measureText(text, start, end));
    }

    private float measureText(Paint paint, CharSequence text, int start, int end) {
        return paint.measureText(text, start, end);
    }

    @Override
    public void chooseHeight(CharSequence charSequence, int i, int i1, int i2, int i3, Paint.FontMetricsInt fontMetricsInt) {
        fontMetricsInt.bottom += lineHeight;
        fontMetricsInt.descent += lineHeight;
    }
}

最后是一个创建Spannable的构建器

public class AndroidTagBadgeBuilder implements TagBadgeBuilder {

    private final SpannableStringBuilder stringBuilder;
    private final String textColor;
    private final int lineHeight;

    public AndroidTagBadgeBuilder(SpannableStringBuilder stringBuilder, int lineHeight, String textColor) {
        this.stringBuilder = stringBuilder;
        this.lineHeight = lineHeight;
        this.textColor = textColor;
    }

    @Override
    public void appendTag(String tagName, String badgeColor) {
        final String nbspSpacing = "\u202F\u202F"; // none-breaking spaces

        String badgeText = nbspSpacing + tagName + nbspSpacing;
        stringBuilder.append(badgeText);
        stringBuilder.setSpan(
            new TagBadgeSpannable(lineHeight, Color.parseColor(textColor), Color.parseColor(badgeColor)),
            stringBuilder.length() - badgeText.length(),
            stringBuilder.length()- badgeText.length() + badgeText.length(),
            Spanned.SPAN_EXCLUSIVE_EXCLUSIVE
        );
        stringBuilder.append("  ");
    }

    @Override
    public CharSequence getTags() {
        return stringBuilder;
    }

    @Override
    public void clear() {
        stringBuilder.clear();
        stringBuilder.clearSpans();
    }
}

结果将如下所示:

TagBadgeSpannable根据自己的喜好调整措施.

我已经使用此代码上传了一个非常小的示例项目到github,所以请随时查看它.

注意:该示例使用Android Databinding并编写MVVM样式

Answer 2

Android中的文本标记文档记录很少,编写此代码就像在黑暗中感受一样.

我做了一点,所以我会分享我所知道的.

您可以通过将芯片跨度包裹在一个内部来处理行间距LineHeightSpan. LineHeightSpan是一个扩展ParagraphStyle标记接口的接口,因此这会告诉您它会影响段落级别的外观.也许解释它的一个好方法是将您的ReplacementSpan子类与HTML 进行比较<span>,而ParagraphStyle类似的跨度LineHeightSpan则类似于HTML <div>.

所述LineHeightSpan接口由一个的方法:

public void chooseHeight(CharSequence text, int start, int end,
                         int spanstartv, int v,
                         Paint.FontMetricsInt fm);

为段落中的每一行调用此方法

• text是你的Spanned字符串.
• start 是当前行开头的字符的索引
• end 是当前行末尾的字符的索引
• spanstartv 是(IIRC)整个跨度本身的垂直偏移
• v 是(IIRC)当前线的垂直偏移
• fm是FontMetrics对象,它实际上是一个返回(输入/输出)参数.您的代码将进行更改fm并TextView在绘图时使用它们.

那么TextView它将做的是为它处理的每一行调用一次这个方法.根据参数以及Spanned字符串,您可以设置FontMetrics使用您选择的值渲染线条.

这是我为列表中的项目项目做的一个例子(想想<ol><li>)我想在每个列表项之间进行一些分离:

    @Override
    public void chooseHeight(CharSequence text, int start, int end, int spanstartv, int v, Paint.FontMetricsInt fm) {

        int incr = Math.round(.36F * fm.ascent); // note: ascent is negative

        // first line: add space to the top
        if (((Spanned) text).getSpanStart(this) == start) {
            fm.ascent += incr;
            fm.top = fm.ascent + 1;
        }

        // last line: add space to the bottom
        if (((Spanned) text).getSpanEnd(this) == end) {
            fm.bottom -= incr;
        }

    }

您的版本可能更简单,只需更改FontMetrics它所调用的每一行的相同方式.

在解密时FontMetrics,记录器和调试器是你的朋友.你只需要不断调整值,直到得到你喜欢的东西.