java - 带有圆角的 Android Spannablecontent

Question

我正在尝试使用 Spannable String 更改我的字符串以制作中间带有数字的徽章。我可以通过设置 BackGroundColorSpan 突出显示适当的字母/数字，但需要帮助使其更漂亮一些。我希望在整个形状周围有一点填充的圆角。

这篇文章非常接近我正在尝试做的事情:Android SpannableString set background behind part of text

由于它与我的应用程序交互的方式，我真的需要将资源保留为 TextView。

关于如何针对我的特定情况使用 ReplacementSpan 有什么想法吗？

这是我的代码 fragment :

if (menuItem.getMenuItemType() == SlidingMenuItem.MenuItemType.NOTIFICATIONS) {
    myMenuRow.setTypeface(null, Typeface.NORMAL);
    myMenuRow.setTextColor(getContext().getResources().getColor(R.color.BLACK));
    myMenuRow.setActivated(false);
    SpannableString spannablecontent = new SpannableString(myMenuRow.getText());
    spannablecontent.setSpan(new BackgroundColorSpan(Color.argb(150,0,0,0)), 18, myMenuRow.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
    myMenuRow.setText(spannablecontent);
}

Answer 1

实际上，在显示多行 徽章时，我发现所有这些答案都存在大问题。经过大量的测试和调整。我终于得到了上面的最佳版本。

基本思想是通过设置更大的文本大小并在跨度内设置所需的大小来欺骗 TextView。此外，您可以看到我以不同方式绘制徽章背景和文本。

所以，这是我的 RoundedBackgroundSpan:

public class RoundedBackgroundSpan extends ReplacementSpan {

    private static final int CORNER_RADIUS = 12;

    private static final float PADDING_X = GeneralUtils.convertDpToPx(12);
    private static final float PADDING_Y = GeneralUtils.convertDpToPx(2);

    private static final float MAGIC_NUMBER = GeneralUtils.convertDpToPx(2);

    private int mBackgroundColor;
    private int mTextColor;
    private float mTextSize;

    /**
     * @param backgroundColor color value, not res id
     * @param textSize        in pixels
     */
    public RoundedBackgroundSpan(int backgroundColor, int textColor, float textSize) {
        mBackgroundColor = backgroundColor;
        mTextColor = textColor;
        mTextSize = textSize;
    }

    @Override
    public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
        paint = new Paint(paint); // make a copy for not editing the referenced paint

        paint.setTextSize(mTextSize);

        // Draw the rounded background
        paint.setColor(mBackgroundColor);
        float textHeightWrapping = GeneralUtils.convertDpToPx(4);
        float tagBottom = top + textHeightWrapping + PADDING_Y + mTextSize + PADDING_Y + textHeightWrapping;
        float tagRight = x + getTagWidth(text, start, end, paint);
        RectF rect = new RectF(x, top, tagRight, tagBottom);
        canvas.drawRoundRect(rect, CORNER_RADIUS, CORNER_RADIUS, paint);

        // Draw the text
        paint.setColor(mTextColor);
        canvas.drawText(text, start, end, x + PADDING_X, tagBottom - PADDING_Y - textHeightWrapping - MAGIC_NUMBER, paint);
    }

    private int getTagWidth(CharSequence text, int start, int end, Paint paint) {
        return Math.round(PADDING_X + paint.measureText(text.subSequence(start, end).toString()) + PADDING_X);
    }

    @Override
    public int getSize(Paint paint, CharSequence text, int start, int end, Paint.FontMetricsInt fm) {
        paint = new Paint(paint); // make a copy for not editing the referenced paint
        paint.setTextSize(mTextSize);
        return getTagWidth(text, start, end, paint);
    }
}

下面是我如何使用它:

public void setTags(ArrayList<String> tags) {
    if (tags == null) {
        return;
    }

    mTextView.setTextSize(TypedValue.COMPLEX_UNIT_SP, 26); // Tricking the text view for getting a bigger line height
    
    SpannableStringBuilder stringBuilder = new SpannableStringBuilder();
    
    String between = " ";
    int tagStart = 0;
    
    float textSize = 13 * getResources().getDisplayMetrics().scaledDensity; // sp to px
    
    for (String tag : tags) {
        // Append tag and space after
        stringBuilder.append(tag);
        stringBuilder.append(between);

        // Set span for tag
        RoundedBackgroundSpan tagSpan = new RoundedBackgroundSpan(bgColor, textColor, textSize);
        stringBuilder.setSpan(tagSpan, tagStart, tagStart + tag.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

        // Update to next tag start
        tagStart += tag.length() + between.length();
    }

    mTextView.setText(stringBuilder, TextView.BufferType.SPANNABLE);
}

**笔记:**

• 您可以使用所有尺寸和常量来适应您想要的风格
• 如果你使用外部字体一定要设置 android:includeFontPadding="false"否则它会弄乱行的高度

享受 :)