TextView SpannableString 使用之实现可点击超链接效果
TextView SpannableString 使用之实现可点击超链接效果
如果看到这里说明你对 TextView 已经有了一定的了解,至少已经使用过该控件显示文字过。现在来实现一些复杂一点的效果。
1. 实现可点击的超链接
我们在APP开发过程中会遇到这样的需求,例如:
其中标记为下划线的为可点击,点击后一般是跳转一个网页(这个在这里不做讨论)。面对这样的需求里可能已经知道TextView
是可以添加下划线的,你的实现可能是:
By Login, You agree to our Privicy Policy & Terms of use
[TextView]----[TextView]--[TextView]---[TextView]
[By Login, You agree to our ][Privicy Policy][ & ][Terms of use]
然后为可点击的 TextView
添加下划线,然后设置点击事件就ok了。
如果你满足于这,那么你可以继续往后看,看看只用一个TextView 如何实现。
2. 可点击的超链接(基础)
为了介绍 SpannableString
,我们来用它实现一个简单的下划线并设置监听点击事件。
String clickString = "I Love Android!";
SpannableString spannableString =new SpannableString(clickString);
spannableString.setSpan(new ClickableSpan() {
@Override
public void onClick(View widget) {
Toast.makeText(getActivity(),"Love",Toast.LENGTH_SHORT).show();
}
},2,6,Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
tv_tip.setText(spannableString);
tv_tip.setMovementMethod(LinkMovementMethod.getInstance());
3. 多个可点击的超链接(提高)
这回就要使用一个新的类:SpannableStringBuilder
。看到名字就知道,它的作用类似StringBuilder
就是把多个SpannableString
连接起来。
最后的效果:
点击效果:
代码实现(关键点就是把多个SpannableString
连接起来):
final String linkWord1 = "Android";
final String linkWord2 = "Are you ok?";
final String linkWord3 = "think you!";
String word = "Hello " + linkWord1 + "," + linkWord2 + " I'm fine," + linkWord3;
SpannableStringBuilder spannableStringBuilder = new SpannableStringBuilder(word);
int index1 = word.indexOf(linkWord1);
int index2 = word.indexOf(linkWord2);
int index3 = word.indexOf(linkWord3);
spannableStringBuilder.setSpan(new ClickableSpan() {
@Override
public void onClick(View widget) {
Toast.makeText(getActivity(), linkWord1, Toast.LENGTH_SHORT).show();
}
@Override
public void updateDrawState(TextPaint ds) {
super.updateDrawState(ds);
ds.setColor(Color.RED); //设置文件颜色
ds.setUnderlineText(true); //设置下划线
}
}, index1, index1 + linkWord1.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
spannableStringBuilder.setSpan(new ClickableSpan() {
@Override
public void onClick(View widget) {
Toast.makeText(getActivity(), linkWord2, Toast.LENGTH_SHORT).show();
}
@Override
public void updateDrawState(TextPaint ds) {
super.updateDrawState(ds);
ds.setColor(Color.GREEN); //设置文件颜色
ds.setUnderlineText(true); //设置下划线
}
}, index2, index2 + linkWord2.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
spannableStringBuilder.setSpan(new ClickableSpan() {
@Override
public void onClick(View widget) {
Toast.makeText(getActivity(), linkWord3, Toast.LENGTH_SHORT).show();
}
@Override
public void updateDrawState(TextPaint ds) {
super.updateDrawState(ds);
ds.setColor(Color.BLUE); //设置文件颜色
ds.setUnderlineText(false); //设置下划线
}
}, index3, index3 + linkWord3.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
tv_tip.setTextSize(14);
tv_tip.setText(spannableStringBuilder);
tv_tip.setMovementMethod(LinkMovementMethod.getInstance());
4. 多个可点击的超链接(html)
当然还有另外一种方法,就是使用TextView
显示 html
格式的文本,然后处理其中的url
,过程还是类似我们上面用到的方法,直接上代码吧:
String html = "<p>\n" +
" Hello <a href=\"/link/click1\">Android</a>,<a href=\"/link/click2\">Are you ok?</a>I'm fine,<a href=\"/link/click3\">think you!</a>\n" +
" </p>";
tv_tip.setText(Html.fromHtml(html));
tv_tip.setMovementMethod(LinkMovementMethod.getInstance());
CharSequence text = tv_tip.getText();
if (text instanceof Spannable) {
int end = text.length();
Spannable sp = (Spannable) tv_tip.getText();
URLSpan[] urls = sp.getSpans(0, end, URLSpan.class);
SpannableStringBuilder style = new SpannableStringBuilder(text);
style.clearSpans(); // should clear old spans
for (final URLSpan url : urls) {
// 设置Span
style.setSpan(new ClickableSpan() {
@Override
public void onClick(View widget) {
Toast.makeText(getActivity(), url.getURL(), Toast.LENGTH_SHORT).show();
}
@Override
public void updateDrawState(TextPaint ds) {
super.updateDrawState(ds);
ds.setColor(Color.RED); //设置文件颜色
ds.setUnderlineText(true); //设置下划线
}
}, sp.getSpanStart(url), sp.getSpanEnd(url), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
}
tv_tip.setText(style);
}
效果图:
因为我把所有的连接都设置为红色,所以显示的都是红色,实际中可能进行处理,那时对每个url
都进行处理即可。
这里我没有讲每个类的细节,因为我觉得,如果你知道类名,那么你可以查到对应的官方文档,官方文档对api的讲解是很详细的,但是官方很少会结合实际需求告诉你如何实现,可能某一个api你不熟悉你就无法和实际需求联想起来,希望看了 这篇文章想深入了解的可以从 CharSequence 接口(与上面的类紧密联系)进行展开。
下一篇讲 TextView ImageSpan 实现文字图片混排。
TextView SpannableString 使用之实现可点击超链接效果的更多相关文章
- TextView中的部分文字响应点击事件
TextView是android常用的控件,经常要显示不同文字的大小,颜色,......今天要实现这样这样一个需求,TextView某段内容显示的文字颜色不一样,并且点击区域只能是改变了颜色的字. 1 ...
- 浅谈ClickableSpan , 实现TextView文本某一部分文字的点击响应
超文本:http://www.baidu.com 这么一个效果:一行文本当中 前面显示黑色颜色的“超文本:”,后面显示红色颜色的“http://www.baidu.com” 并且要求红色字体的部分可以 ...
- Android Material适配 为控件设置指定背景色和点击波纹效果
Android Material适配 为控件设置指定背景色和点击波纹效果,有需要的朋友可以参考下. 大部分时候,我们都需要为控件设置指定背景色和点击效果 4.x以下可以使用selector,5.0以上 ...
- TextView字体,行距,html格式,超链接,最大长度的设定
颜色,大小 <!-- 设置字体的大小,推荐用sp做单位:字体颜色以#开头 --> <TextView android:id="@+id/textView1" an ...
- TextView字体,行距,html格式,超链接,对大长度的设定
颜色,大小 <span style="font-size:18px;"> <!-- 设置字体的大小,推荐用sp做单位:字体颜色以#开头 --> <Te ...
- Waves – 赞!超炫交互体验的点击动画效果
Waves 点击效果的灵感来自于谷歌的材料设计,很容易使用.只需要引入 waves.min.css 和 waves.min.js 到 HTML 文件中可以使用了.采用 touchstart 与 tou ...
- Outlook 2013 在邮件里面点击超链接时弹出“组织策略阻止我们为您完成此操作”
现象描叙: 在Outlook在邮件里面点击超链接时,打不开超链接页面,弹出如下提示: 这个是因为之前安装了其它浏览器(例如,我安装了360的浏览器),并且设置为了默认浏览器,后来卸载了该浏览器 ...
- JavaScript或jQuery模拟点击超链接和按钮
有时候我们需要页面自动点击超链接或者按钮,可以用js或者jQuery利用程序去点击,方法很简单,按钮或超链接代码如下: <a href="url" target=" ...
- iOS UIButton加在window上点击无效果问题
UIButton加在window上,点击没有效果,找了很久,原来是没有加上这名:[self.window makeKeyAndVisible]; self.window = [[UIWindow al ...
随机推荐
- Block使用的简单总结
一.Block简单的使用 1.block当作参数来传递 如下定义一个没有返回值无参数的block,并把它作为参数,让系统调用,注意:这里是系统在调用,不是我们调用 那么为什么需要把block当作参数去 ...
- C#中的原子操作Interlocked,你真的了解吗?
阅读目录 背景 代码描述 越分析越黑暗 结语 一.背景 这个标题起的有点标题党的嫌疑[捂脸],这个事情的原委是这样的,有个Web API的站点在本地使用Release模式Run的时候出现问题,但是使用 ...
- 即时通信系统Openfire分析之八:集群管理
前言 在第六章<路由表>中,客户端进行会话时,首先要获取对方的Session实例.获取Session实例的方法,是先查找本地路由表,若找不到,则通过路由表中的缓存数据,由定位器获取. 路由 ...
- 在SQL Server中实现关系模型的阶梯到级别3的t -SQL DML
在SQL Server中实现关系模型的阶梯到级别3的t -SQL DML 格雷戈里·拉森(Gregory Larsen),2017/08/02(第一次出版:2011 /11/09) 原文链接:http ...
- IDEA启动后页面没有tomcat server选项,显示灰色问号和红叉不能使用
说明:自己好几次硬盘莫名其妙读不出来导致电脑重启后idea没有了tomcat选项,原来的tomcat上显示灰色的问号和红色小叉子,网上搜了好久加上自己摸索,终于解决了.现在记一下也分享一下,省的下回又 ...
- 【转】浅谈UML的概念和模型之UML九种图
原文地址:浅谈UML的概念和模型之UML九种图 目录: UML的视图 UML的九种图 UML中类间的关系 上文我们介绍了,UML的视图,在每一种视图中都包含一个或多种图.本文我们重点讲解UML每种图的 ...
- Windows NT 之父 - David Cutler
David Cutler,大卫·卡特勒,一位传奇程序员,1988年去微软前号称硅谷最牛的内核开发人员,是VMS和Windows NT的首席设计师,被人们成为“操作系统天神”.他曾供职于杜邦.DEC等公 ...
- C# AOP 面向切面编程之 调用拦截
有时候我们需要在代码中对方法调用进行拦截,并修改参数和返回值,这种操作叫做AOP(面向切面编程) 不过需要注意的是,AOP的效率很慢,在需要高效率场合慎用. 以下是C#的AOP方法: 首先建立一个控制 ...
- Java基础-Eclipse环境搭建(02)
Eclipse工具 IDE(Integrated Development Environment)集成开发环境集成了编写功能,分析功能,编译功能一体化的开发软件. 调试功能等,其中编译在保存时运行(即 ...
- 【译】10分钟学会Pandas
十分钟学会Pandas 这是关于Pandas的简短介绍主要面向新用户.你可以参考Cookbook了解更复杂的使用方法 习惯上,我们这样导入: In [1]: import pandas as pd I ...