Android Clickable Span in TextView

Note: You could find chinese version in my chinese blog.


Spannable brings lots of possibility to TextView, includes displaying various appearance of a Text and onClick callbak.

The normal way to make a TextView clickable is to use View.setOnClickListener. It sets a callback listener to the whole view. What if we just want to add callback to a substring of a text?

This pictures demonstrate

• One TextView
• The sub-string has variant color
• The sub-string is clickable

Of course we could use ViewGroup + many TextView to accomplish that, spannable make things eaiser.(maybe....)

We can understand Span in this way: Put extra function to a CharSequence. For example, If I have string 'TheFinalAnswerIs42', I can set Red color to "Final" and make 42 clickable. But the TextView does not know so much things, it only focus on showing the whole string.

We know that TextView only needs CharSequence as its content, and both of Spannable and Spanned are sub-interface of CharSequence. The question becomes 'How to build desired CharSequence'

Android API Documentations tells us that we can use SpannableStringBuilder to generate SpannableString.

Spannable span = (new SpannableStringBuilder()).newSpannable("TheFinalAnswerIs42");
span.setSpan(new ForegroundColorSpan(0xFFFF0000), 3, 5,Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

So the string "Final" becomes red.And we are going to make '42' clickable.

span.setSpan(new MyClickableSpan(), 16, text.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
mTextView.setText(span);
mTextView.setMovementMethod(LinkMovementMethod.getInstance());

MyClickableSpan is to be a implementation of ClickableSpan. All we have to do is override method onClick.

Further question: why setSpan is using primitive class Object but not some interface such as Spanned?

API documentation also tells you that you can bind any your own object as Span to TextView. But how to use my customized span object? To solve this, we should understand how the TextView use ClickableSpan.

The source code of TextView tells us that it handle ClickableSpan in onTouchEvent.

In other words, to handle our customzied span object, we should extends TextView to use CustomizedTextView to accomplish it.