Android使用SpannableString实现多行文字开头放置标签图案

实现效果:多行文字开头是一个标签图片

布局中,

  <TextView
        android:ellipsize="end"
        android:maxLines="2"
        android:letterSpacing="0.04"
        android:lineSpacingExtra="3.3dp"
        android:gravity="center_vertical"
        android:layout_gravity="center_vertical"
        android:id="@+id/tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="25dp"
        android:text=""
        android:textColor="#000000"
        android:textSize="15sp" />

标签图片:(这个切图上下白边大小不一样,所以效果上竖直方向有点没居中,建议使用四周无白边的切图)

Activity中使用SpannableString将开头位置替换为标签图片,用了一个CenterAlignImageSpan来解决图片与文字居中对齐

TextView mTv = (TextView) this.findViewById(R.id.tv);
        String str1 = "  ";
        String str2 = "北京首条自行车高速本周开通 限速15公里/小时,这条路东起昌平回龙观," +
                "西至海淀区的上地西路和后厂村路交叉口,全长6.5公里骑行最高时速不超过15公里,禁止行人";
        String str = str1 + str2;
        SpannableString spannableString = new SpannableString(str);
        Drawable d = getResources().getDrawable(R.drawable.icon_new);
        int iconwidth = DensityUtil.dip2px(this,25);//27
        int iconHeight = DensityUtil.dip2px(this,16);//15

        d.setBounds(0,0,iconwidth,iconHeight);
        //居中对齐imageSpan
        CenterAlignImageSpan imageSpan1 = new CenterAlignImageSpan(d);
        spannableString.setSpan(imageSpan1, 0, 1, ImageSpan.ALIGN_BASELINE);

        mTv.setLineSpacing(12f,1);
        mTv.setText(spannableString);

CenterAlignImageSpan类

public class CenterAlignImageSpan extends ImageSpan {
    public CenterAlignImageSpan(Drawable drawable) {
        super(drawable);
    }

    public CenterAlignImageSpan(Bitmap b) {
        super(b);
    }

    @Override
    public void draw(@NonNull Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, @NonNull Paint paint) {
        Drawable b = getDrawable();
        Paint.FontMetricsInt fm = paint.getFontMetricsInt();
        int transY = (y + fm.descent + y + fm.ascent) / 2 - b.getBounds().bottom / 2;//计算y方向的位移
        canvas.save();
        canvas.translate(x, transY);//绘制图片位移一段距离
        b.draw(canvas);
        canvas.restore();
    }
}

 

 

 

 

发布了110 篇原创文章 · 获赞 32 · 访问量 7万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 编程工作室 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览