TextView显示(不同大小的,颜色)富文本

在开发过程中有时会遇到TextView显示的字符串会有不同颜色和不同大小

微信图片_20170928103150.png

下面通过两种方法给大家介绍一下:

1.html类:

<a href="...">创建超文本链接

<b>黑体字

<big>字体加大

<blockquote>从两边缩进文本


换行 插入换行符

<cite>引用,通常是斜体

<dfn>述语定义

<div align="...">用来排版大块HTML段落,也用于格式化表

<em>强调文本(通常是斜体加黑体)

<font size="..."color="..."
face="...">设置字体大小从1到7,颜色使用名字或RGB的十六进制值

<h1>至<h6>标题

<i>斜体字

图片

<p>创建一个段落

<small>字体缩小

<strike>加删除线

<strong>加重文本(通常是斜体加黑体)

下标字

上标字

<tt>打字机风格的字体

<u>下划线
上面是一下属性也都有解释了,接下来我们看一下代码:

//若是仅在布局文件中引用,可以把HTML格式字符串写到strings文件中,但要注意,很多很多格式都是不支持的!
//getString(方法)得到的是没有任何格式的字符串,所以若是在代码中设置,就不能把HTML格式字符串写到strings文件中
txt1.setText(Html.fromHtml("得到的是没有任何格式的字符串"));
//建议直接在代码中定义并使用。注意双引号要加转义字符
String html = "<html>|<i>  引用  </i>|<font color=\"#aabb00\">   values/  </font>|<font color=\"RED\">  strings  </font>|<strong>  中的  </strong>|<em>  html  </em>|<strike>  格式的  </strike>|<u>  字符串  </u>|<h3>  但是  </h3>|<big>  很多  </big>|<small>  格式  </small>|<b>  都  </b>| <sub>  不  </sub>|<tt>  支持  </tt>|</html>";
txt2.setText(Html.fromHtml(html));
String html2 = "<a href=\"http://www.baidu.com\">代码中支持超链接</a>    <font color=\"#aabb00\">支持设置颜色</font>";
txt3.setMovementMethod(LinkMovementMethod.getInstance());
txt4.setText(Html.fromHtml(html2));

这就是我们的前四行代码还是很简单的,再看一下图片的:

Html.ImageGetter imageGetter = new Html.ImageGetter() {
    public Drawable getDrawable(String source) {
        int rId = Integer.parseInt(source);
        Drawable drawable = getResources().getDrawable(rId);
        drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
        return drawable;
    }
};
String sText = "drawable中的图片:<img src=\"" + R.mipmap.ic_launcher + "\" />";
txt5.setText(Html.fromHtml(sText, imageGetter, null));

这个就是显示资源文件中的图片,也是很简单。如果我们要设置简单的富文本完全可以采用这种方式。
2.SpannableString或SpannableStringBuilder

SpannableString:这是一个文本的类,其内容是不可变的,但可以附加和分离标记

1.设置样式:

setSpan(Object what, int start, int end, int flags)
what
表示设置的样式,start
表示需要设置格式的子字符串的起始下标,end
表示终了下标,flag
表示子字符串是否包含开始或结束端点
flag属性

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]

  1. 常见样式

ForegroundColorSpan
:为文本设置前景色
BackgroundColorSpan
:为文本设置文本背景色
RelativeSizeSpan
:为文本设置相对大小,在TextView原有的文字大小的基础上,相对设置文字大小
StrikethroughSpan
:为文本设置中划线,也就是常说的删除线
UnderlineSpan
:为文本设置下划线
SuperscriptSpan
:为文本设置上标,可以配合RelativeSizeSpan做数学公式中的上标
SubscriptSpan
:为文本设置下标
StyleSpan
:为文本设置(粗体、斜体)风格
ImageSpan
:将文本替换为图片
ClickableSpan
:为文本设置点击事件

URLSpan
:为文本设置超链接

上面这部分是设置属性,接下来看一下代码:

SpannableString spannableString = new SpannableString("前景色背景色相对大小删除线下划线" +
        "上标小上标下标粗体斜体显示图片点击超链接");

ForegroundColorSpan foregroundColorSpan = new ForegroundColorSpan(Color.parseColor("#0099EE"));
BackgroundColorSpan backgroundColorSpan = new BackgroundColorSpan(Color.parseColor("#AC00FF30"));
RelativeSizeSpan relativeSizeSpan = new RelativeSizeSpan(2f);
StrikethroughSpan strikethroughSpan = new StrikethroughSpan();
UnderlineSpan underlineSpan = new UnderlineSpan();
SuperscriptSpan superscriptSpan = new SuperscriptSpan();
RelativeSizeSpan relativeSizeSpan2 = new RelativeSizeSpan(0.5f);
SubscriptSpan subscriptSpan = new SubscriptSpan();
StyleSpan styleSpan_B = new StyleSpan(Typeface.BOLD);
StyleSpan styleSpan_I = new StyleSpan(Typeface.ITALIC);

ImageSpan imageSpan = new ImageSpan(this, R.mipmap.ic_launcher);
ClickableSpan clickableSpan = new ClickableSpan() {
    @Override
    public void onClick(View widget) {
        Toast.makeText(MainActivity.this, "点击", Toast.LENGTH_SHORT).show();
    }

    @Override
    public void updateDrawState(TextPaint ds) {
        // 文字不变色
        ds.setUnderlineText(false);
    }
};
URLSpan urlSpan = new URLSpan("http://www.baidu.com");

spannableString.setSpan(foregroundColorSpan, 0, 3, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(backgroundColorSpan, 3, 6, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(relativeSizeSpan, 6, 10, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(strikethroughSpan, 10, 13, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(underlineSpan, 13, 16, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(superscriptSpan, 16, 21, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(relativeSizeSpan2, 18, 21, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(subscriptSpan, 21, 23, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(styleSpan_B, 23, 25, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(styleSpan_I, 25, 27, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(imageSpan, 29, 31, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(clickableSpan, 31, 33, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);
spannableString.setSpan(urlSpan, 33, 36, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);


txt.setMovementMethod(LinkMovementMethod.getInstance());
txt.setText(spannableString);

相对来说,自己更喜欢这种方式。感觉比html好理解,而且没有那么多标签。
补充:
SpannableStringBuilder:这是文本的类,其内容和标记都可以更改。
增加了类似于StringBuilder的append等方法,可以修改原来的字符串跟样式

SpannableStringBuilder builder = new SpannableStringBuilder("SpannableStringBuilder:这是文本的类,其内容和标记都可以更改。");builder.setSpan(foregroundColorSpan, 0, 3, Spanned.SPAN_INCLUSIVE_EXCLUSIVE);builder.append("lalala");//千万不要tostring();
spanBuilder.setText(builder);

本篇文章到此就结束了,希望对大家有帮助。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,126评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,254评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,445评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,185评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,178评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,970评论 1 284
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,276评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,927评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,400评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,883评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,997评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,646评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,213评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,204评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,423评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,423评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,722评论 2 345

推荐阅读更多精彩内容