安卓TextView文本加图片混合显示

                             安卓TextView文本加图片混合显示

好久没写博客了，大家在项目中可能经常碰到文字开始或者末尾显示图标的情况，当单行显示的时候，我们可以使用drawableEnd等属性如下在设置：

                  android:drawableEnd="@drawable/bg_corner_f6f8f9_5dp"

或者直接使用TextView+ImageView结合使用，但是如果是遇到含有多行文字或者在文字中显示图片呢？如下面的效果图：

在“继续努力！ ”后面显示箭头图标，这端文字是后台获取的某个字段，可能含有换行符。这个时候，我们使用SpannableString +ImageSpan的方式，但是使用未经过处理的ImageSpan,会出现文字与图标在垂直方向不对齐的情况，如下：

所以我们需要改写下ImageSpan，重写onDraw,使其垂直居中显示，下面直接分享改写后的ImageSpan代码：

public class VerticalCenterImageSpan extends ImageSpan {

    public VerticalCenterImageSpan(Drawable drawable) {
        super(drawable);
    }

    @Override
    public void draw(Canvas canvas, CharSequence text, int start, int end,
                     float x, int top, int y, int bottom, Paint paint) {

        Paint.FontMetricsInt fm = paint.getFontMetricsInt();
        Drawable drawable = getDrawable();
        int transY = (y + fm.descent + y + fm.ascent) / 2
                - drawable.getBounds().bottom / 2;
        canvas.save();
        canvas.translate(x, transY);
        drawable.draw(canvas);
        canvas.restore();
    }
}

在代码中的使用如下：

VerticalCenterImageSpan imgSpan = new VerticalCenterImageSpan(drawable);
SpannableString spannableString = new SpannableString("您未通过入学测评，成绩：50分。\n" +
        "别灰心，我们为您推荐了其他合适课程，继续努力！           ");
spannableString.setSpan(imgSpan, 41, 45,
        Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
viewHolder.tvTips.setText(spannableString);