Day3.2--Android简单UI控件之TextView的高级使用--SpannableString的使用

上节课，介绍了TextView的简单使用，包括在xml文件静态设置TextView的属性和文本内容信息， 以及在java代码中动态的改变一个TextView所要显示的内容。掌握了基本使用之后，我们来看一下TextView的其它高大上的使用方式。 首先我们来看一张图片，如下图：

如上图所示：

第一行文字中包含一个带有超链接的文本信息

第二行文字中包含一个带下划线的文本信息

第三行文字中包含一个机器人图片

第四行和第五行文字中分别包含一个带下标和上标的文本信息

如果要使用TextView实现以上功能，必须再引入一个新的概念－－SpannableString： 官方文档对SpannableString做出的解释是一个不可变的字符串，但是可以在此字符串的基础上添加其他的对象属性。通俗来讲，就是可以将一系列字符串映射成一个超链接、图片等等。接下来看一下具体如何使用：

package com.danny_jiang.utils;

import android.graphics.drawable.Drawable;
import android.text.Spannable;
import android.text.SpannableString;
import android.text.style.ImageSpan;
import android.text.style.SubscriptSpan;
import android.text.style.SuperscriptSpan;
import android.text.style.URLSpan;
import android.text.style.UnderlineSpan;

/**
 * 
 * @author Danny_姜
 * 此工具类封装了获取各种文本信息映射的方法， 比如：
 * 1、超链接文本
 * 2、图片文本
 * 3、带下划线的文本
 * 4、自带上标、下标的文本
 *
 */
public class SpanStringUtils {

/**
 * 获取文本信息的超链接映射
 * 
 * @param text
 *            链接地址的文字显示内容,如“超链接”
 * @param url
 *            具体链接地址， 如“http://www.baidu.com”
 * @return
 */
public static SpannableString getLinkSpan(String text, String url) {
SpannableString spanString = new SpannableString(text);
URLSpan span = new URLSpan(url);
spanString.setSpan(span, 0, spanString.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
return spanString;
}

/**
 * 获取需要添加下划线的SpannableString
 * @param text
 * 需要添加下划线的文本信息
 */
public static SpannableString getUnderLineSpan(String text) {
SpannableString spanString = new SpannableString(text);
UnderlineSpan span = new UnderlineSpan();
spanString.setSpan(span, 0, text.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
return spanString;
}

/**
 * 获取文本信息的图片映射
 * @param drawable
 * 文本信息所需要映射成的图片Drawable对象
 */
public static SpannableString getImageSpan(Drawable drawable) {
SpannableString spanString = new SpannableString(" ");
drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
ImageSpan span = new ImageSpan(drawable, ImageSpan.ALIGN_BASELINE);
spanString.setSpan(span, 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
return spanString;
}

/**
 * 添加文本信息的下标映射
 * @param text
 * 需要添加下标映射的文本信息
 */
public static SpannableString getSubscript(String text) {
SpannableString spanString = new SpannableString(text);
spanString.setSpan(new SubscriptSpan(), text.length() - 1, text.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
return spanString;
}

/**
 * 添加文本信息的上标映射
 * @param text
 * 需要添加上标映射的文本信息
 */
public static SpannableString getSuperscript(String text) {
SpannableString spanString = new SpannableString(text);
spanString.setSpan(new SuperscriptSpan(), text.length() - 1, text.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
return spanString;
}

}

以上工具类封装了几种常用的SpannableString，分别可以将一定的String字符串映射成超链接文本、图片、自带下划线、上下标等。接下来看xml布局文件中的代码：

    xmlns:tools="http://schemas.android.com/tools"
    android:layout_
    android:layout_
    android:orientation="vertical" >

            android:id="@+id/text_LinkSpan"
        android:layout_
        android:layout_
        android:text="演示文本链接" />
    
            android:id="@+id/text_UnderlineSpan"
        android:layout_
        android:layout_
        android:text="演示带下划线文本" />
    
            android:id="@+id/text_ImageSpan"
        android:layout_
        android:layout_
        android:text="演示图片文本信息" />
    
            android:id="@+id/text_SubscriptSpan"
        android:layout_
        android:layout_
        android:text="演示带下标的文本信息" />
    
            android:id="@+id/text_SuperscriptSpan"
        android:layout_
        android:layout_
        android:text="演示带上标的文本信息" />

可以看到，在xml文件中定义了5个TextView分别用来演示相应的效果， 最后在MainActivity.java中初始化这5个Activity，并设置SpannableString，代码如下：

private void initTextViews() {

// 演示超链接文本信息
TextView linkText = (TextView) findViewById(R.id.text_LinkSpan);
SpannableString linkSpan = SpanStringUtils.getLinkSpan("超链接", "http://www.baidu.com");
linkText.append(linkSpan);
linkText.setMovementMethod(new LinkMovementMethod());

// 演示带下划线的文本信息
TextView underLineText = (TextView) findViewById(R.id.text_UnderlineSpan);
SpannableString underLineSpan = SpanStringUtils.getUnderLineSpan("带下划线文本");
underLineText.append(underLineSpan);

// 演示图片文本信息
TextView imageText = (TextView) findViewById(R.id.text_ImageSpan);
Drawable drawable = getResources().getDrawable(R.drawable.ic_launcher);
SpannableString imageSpan = SpanStringUtils.getImageSpan(drawable);
imageText.append(imageSpan);

// 演示带下标文本信息
TextView subscriptText = (TextView) findViewById(R.id.text_SubscriptSpan);
SpannableString subTextSpan = SpanStringUtils.getSubscript("abc2");
subscriptText.append(subTextSpan);

// 演示带下标文本信息
TextView superScriptText = (TextView) findViewById(R.id.text_SuperscriptSpan);
SpannableString superTextSpan = SpanStringUtils.getSuperscript("abc2");
superScriptText.append(superTextSpan);
}

最后运行效果如下图所示：