Change Style of a Particular Span of Characters Inside a String in Android

TextView in Android is used to display text or sequence of characters, better known as strings. These strings can be hard-coded as well as declared during the runtime. The text, in general, is displayed in a raw format where the same text formatting is applied to every character present in the string. If we wish to apply styles, the formatting is applied to the entire string. There is no direct provision to apply different styles to different characters.

So, in this article, we will show you how you could apply styles to sub-strings or string spans programmatically in Android.

Step by Step Implementation

Step 1: Create a New Project in Android Studio

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. We demonstrated the application in Kotlin, so make sure you select Kotlin as the primary language while creating a New Project.

Step 2: Working with the activity_main.xml file

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file. Add a TextView in the layout file. This TextView will display our formatted text.

XML

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:gravity="center"
        android:textSize="20sp"/>

</RelativeLayout>

Step 3: Working with the MainActivity.kt file

Go to the MainActivity.kt file and refer to the following code. Below is the code for the MainActivity.kt file. Comments are added inside the code to understand the code in more detail.

Kotlin

import android.graphics.Typeface
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.text.SpannableString
import android.text.Spanned
import android.text.style.StyleSpan
import android.widget.TextView

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        // Declaring TextView from the layout file
        val mTextView = findViewById<TextView>(R.id.text_view)

        // Declaring a string
        val mString = "GeeksforGeeks is a Computer Science portal for Geeks"

        // Getting a spannable string from the previous string
        val mSpannableString = SpannableString(mString)

        // Declaring Style Spans of different types
        val mBoldSpan = StyleSpan(Typeface.BOLD)
        val mItalicSpan = StyleSpan(Typeface.ITALIC)
        val mBoldItalicSpan = StyleSpan(Typeface.BOLD_ITALIC)

        // Applying style spans to the spannable string
        mSpannableString.setSpan(mBoldSpan, 0, 13, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)
        mSpannableString.setSpan(mItalicSpan, 19, 35, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)
        mSpannableString.setSpan(mBoldItalicSpan, 47, 52, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)

        // Displaying the formatted
        // spannable string in the TextView
        mTextView.text = mSpannableString
    }
}

Output:

You can see that the string has been formatted at different spans.