Android Spanned实现TextView富文本效果(1)--文字

1.首先实例化一个Spannable对象

SpannableString spannableString = new SpannableString("字体测试字体大小一半两倍前景色背景色正常粗体斜体粗斜体下划线删除线x1x2电话邮件网站短信彩信地图X轴综合/bot");

我们需要创建一个SpannableString或SpannableStringBuilder,它们的区别在于 SpannableString像一个String一样,构造对象的时候传入一个String,之后再无法更改String的内容,也无法拼接多个 SpannableString;而SpannableStringBuilder则更像是StringBuilder,它可以通过其append()方法来拼接多个String。

2.public void setSpan (Object what, int start, int end, int flags)

  • what传入各种Span类型的实例
  • start和end标记要替代的文字内容的范围
  • flags是用来标识在 Span 范围内的文本前后输入新的字符时是否把它们也应用这个效果

第一个参数可以使用的主要几种Span类型为

  • ImageSpan 可以使用图片替换文字达到图文混排的效果,例如在微信中文字和表情一起发的状态

    • 使用方法

    Drawabledrawable=mContext.getResources().getDrawable(R.drawable.new_topic_drawable);
    drawable.setBounds(0,0,drawable.getIntrinsicWidth(),drawable.getIntrinsicHeight());
    ImageSpan imageSpan = new ImageSpan(drawable, ImageSpan.ALIGN_BASELINE);
    spanString.setSpan(imageSpan,spanString.length()-1,spanString.length(),Spannable.SPAN_INCLUSIVE_INCLUSIVE);

  • ForegroundColorSpan 设置文字前景色,即文字本身的颜色
    • spanString.setSpan(new ForegroundColorSpan(Color.parseColor("#f74224")), 0,titleText.length(), Spannable.SPAN_INCLUSIVE_INCLUSIVE);
  • AbsoluteSizeSpan 设置文字的绝对大小值,参数是绝对数值
    • spanString.setSpan(new AbsoluteSizeSpan(11),0,spanString.length(),titleText.length(), Spannable.SPAN_INCLUSIVE_INCLUSIVE);
  • RelativeSizeSpan(float proportion) 设置字体大小,参数是相对于默认字体大小的倍数。
  • UrlSpan 设置超链接
    • URLSpan span = new URLSpan("tel:0123456789");
    • spanString.setSpan(span, 0, 3, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
  • BackgroundColorSpan 设置文字背景色
    • BackgroundColorSpan span = new BackgroundColorSpan(Color.YELLOW);
    • spanString.setSpan(span, 0, 3, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
  • StyleSpan 字体设置
    • StyleSpan span = new StyleSpan(Typeface.BOLD_ITALIC);
    • spanString.setSpan(span, 0, 2, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
    • Typeface中有四个Style常量,分别是BOLD粗体、ITALIC斜体、BOLD_ITALIC粗斜体、NORMAL正常
  • StrikethroughSpan 删除线
    • StrikethroughSpan span = new StrikethroughSpan();spanString.setSpan(span, 0, 3, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
  • UnderlineSpan 下划线
    • UnderlineSpan span = new UnderlineSpan();
    • spanString.setSpan(span, 0, 3, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);

在具体实践中可以对同一范围内的文字叠加不同的span,如文字的大小和文字的颜色可以叠加使用,可以组合出不同的效果

第二,三个参数 (int start, int end)

这里是指个性化匹配的位置:这里有很多种方式去实现,例如直接写死位置,也可以和String类的一些方法配合使用,比如:indexOf(),也可以写个正则匹配方法,如果要匹配多次可以把这些匹配存入一个Map集合

第四个参数Spanned.SPAN_EXCLUSIVE_EXCLUSIVE的意义:

标识在 Span 范围内的文本前后输入新的字符时是否把它们也应用这个效果

  • Spanned.SPAN_EXCLUSIVE_EXCLUSIVE(前后都不包括)
  • Spanned.SPAN_INCLUSIVE_EXCLUSIVE(前面包括,后面不包括)
  • Spanned.SPAN_EXCLUSIVE_INCLUSIVE(前面不包括,后面包括)
  • Spanned.SPAN_INCLUSIVE_INCLUSIVE(前后都包括)

3.将SpannableString设置到TextView

mTextView.setText(msp);

4.最后调用.setMovementMethod,此方法在需要响应用户事件时使用,如点击一个电话号码就跳转到拨号页面。如果不执行这个方法是不会响应事件的,即便文本看着已经是下划线蓝色字了。

mTextView.setMovementMethod(LinkMovementMethod.getInstance()); 

参考链接

http://blog.csdn.net/xijiaohuangcao/article/details/7839856

http://www.cnblogs.com/lichenwei/p/4411607.html

另外几种给TextView加上效果的方法

http://aichixihongshi.iteye.com/blog/1207503

下面附上两段完整代码展示用法

     /**
     * 在Android里提供了许多个性化TextView内容的工具类, 使用这些类可以代替常规String。
     * android.text.Spanned
     * android.text.SpannableString
     * android.text.SpannableStringBuilder
     *
     * 由于Spannable等类最终都实现了CharSequence接口,所以可以直接把SpannableString和SpannableStringBuilder通过TextView.setText()设置给TextView。
     */

    //实例化一个Spannable对象
    SpannableString spannableString = new SpannableString(info);
    //通过setSpan()方法可以用来定义不同的样式内容
    //设置字体
    //方式一:直接定位
    spannableString.setSpan(new ForegroundColorSpan(Color.BLUE), 0, 8, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    //方式二:配合String工具类定位
    spannableString.setSpan(new ForegroundColorSpan(Color.BLUE), info.indexOf("@"), info.indexOf(" "), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    //方式三,利用正则表达式匹配定位
    Map map = getHttpPostion();
    spannableString.setSpan(new ForegroundColorSpan(Color.BLUE), map.get("start"), map.get("end"), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

    //设置字体大小
    spannableString.setSpan(new RelativeSizeSpan((float) 1.5), map.get("start"), info.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    //设置图片表情
    Drawable drawable = getResources().getDrawable(R.mipmap.ic_launcher);
    drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
    spannableString.setSpan(new ImageSpan(drawable), info.indexOf("["), info.indexOf("]") + 1, Spanned.SPAN_INCLUSIVE_INCLUSIVE);

    textView.setText(spannableString);
}

public Map getHttpPostion() {
    Map map = new HashMap();
    Pattern pattern = Pattern.compile("http:.*");
    Matcher matcher = pattern.matcher(info);
    if (matcher.find()) {
        map.put("start", matcher.start());
        map.put("end", matcher.end());
    }
    return map;

}

第二段

 mTextView = (TextView) findViewById(R.id.tv_link);

    //创建一个 SpannableString对象
    msp = new SpannableString("字体测试字体大小一半两倍前景色背景色正常粗体斜体粗斜体下划线删除线x1x2电话邮件网站短信彩信地图X轴综合/bot");

    //设置字体(default,default-bold,monospace,serif,sans-serif)
    msp.setSpan(new TypefaceSpan("monospace"), 0, 2, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    msp.setSpan(new TypefaceSpan("serif"), 2, 4, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

    //设置字体大小(绝对值,单位:像素)
    msp.setSpan(new AbsoluteSizeSpan(20), 4, 6, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    msp.setSpan(new AbsoluteSizeSpan(20, true), 6, 8, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);  //第二个参数boolean dip,如果为true,表示前面的字体大小单位为dip,否则为像素,同上。

    //设置字体大小(相对值,单位:像素) 参数表示为默认字体大小的多少倍
    msp.setSpan(new RelativeSizeSpan(0.5f), 8, 10, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);  //0.5f表示默认字体大小的一半
    msp.setSpan(new RelativeSizeSpan(2.0f), 10, 12, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);  //2.0f表示默认字体大小的两倍

    //设置字体前景色
    msp.setSpan(new ForegroundColorSpan(Color.MAGENTA), 12, 15, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);  //设置前景色为洋红色

    //设置字体背景色
    msp.setSpan(new BackgroundColorSpan(Color.CYAN), 15, 18, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);  //设置背景色为青色

    //设置字体样式正常,粗体,斜体,粗斜体
    msp.setSpan(new StyleSpan(android.graphics.Typeface.NORMAL), 18, 20, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);  //正常
    msp.setSpan(new StyleSpan(android.graphics.Typeface.BOLD), 20, 22, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);  //粗体
    msp.setSpan(new StyleSpan(android.graphics.Typeface.ITALIC), 22, 24, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);  //斜体
    msp.setSpan(new StyleSpan(android.graphics.Typeface.BOLD_ITALIC), 24, 27, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);  //粗斜体

    //设置下划线
    msp.setSpan(new UnderlineSpan(), 27, 30, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

    //设置删除线
    msp.setSpan(new StrikethroughSpan(), 30, 33, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

    //设置上下标
    msp.setSpan(new SubscriptSpan(), 34, 35, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);     //下标
    msp.setSpan(new SuperscriptSpan(), 36, 37, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);   //上标

    //超级链接(需要添加setMovementMethod方法附加响应)
    msp.setSpan(new URLSpan("tel:4155551212"), 37, 39, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);     //电话
    msp.setSpan(new URLSpan("mailto:[email protected]"), 39, 41, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);     //邮件
    msp.setSpan(new URLSpan("http://www.baidu.com"), 41, 43, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);     //网络
    msp.setSpan(new URLSpan("sms:4155551212"), 43, 45, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);     //短信   使用sms:或者smsto:
    msp.setSpan(new URLSpan("mms:4155551212"), 45, 47, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);     //彩信   使用mms:或者mmsto:
    msp.setSpan(new URLSpan("geo:38.899533,-77.036476"), 47, 49, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);     //地图

    //设置字体大小(相对值,单位:像素) 参数表示为默认字体宽度的多少倍
    msp.setSpan(new ScaleXSpan(2.0f), 49, 51, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE); //2.0f表示默认字体宽度的两倍,即X轴方向放大为默认字体的两倍,而高度不变

    //设置字体(依次包括字体名称,字体大小,字体样式,字体颜色,链接颜色)
    ColorStateList csllink = null;
    ColorStateList csl = null;
    XmlResourceParser xppcolor=getResources().getXml (R.color.color);
    try {
        csl= ColorStateList.createFromXml(getResources(),xppcolor);
    }catch(XmlPullParserException e){
        e.printStackTrace();
    }catch(IOException e){
        e.printStackTrace();
    }

    XmlResourceParser xpplinkcolor=getResources().getXml(R.color.linkcolor);
    try {
        csllink= ColorStateList.createFromXml(getResources(),xpplinkcolor);
    }catch(XmlPullParserException e){
        e.printStackTrace();
    }catch(IOException e){
        e.printStackTrace();
    }
    msp.setSpan(new TextAppearanceSpan("monospace",android.graphics.Typeface.BOLD_ITALIC, 30, csl, csllink), 51, 53, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

    //设置项目符号
    msp.setSpan(new BulletSpan(android.text.style.BulletSpan.STANDARD_GAP_WIDTH, Color.GREEN), 0, msp.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE); //第一个参数表示项目符号占用的宽度,第二个参数为项目符号的颜色

    //设置图片
    Drawable drawable = getResources().getDrawable(R.drawable.icon);
    drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
    msp.setSpan(new ImageSpan(drawable), 53, 57, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

    mTextView.setText(msp);
    mTextView.setMovementMethod(LinkMovementMethod.getInstance());

下面还有高仿新浪微博的效果,下次再看
http://www.tuicool.com/articles/aIFZf2e

附上属性

  • BackgroundColorSpan 背景色
  • ClickableSpan 文本可点击,有点击事件
  • ForegroundColorSpan 文本颜色(前景色)
  • MaskFilterSpan 修饰效果,如模糊(BlurMaskFilter)、浮雕(EmbossMaskFilter)
  • MetricAffectingSpan 父类,一般不用
  • RasterizerSpan 光栅效果
  • StrikethroughSpan 删除线(中划线)
  • SuggestionSpan 相当于占位符
  • UnderlineSpan 下划线
  • AbsoluteSizeSpan 绝对大小(文本字体)
  • DynamicDrawableSpan 设置图片,基于文本基线或底部对齐。
  • ImageSpan 图片
  • RelativeSizeSpan 相对大小(文本字体)
  • ReplacementSpan 父类,一般不用
  • ScaleXSpan 基于x轴缩放
  • StyleSpan 字体样式:粗体、斜体等
  • SubscriptSpan 下标(数学公式会用到)
  • SuperscriptSpan 上标(数学公式会用到)
  • TextAppearanceSpan 文本外貌(包括字体、大小、样式和颜色)
  • TypefaceSpan 文本字体
  • URLSpan 文本超链接

你可能感兴趣的:(Android)