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

时间:2016-08-09 12:24:24

标签: android hashtag spannablestring android-chips

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

问题是如何为主题标签添加上下边距?

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

   /**
     * 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);
    }

2 个答案:

答案 0 :(得分:7)

前一段时间我遇到过类似的问题,这是我提出的解决方案:

在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();
    }
}

结果将如下所示: Rendered badges in TextView

根据自己的喜好调整TagBadgeSpannable中的指标。

我已使用此代码向github上传了一个非常小的示例项目,因此请随时查看。

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

答案 1 :(得分:6)

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)当前行的垂直偏移量
  • fmFontMetrics对象,实际上是返回(输入/输出)参数。您的代码将对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时,记录器和调试器是你的朋友。你只需要不断调整值,直到得到你喜欢的东西。