SpannableString 实现多样式文本显示

100 阅读 0 评论 66 点赞

我是靠谱客的博主缓慢大山，这篇文章主要介绍SpannableString 实现多样式文本显示，现在分享给大家，希望可以做个参考。

各位朋友，我又来了，最近app 刚刚更新了一版，提出了好多新的需求，其中有一个其实是很基础很有意思的，但是一直没有怎么研究过，文本的书写一直使用最多的是TextView，但是一直也是用单一的样式，这次用的日历让展示不同样式的效果，发现SpannableString 就可以很好的实现这个问题。。

一、TextView 设置基本的样式

xml模式显示：

复制代码

1
2
3
4
5
6
7
8
9
10
    <TextView
         android:id="@+id/tv1"
         android:layout_width="wrap_content"
         android:layout_height="45dp"
         android:layout_alignParentStart="true"
         android:layout_alignParentTop="true"
         android:gravity="center"
         android:paddingStart="10dp"
         android:text="联系电话："
         android:textColor="@color/text_gray_3" />

代码设置：

复制代码

1
2
3
4
5
6
7
 TextView child = new TextView(mContext);
 child.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, 
        ViewGroup.LayoutParams.WRAP_CONTENT));
 child.setTextColor(Color.RED)
 child.setTextSize(12);
 child.setGravity(Gravity.LEFT);
 llPromotion.addView(child);

二、一个TextView中有多种颜色或者字体大小等属性设置

方法一：使用SpannableString 来设置不同的属性

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
String skuName = sku.getSkuName() == null ? "" : sku.getSkuName();
String nameAndModel = skuName + "(" + sku.getCode() + ")";
String s = nameAndModel + " ¥" + sku.getSkuActualPrice();//设置分模块的字体展示内容
SpannableString ss = new SpannableString(s);
//设置nameAndModel模块字体颜色为#333333
ss.setSpan(new ForegroundColorSpan(Color.parseColor("#333333")), 0, nameAndModel.length(), Spanned.SPAN_INCLUSIVE_INCLUSIVE);
//设置除了nameAndModel模块外其他字体颜色为#fd6260
ss.setSpan(new ForegroundColorSpan(Color.parseColor("#fd6260")), nameAndModel.length(), ss.length(), Spanned.SPAN_INCLUSIVE_INCLUSIVE);
//设置 "(" + sku.getCode() + ")"内容字体大小为10sp
ss.setSpan(new AbsoluteSizeSpan(UiUtil.sp2px(10)), skuName.length(), nameAndModel.length(), Spanned.SPAN_INCLUSIVE_EXCLUSIVE);

//将动态设置的不同属性放置到TextView中展示
textView.setText(ss);

方法二：使用HTML属性来设置不同属性，其实也就是自己写一个前端的HTML，转换成我们android端来进行设置

复制代码

1
2
3
4
String ss = "<font color='#333333'>" + item.getSkuName() + "</font><font color='#333333'><small>(" + item.getCode() + ")" + "</small></font><font color='#fd6260'>¥" + item.getSkuActualPrice() + "</font>";

//将上面拼接的html转换为可以展示的String类型设置
textView.setText(Html.fromHtml(ss));