Android TextView 富文本SpannableString 文字+图片居中显示,支持图片换行居中显示

Android TextView 富文本SpannableString 文字+图片居中显示

代码示意:

注意1. drawable 为图片资源,只能是一整张图,如酒店星级,5星级一张5个星星的图片,不能是1个星星循环5次拼接一起,因为涉及到图片换行显示。
2. textView先显示文本,后加空格" ",然后再拼接图片上去。
3. 需要根据字段映射不同的图片,如1-5星级,对应的不同的图片drawable和iconWidth.

textView.setText(title); // **设置文字**
...

/**
     * 标题末尾插入星钻
     */
    public static void insertDrawable(Context context, TextView tv, Drawable drawable, SpannableString sb, int iconWidth) {
        if (drawable == null || sb == null) {
            return;
        }
        drawable.setBounds(ExtendUtils.dip2px(context, 2), 0, ExtendUtils.dip2px(context, iconWidth), ExtendUtils.dip2px(context, 10));  // 最后两个参数分别为图片宽度、高度
        //用这个drawable对象代替字符串
        HotelListImageSpan span = new HotelListImageSpan(drawable);
        //包括0但是不包括"star".length()即:4
        sb.setSpan(span, 0, "star".length(), Spannable.SPAN_INCLUSIVE_EXCLUSIVE);
        tv.append(sb); // **在最后添加图片**
    }

自定义ImageSpan代码:

import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.drawable.Drawable;
import android.text.style.ImageSpan;

/**
 * 列表页富文本,支持图片换行居中
 */
public class HotelListImageSpan extends ImageSpan {

    public HotelListImageSpan(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) {
        Drawable b = getDrawable();
        canvas.save();
        int transY;
        //要显示的文本高度-图片高度除2等居中位置+top(换行情况)
        transY = ((bottom - top) - b.getBounds().bottom) / 2 + top;
        //偏移画布后开始绘制
        canvas.translate(x, transY);
        b.draw(canvas);
        canvas.restore();
    }
}

你可能感兴趣的:(Android,UI,开发总结)