Android TextView

Android TextView

Android TextView widget displays text to the user in UI.

In this tutorial, we will learn how to create a TextView using layout XML files, how to access the TextView in layout file from Kotlin file, how to create a TextView in Kotlin file and display it to user, different attributes supported by TextView, with examples covering the most important scenarios.

In the following screenshot, we have a TextView with the text “Welcome to Kotlin Android Tutorial! This is a TextView widget.”.

Create TextView in Layout File

To create a TextView in layout file, use TextView widget.

<TextView
   attribute(s)
/>

Create an Android Project with Kotlin support and follow these steps.

In the layout activity_main.xml file, define a TextView widget. In this example, we have defined a TextView inside the root element LinearLayout.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view_id"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="@string/hello" />
</LinearLayout>

We have used the string resource hello, in our above layout activity_main.xml file. Following is the content of strings.xml resource file.

strings.xml

<resources>
    <string name="app_name">TextViewTutorial</string>
    <string name="hello">Hello World</string>
</resources>

Our default MainActivity.kt should look like the following, and we are not changing anything in this file, for now. This Kotlin file is the launcher for this Android application.

MainActivity.kt

package com.tutorialkart.textviewtutorial

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle

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

Output Screenshot

Run the Android application on an emulator. You will get the following screen in the device.

Access TextView in Layout File from Kotlin

To access the TextView present in a layout file, from  Kotlin file, use findViewById() method with the TextView id passed as argument. The attribute id will help to find the specified widget.

var helloTextView = findViewById<TextView>(R.id.text_view_id)

Following is a complete example to access the TextView present in layout file.

We have a TextView with id text_view_id in the following layout file.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view_id"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="@string/hello" />
</LinearLayout>

In the following strings.xml file, we have the string resources that we use in both layout activity_main.xml file and MainActivity.kt file.

strings.xml

<resources>
    <string name="app_name">TextViewTutorial</string>
    <string name="hello">Hello World</string>
    <string name="greeting">Good Morning</string>
</resources>

In the following MainActivity.kt file, we are accessing the TextView using findViewById() function with id text_view_id, and changing the TextView’s text attribute value.

MainActivity.kt

package com.tutorialkart.textviewtutorial

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.TextView

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        //get reference to the textview
        var helloTextView = findViewById<TextView>(R.id.text_view_id)
        //set its text property
        helloTextView.text = getString(R.string.greeting)
    }
}

Output Screenshot

The text has been changed in UI, because we have updated the text attribute of the TextView in Kotlin file.

Create TextView programmatically in Kotlin File

In the above examples, we have seen how to create a TextView in layout XML files. In addition to that, you can also create a TextView in your Kotlin file.

To create a TextView using Kotlin, you can use TextView() class. Call TextView() constructor with context passed as argument, and it shall return a TextView object.

val textViewNew = TextView(this)

You can use the variable name to modify its attributes and add the text view to your UI layout file.

In the following example, we will create a TextView in Kotlin file and add it to the UI.

Following layout file contains a TextView. In addition to this one, we will create one more TextView in MainActivity.kt file.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linear_layout_id"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view_id"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="@string/hello" />
</LinearLayout>

We shall use the following string resources in our layout and MainActivity.kt files.

MainActivity.kt

<resources>
    <string name="app_name">TextViewTutorial</string>
    <string name="hello">Hello World</string>
    <string name="greeting">Good Morning</string>
</resources>

In the following MainActivity.kt file, we have created a TextView with variable name textViewNew. After that, we have set its text attribute and added this TextView to LinarLayout present at the root of activity_main.xml layout file.

MainActivity.kt

package com.tutorialkart.textviewtutorial

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.LinearLayout
import android.widget.TextView

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        //create TextView
        val textViewNew = TextView(this)
        //set TextView attributes
        textViewNew.text = getString(R.string.greeting)
        //add this TextView to UI
        findViewById<LinearLayout>(R.id.linear_layout_id).addView(textViewNew)
    }
}

Output Screenshot

The new TextView is displayed after the TextView present in layout file.

TextView Attributes

In the above examples, we have used some of the attributes for TextView. They are id, layout_height, layout_width and text. There are some more attributes for TextView.

Instead of dumping all the TextView attributes in a list, we shall take some of the challenges with TextView and solve them using its attributes.

justificationMode – Android TextView – Justify Text

textColor – Android TextView – Set/Change Text Color

textStyle – Android TextView – Italic Text, Android TextView – Bold Text

Other Android TextView Tutorials

Following are some of the useful TextView tutorials, that would help you when working with TextView widget.

• Android TextView – Create programmatically
• Android TextView – OnClickListener

Conclusion

In this Kotlin Android Tutorial, we learned about Android TextView widget.