TextView SpannableString 使用之实现可点击超链接效果
TextView SpannableString 使用之實(shí)現(xiàn)可點(diǎn)擊超鏈接效果
如果看到這里說(shuō)明你對(duì) TextView 已經(jīng)有了一定的了解,至少已經(jīng)使用過(guò)該控件顯示文字過(guò)。現(xiàn)在來(lái)實(shí)現(xiàn)一些復(fù)雜一點(diǎn)的效果。
1. 實(shí)現(xiàn)可點(diǎn)擊的超鏈接
我們?cè)贏PP開(kāi)發(fā)過(guò)程中會(huì)遇到這樣的需求,例如:
其中標(biāo)記為下劃線的為可點(diǎn)擊,點(diǎn)擊后一般是跳轉(zhuǎn)一個(gè)網(wǎng)頁(yè)(這個(gè)在這里不做討論)。面對(duì)這樣的需求里可能已經(jīng)知道TextView是可以添加下劃線的,你的實(shí)現(xiàn)可能是:
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]然后為可點(diǎn)擊的 TextView添加下劃線,然后設(shè)置點(diǎn)擊事件就ok了。
如果你滿足于這,那么你可以繼續(xù)往后看,看看只用一個(gè)TextView 如何實(shí)現(xiàn)。
2. 可點(diǎn)擊的超鏈接(基礎(chǔ))
為了介紹 SpannableString,我們來(lái)用它實(shí)現(xiàn)一個(gè)簡(jiǎn)單的下劃線并設(shè)置監(jiān)聽(tīng)點(diǎn)擊事件。
String clickString = "I Love Android!";SpannableString spannableString =new SpannableString(clickString);spannableString.setSpan(new ClickableSpan() {@Overridepublic 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. 多個(gè)可點(diǎn)擊的超鏈接(提高)
這回就要使用一個(gè)新的類(lèi):SpannableStringBuilder。看到名字就知道,它的作用類(lèi)似StringBuilder就是把多個(gè)SpannableString連接起來(lái)。
最后的效果:
點(diǎn)擊效果:
代碼實(shí)現(xiàn)(關(guān)鍵點(diǎn)就是把多個(gè)SpannableString連接起來(lái)):
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() {@Overridepublic void onClick(View widget) {Toast.makeText(getActivity(), linkWord1, Toast.LENGTH_SHORT).show();}@Overridepublic void updateDrawState(TextPaint ds) {super.updateDrawState(ds);ds.setColor(Color.RED); //設(shè)置文件顏色ds.setUnderlineText(true); //設(shè)置下劃線}}, index1, index1 + linkWord1.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);spannableStringBuilder.setSpan(new ClickableSpan() {@Overridepublic void onClick(View widget) {Toast.makeText(getActivity(), linkWord2, Toast.LENGTH_SHORT).show();}@Overridepublic void updateDrawState(TextPaint ds) {super.updateDrawState(ds);ds.setColor(Color.GREEN); //設(shè)置文件顏色ds.setUnderlineText(true); //設(shè)置下劃線}}, index2, index2 + linkWord2.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);spannableStringBuilder.setSpan(new ClickableSpan() {@Overridepublic void onClick(View widget) {Toast.makeText(getActivity(), linkWord3, Toast.LENGTH_SHORT).show();}@Overridepublic void updateDrawState(TextPaint ds) {super.updateDrawState(ds);ds.setColor(Color.BLUE); //設(shè)置文件顏色ds.setUnderlineText(false); //設(shè)置下劃線}}, index3, index3 + linkWord3.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);tv_tip.setTextSize(14);tv_tip.setText(spannableStringBuilder);tv_tip.setMovementMethod(LinkMovementMethod.getInstance());4. 多個(gè)可點(diǎn)擊的超鏈接(html)
當(dāng)然還有另外一種方法,就是使用TextView顯示 html格式的文本,然后處理其中的url,過(guò)程還是類(lèi)似我們上面用到的方法,直接上代碼吧:
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 spansfor (final URLSpan url : urls) {// 設(shè)置Spanstyle.setSpan(new ClickableSpan() {@Overridepublic void onClick(View widget) {Toast.makeText(getActivity(), url.getURL(), Toast.LENGTH_SHORT).show();}@Overridepublic void updateDrawState(TextPaint ds) {super.updateDrawState(ds);ds.setColor(Color.RED); //設(shè)置文件顏色ds.setUnderlineText(true); //設(shè)置下劃線}}, sp.getSpanStart(url), sp.getSpanEnd(url), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);}tv_tip.setText(style);}效果圖:
因?yàn)槲野阉械倪B接都設(shè)置為紅色,所以顯示的都是紅色,實(shí)際中可能進(jìn)行處理,那時(shí)對(duì)每個(gè)url都進(jìn)行處理即可。
這里我沒(méi)有講每個(gè)類(lèi)的細(xì)節(jié),因?yàn)槲矣X(jué)得,如果你知道類(lèi)名,那么你可以查到對(duì)應(yīng)的官方文檔,官方文檔對(duì)api的講解是很詳細(xì)的,但是官方很少會(huì)結(jié)合實(shí)際需求告訴你如何實(shí)現(xiàn),可能某一個(gè)api你不熟悉你就無(wú)法和實(shí)際需求聯(lián)想起來(lái),希望看了 這篇文章想深入了解的可以從 CharSequence 接口(與上面的類(lèi)緊密聯(lián)系)進(jìn)行展開(kāi)。
下一篇講 TextView ImageSpan 實(shí)現(xiàn)文字圖片混排。
轉(zhuǎn)載于:https://www.cnblogs.com/didikee/p/7851260.html
總結(jié)
以上是生活随笔為你收集整理的TextView SpannableString 使用之实现可点击超链接效果的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 20171117-构建之法:现代软件工程
- 下一篇: day05 Spring中自定义注解的用