前言

需求：给一个字符串拼接上一个"全国"标签，需要一直跟在文字后面。

ui图：

想法：

采用spannable的方法给文字后面添加图片。

正文

1.写一个xml当"全国"标签view。

//shape样式

ps：为什么要套一个LinearLayout呢？因为在spannable中添加绘制图片，不好修改其中标签的位置，故套一层ViewGroup，再在里面修改margin从而控制位置。

2.将view转换成drawable.

将view转成drawable的工具方法。

//工具类

/**

* 将view转换成Drawable

* @param view

* @return

*/

public static Drawable convertViewToDrawable(View view) {

int spec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);

view.measure(spec, spec);

view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());

Bitmap b = Bitmap.createBitmap(view.getMeasuredWidth(), view.getMeasuredHeight(), Bitmap.Config.ARGB_8888);

Canvas c = new Canvas(b);

c.translate(-view.getScrollX(), -view.getScrollY());

view.draw(c);

view.setDrawingCacheEnabled(true);

Bitmap cacheBmp = view.getDrawingCache();

Bitmap viewBmp = cacheBmp.copy(Bitmap.Config.ARGB_8888, true);

view.destroyDrawingCache();

BitmapDrawable drawable = new BitmapDrawable(Application.getResources(), viewBmp);

cacheBmp.recycle();

return drawable;

}

3.使用ImageSpan塞入drawable.

String centerName="你需要显示的内容";

centerName += F.getInstance().getString(R.string.entire_country);//加上全国两个字，后面会被替换成图片

View globalView = LayoutInflater.from(F.getInstance().getContext()).inflate(R.layout.view_treament_center_golbal, null);

String finalCenterName = centerName;

Drawable drawable = ViewUtils.convertViewToDrawable(globalView);

SpannableStringBuilder spannableString = new SpannableStringBuilder(finalCenterName);

drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getMinimumHeight());//必须设置，代表drawable在canvas的draw位置

ImageSpan imageSpan = new ImageSpan(drawable);

spannableString.setSpan(imageSpan, spannableString.length() - 2, spannableString.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

holder.mTvCenterName.setText(spannableString);

这一段代码需要理解下：

1.使用LayoutInflater加载刚刚写的xml，"全国"view

View globalView = LayoutInflater.from(F.getInstance()

.getContext())

.inflate(R.layout.view_treament_center_golbal, null);

2.使用刚刚的工具将view转换成drawable，也可以叫你的ui给你切个图。

3.设置drawable绘制位置

drawable.setBounds(0, 0, drawable.getIntrinsicWidth(),

Drawable的setBounds方法有四个参数，setBounds(int left, int top, int right, int bottom),这个四参数指的是drawable将在被绘制在canvas的哪个矩形区域内。

例如

@Override

protected void onDraw(Canvas canvas) {

drawable.setBounds(100, 100, 500, 500);

drawable.draw(canvas);

}

上面的代码会将drawable绘制在canvas内部(100,100,500,500)表示的矩形区内(这个矩形区域的坐标是以canvas左上角为坐标原点的)

4.通过给SpanString设置ImageSpan增加图片。

spannableString.setSpan(imageSpan, spannableString.length() - 2, spannableString.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

setSpan方法:

参数1：增加的样式内容；

参数2：替换的开始位置；

参数3：替换的结束位置；

参数4：含尾不含头

参数4的枚举：

Spanned.SPAN_EXCLUSIVE_EXCLUSIVE --- 不包含start和end所在的端点 (a,b)

Spanned.SPAN_EXCLUSIVE_INCLUSIVE --- 不包含端start，但包含end所在的端点 (a,b]

Spanned.SPAN_INCLUSIVE_EXCLUSIVE --- 包含start，但不包含end所在的端点 [a,b)

Spanned.SPAN_INCLUSIVE_INCLUSIVE--- 包含start和end所在的端点 [a,b]

实现效果：

​

相关链接

文字高亮