SpannableString使用详解

本文转自：http://blog.csdn.net/u012702547/article/details/49895157

TextView中算是Android的开发中最最常用的控件了，有的时候，我们要给一个的TextView中的显示的文字设置不同的样式或者响应事件，比如同一个TextView的中，有的字是红色，有的字是蓝色，有的字点击之后有响应事件，有的点击之后没有响应事件，甚至我们想在的TextView中显示一个数学公式等等，那么对于形形色色的需求我们有没有解决方案呢？当然有，一种是使用HTML来解决，另一种就是使用SpannableString，HTML比较简单，本文主要介绍后者。SpannableString可以用来显示复合文本，我们可以通过SpannableString给文本设置各种各样的样式，下面我们就来看看SpannableString的一些常见用法。

1.设置的TextView的背景颜色

给TextView中设置背景颜色这本身是很简单的，在XML文件中直接加入背景属性即可，下面我们来看看怎么样通过SpannableString来给TextView中设置背景颜色：

[java]  查看纯 文本  

打印 ？

1. tv1 =（TextView）  this .findViewById（R.id.tv1）;  
2.         SpannableString ss1 =  new  SpannableString（“设置背景颜色” ）;  
3.         ss1.setSpan（new  BackgroundColorSpan（Color.parseColor（“＃FFD700” ）），  0 ，  
4.                 ss1.length（），Spanned.SPAN_EXCLUSIVE_INCLUSIVE）;  
5.         tv1.setText（SS1）;  

首先拿到一个TextView的，然后构造一个 SpannableString，构造方法中传入的参数就是我们要显示的文字，然后就是一个最终要的方法，通过setSpan来设置背景色，第一个参数是我们要设置的背景颜色，第二第三个参数是我们要给哪一段的文字设置背景（该段文字的的startIndex和endIndex的），最后一个参数有四个值：

[java]  查看纯 文本  

打印 ？

1. / ** 
2.  *类型为SPAN_INCLUSIVE_EXCLUSIVE的非0长度跨度展开 
3.  *包括插在他们起点但不在他们的文本 
4.  *结束点。当0长度时，它们的行为就像标记。 
5.  * /  
6. public static final int  SPAN_INCLUSIVE_EXCLUSIVE = SPAN_MARK_MARK;     
7.   
8. / ** 
9.  * SPAN_INCLUSIVE_INCLUSIVE类型的范围展开 
10.  *包括在其起点或终点插入的文本。 
11.  * /  
12. public static final int  SPAN_INCLUSIVE_INCLUSIVE = SPAN_MARK_POINT;     
13.   
14. / ** 
15.  * SPAN_EXCLUSIVE_EXCLUSIVE类型的范围不会展开 
16.  *包括在其起点或终点插入的文本。 
17.  *他们永远不会有0的长度，并被自动删除 
18.  *从缓冲区，如果它们覆盖的所有文本被删除。 
19.  * /  
20. public static final int  SPAN_EXCLUSIVE_EXCLUSIVE = SPAN_POINT_MARK;     
21.   
22. / ** 
23.  * SPAN_EXCLUSIVE_INCLUSIVE类型的非0长度跨度展开 
24.  *包括在其终点插入的文本，但不包括在他们的终点 
25.  * 初始点。当0长度时，它们的行为就像点。 
26.  * /  
27. public static final int  SPAN_EXCLUSIVE_INCLUSIVE = SPAN_POINT_POINT;     

这四个值分别表示

1.前面包括，后面不包括，即在文本前插入新的文本会应用该样式，而在文本后插入新文本不会应用该样式

2.前面包括，后面包括，即在文本前插入新的文本会应用该样式，而在文本后插入新文本也会应用该样式

3.前面不包括，后面不包括

4.前面不包括，后面包括

好了，我们这里设置的是前面不包括，后面包括，我们看看效果：

当我们点击按钮的时候会不断往TV1中追加新的文本，这时新的文本会自动使用这个背景样式，这是因为我们的最后一个参数设置为了Spanned.SPAN_EXCLUSIVE_INCLUSIVE，我们的点击事件是这样的：

[java]  查看纯 文本  

打印 ？

1. tv1.append（“1234” ）;  

2.给文本设置点击事件

文本设置点击事件本身也是非常简单，之间在XML文件中设置点击属性为真，然后就可以像给按钮设置点击事件一样给TextView的设置点击事件了，但是如果我们只想给一个TextView的中的某几个文字设置点击事件，而不想给整个TextView中设置点击事件，那么该怎么做看下面的代码？

[java]  查看纯 文本  

打印 ？

1. TV2 =（TextView的）  此.findViewById（R.id.tv2）;  
2. SpannableString ss2 =  new  SpannableString（“点我吧123456” ）;  
3. ss2.setSpan（new  ClickableSpan（）{  
4.   
5.     @覆盖  
6.     public void  onClick（查看小部件）{   
7.         Log.i（“lenve” ，  “tv2 --- onClick” ）;  
8.         Toast.makeText（MainActivity。这个，  “点我呀” ，Toast.LENGTH_SHORT）  
9.                 。显示（）;  
10.     }  
11. }，  0 ，  3 ，Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
12. tv2.setText（SS2）;  
13. //设置tv2为可点击状态  
14. tv2.setMovementMethod（LinkMovementMethod.getInstance（））;  

大部分和1中的代码一样，我们主要来说说setSpan方法，第一个参数是一个ClickableSpan对象，这里有一个的onClick方法，该方法中就是我们对点击事件的响应，后面几个参数和前文一样，我们来看看效果：

同一个TextView的中，只有前三个文字会响应点击事件，其余文字都不会响应该事件。这里要特别注意最后一行代码，我们要设置该TextView的为可点击状态。

3.设置文本颜色

在1中我们设置了的TextView的背景颜色，这里我们看看怎么设置文本的颜色：

[java]  查看纯 文本  

打印 ？

1. tv3 =（TextView）  this .findViewById（R.id.tv3）;  
2.         SpannableString ss3 =  new  SpannableString（“设置文本颜色” ）;  
3.         ss3.setSpan（new  ForegroundColorSpan（Color.parseColor（“＃FF3030” ）），  0 ，  
4.                 ss3.length（），Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
5.         tv3.setText（SS3）;  

setSpan函数第一个参数是我们要设置的文本颜色，后面几个参数含义和之前介绍的一样，我们看看效果：

4.设置删除线效果

删除线效果在一些电商应用中会用到，不要1999年（一个删除线），不要998（一个删除线），只要XXX，我们看看怎么实现：

[java]  查看纯 文本  

打印 ？

1. tv6 =（TextView）  this .findViewById（R.id.tv6）;  
2.         SpannableString ss6 =  new  SpannableString（“删除线” ）;  
3.         ss6.setSpan（new  StrikethroughSpan（），  0 ，ss6.length（），  
4.                 Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
5.         tv6.setText（SS6）;  

setSpan方法的第一个参数传入新的StrikethroughSpan（）即可，看看效果：

5.设置下划线效果

[java]  查看纯 文本  

打印 ？

1. tv7 =（TextView）  这个.findViewById（R.id.tv7）;  
2.         SpannableString ss7 =  new  SpannableString（“下划线” ）;  
3.         ss7.setSpan（new  UnderlineSpan（），  0 ，ss7.length（），  
4.                 Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
5.         tv7.setText（SS7）;  

setSpan方法第一个参数传入新的UnderlineSpan（）即可。

6.在的TextView中设置图片

经常有人会问能不能在的TextView中设置图片，如果能，要怎么设置，其实用SpannableString这个效果很容易实现，我们看看代码：

[java]  查看纯 文本  

打印 ？

1. tv8 =（TextView）  this .findViewById（R.id.tv8）;  
2. SpannableString ss8 =  new  SpannableString（“设置图片” ）;  
3. ss8.setSpan（  
4. // DynamicDrawableSpan.ALIGN_BASELINE表示依照基线对齐  
5. // DynamicDrawableSpan.ALIGN_BOTTOM表示依照底部对齐  
6.         新的 DynamicDrawableSpan（DynamicDrawableSpan.ALIGN_BOTTOM）{  
7.   
8.             @覆盖  
9.             public  Drawable getDrawable（）{  
10.                 Drawable d = getResources（）。getDrawable（  
11.                         R.drawable.ic_launcher）;  
12.                 d.setBounds（0 ，  0 ，  150 ，  150 ）;  
13.                 返回 d  
14.             }  
15.         }，  0 ，  1 ，Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）; //这里的参数0,1表示将“设”字替换为图片  
16. tv8.setText（SS8）;  

setSpan方法的第一个参数传入一个DynamicDrawableSpan对象，其中这个对象的构造函数是图片的对齐方式，一共有两种，如注释，实现该类的getDrawable方法，返回一个可绘制对象即可，注意这里的图片会替换掉文字（如果我们使用这种效果，很多情况下就是要让图片替换掉文字，所以这并不算一个问题），看效果图：

“设”字被图片替换掉了。

7.基于X轴的缩放

对于的TextView中的文本我们也可以执行一些缩放操作，我们看看代码：

[java]  查看纯 文本  

打印 ？

1. tv9 =（TextView）  this .findViewById（R.id.tv9）;  
2. SpannableString ss9 =  new  SpannableString（“基于X轴缩放” ）;  
3. // ScaleXSpan中的参数大于1表示横向扩大，小于1大于0表示缩小，等于1表示正常显示  
4. ss9.setSpan（new  ScaleXSpan（2 ），  0 ，ss9.length（），  
5.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
6. tv9.setText（SS9）;  

只需要在setSpan方法中传入一个ScaleXSpan对象即可，里边参数含义看注释。

效果图如下：

8.设置字体粗体样式

看代码：

[java]  查看纯 文本  

打印 ？

1. tv10 =（TextView）  this .findViewById（R.id.tv10）;  
2.         SpannableString ss10 =  new  SpannableString（“字体样式，粗体，斜体等” ）;  
3.         ss10.setSpan（新 StyleSpan（Typeface.BOLD），  5 ，  7 ，  
4.                 Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
5.         tv10.setText（SS10）;  

效果图：

9.上下标的使用

上下标的使用可以让我们很好的表达一个数学公式，比如完全平方差公式，这次我们先来看看效果图：

不错吧，那么我们再来看看代码实现：

[java]  查看纯 文本  

打印 ？

1. tv11 =（TextView）  this .findViewById（R.id.tv11）;  
2. SpannableString ss11 =  new  SpannableString（“（x1 + x2）2 = x12 + x22 + 2x1x2” ）;  
3. //设置下标  
4. ss11.setSpan（新 SubscriptSpan（），  2 ，  3 ，  
5.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
6. //设置下标字体大小  
7. ss11.setSpan（新 AbsoluteSizeSpan（30 ），  2 ，  3 ，  
8.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
9. ss11.setSpan（新 SubscriptSpan（），  7 ，  8 ，  
10.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
11. ss11.setSpan（新 AbsoluteSizeSpan（30 ），  7 ，  8 ，  
12.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
13. ss11.setSpan（新 SubscriptSpan（），  14 ，  15 ，  
14.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
15. ss11.setSpan（新 AbsoluteSizeSpan（30 ），  14 ，  15 ，  
16.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
17. ss11.setSpan（新 SubscriptSpan（），  18 ，  19 ，  
18.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
19. ss11.setSpan（新 AbsoluteSizeSpan（30 ），  18 ，  19 ，  
20.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
21. ss11.setSpan（新 SubscriptSpan（），  23 ，  24 ，  
22.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
23. ss11.setSpan（新 AbsoluteSizeSpan（30 ），  23 ，  24 ，  
24.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
25. ss11.setSpan（新 SubscriptSpan（），  25 ，  26 ，  
26.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
27. ss11.setSpan（新 AbsoluteSizeSpan（30 ），  25 ，  26 ，  
28.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
29. //设置上标  
30. ss11.setSpan（新 SuperscriptSpan（），  9 ，  10 ，  
31.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
32. ss11.setSpan（新 AbsoluteSizeSpan（30 ），  9 ，  10 ，  
33.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
34. ss11.setSpan（新 SuperscriptSpan（），  15 ，  16 ，  
35.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
36. ss11.setSpan（新 AbsoluteSizeSpan（30 ），  15 ，  16 ，  
37.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
38. ss11.setSpan（新 SuperscriptSpan（），  19 ，  20 ，  
39.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
40. ss11.setSpan（新 AbsoluteSizeSpan（30 ），  19 ，  20 ，  
41.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
42. tv11.setText（SS11）;  

这里代码有点长，不过大部分都是重复的，重要的都有注释，不赘述。

10.设置超链接

SpannableString也可以用来设置超链接，我们看看代码：

[java]  查看纯 文本 打印 ？  

1. tv13 =（TextView）  this .findViewById（R.id.tv13）;  
2. SpannableString ss13 =  new  SpannableString（“ 打电话，发短信，发邮件，打开网页” ）;  
3. ss13.setSpan（新 URLSpan（ “ 电话：13534884482” ），  0 ，  3 ，  
4.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
5. ss13.setSpan（新 URLSpan（“smsto：13534884482” ），  4 ，  7 ，  
6.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
7. ss13.setSpan（新 URLSpan（ “ 电子邮件地址：584991843@qq.com” ），  8 ，  11 ，  
8.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
9. ss13.setSpan（新 URLSpan（“http://www.baidu.com” ），  12 ，  16 ，  
10.         Spanned.SPAN_EXCLUSIVE_EXCLUSIVE）;  
11. tv13.setText（SS13）;  
12. tv13.setMovementMethod（LinkMovementMethod.getInstance（））;  

使用不同的协议可以分别跳转到打电话页面，发短信页面，发邮件页面以及打开网页，我们看看效果图：

好了，关于SpannableString的使用，这里只是给大家提供一个思路，更多的效果还要大家自己去探索，今晚就到这里吧。

演示下载https://github.com/lenve/spannableStringTest