Using RichText on Android. Spannable

Hi Habrastvo! This article is about using Spannable in Android. It is intended for styling text. If you are interested in how to implement something like this:



then welcome to cat. This article is aimed at developers who do not have much development experience for Android.

Theory

Spannable is an interface that describes marking plain text with certain objects. The task of these objects is to assign a certain part of the text to a certain style. These tagging objects can be instances of classes that implement the ParcelableSpan interface . Marking is added by:

Spannable.setSpan(Object span, int start, int end, int flags);

Removal, respectively, by the method:

Spannable.removeSpan(Object span);

There are few theories, let's go straight to practice.

Practice

To learn the practice, you must create an android project or open an existing one. I created a clean project, I placed one TextView on the main activity . We go to the method where we will initialize our TextView (I have onCreate ) and add the following text:

// Create spannable text and set style.
Spannable text = new SpannableString("This is underline and bold text.");
text.setSpan(new UnderlineSpan(), 8, 17, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
text.setSpan(new StyleSpan(Typeface.BOLD), 22, 26, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
// Set spannable text in TextView.
TextView textView = (TextView) findViewById(R.id.text);
textView.setText(text);

So, let's see what we wrote. SpannableString - a class that implements the Spannable interface (other implementations can be found on the official documentation website ). UnderlineSpan - implementation of ParcelableSpan, marks part of the text as underlined (in our example, it is from the 8th to the 17th letter). The Spanned.SPAN_EXCLUSIVE_EXCLUSIVE flag indicates that our span will not expand to insert text to the left or right of the marked part. (All flags can be found on the official website, when working with readonly texts they are not so important).

Also here we used another implementation of ParcelableSpan - StyleSpan. As you may have guessed, it can be used to mark text as bold ( Typeface.BOLD ) or italics ( Typeface.ITALIC ).

We figured out the code, we launch our project and look at the result. The text should look like this:



Well, let's move on: add a button to our activity, and the following text in the initializing method:

// Create spannable text and set style.
Spannable buttonText = new SpannableString("Italic text");
buttonText.setSpan(new StyleSpan(Typeface.ITALIC), 0, 6, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
// Set spannable text in TextView.
Button button = (Button) findViewById(R.id.button);
button.setText(buttonText);

This time we will not parse the code, there is nothing new for us. We used italics, which I described above. We start, we look.



We were able to display the stylized text on the button.

Let's go even further, implement the button click event handler, write the following code in it:

Spannable text = new SpannableString("Italic green text in toast");
text.setSpan(new StyleSpan(Typeface.ITALIC), 0, 18,  Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
text.setSpan(new ForegroundColorSpan(Color.GREEN), 0, 18,  Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
Toast.makeText(this, text, Toast.LENGTH_LONG).show();

Here we have a new class - ForegroundColorSpan , which sets the color of our text, in the example we set green. We use it in tandem with StyleSpan . We launch the application, look at the result.



We were able to cram stylized text even in Toast . We also showed that for one part of the text you can use several markings with styles.

Instead of a conclusion

In the example, we used only some of the available styles, a larger list can be found on the developers website . I think you can experiment with them.

The aim of the article was in an accessible form to show such a powerful and simple tool for styling your application to developers who did not know about its existence or simply did not use it. I hope the article will be useful.

Sources of the example on Github .