In this example we will learn how to display any text in a TextView with button click using KOTLIN language. So, lets start How To Display Text in TextView Using Kotlin.
How To Display Text in TextView Using Kotlin:
1- Create a new Android Studio Project and name it ” DisplayText “. Also you name it whatever you like.
2- Go to “activity_main.xml” file and first of all change the default Constrain Layout to Relative Layout.
3- Here in our “activity_main.xml” file we need one EditText, one TextView and then one Button.
4- We will use EditText to write our text. TextView will display that text and Button will be used to display that text in Textview on Click event.
5- After designing Our EditText using some properties our EditText will look like this:
|
1 2 3 4 5 6 7 8 9 10 11 |
<EditText android:id="@+id/edittext" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="50dp" android:layout_marginLeft="10dp" android:layout_marginRight="5dp" android:textSize="25sp" android:textStyle="bold" style="@style/Widget.AppCompat.TextView"/> |
6- After EditText we will use a TextView.
7- After adding Id and some properties our TextView will look like this:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<TextView android:id="@+id/textview" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/edittext" android:hint=" Text Will Be Displayed Here" android:layout_marginTop="50dp" android:layout_marginLeft="10dp" android:layout_marginRight="5dp" android:textColor="#000000" android:textSize="25sp" android:textStyle="bold" /> |
8- So now, we will take a Button.
9- After adding Id and some properties our Button will look like this:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<Button android:id="@+id/displaytext" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/textview" android:layout_centerInParent="true" android:layout_marginTop="100dp" android:layout_marginLeft="5dp" android:layout_marginRight="5dp" android:text="DISPLAY TEXT" android:textSize="25sp" android:textStyle="bold"/> |
10- Finally we are done with our “activity_main.xml” file. So, our complete “activity_main.xml” will look like this:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 |
<?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"> <EditText android:id="@+id/edittext" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="50dp" android:layout_marginLeft="10dp" android:layout_marginRight="5dp" android:textSize="25sp" android:textStyle="bold" style="@style/Widget.AppCompat.TextView"/> <TextView android:id="@+id/textview" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/edittext" android:hint=" Text Will Be Displayed Here" android:layout_marginTop="50dp" android:layout_marginLeft="10dp" android:layout_marginRight="5dp" android:textColor="#000000" android:textSize="25sp" android:textStyle="bold" /> <Button android:id="@+id/displaytext" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/textview" android:layout_centerInParent="true" android:layout_marginTop="100dp" android:layout_marginLeft="5dp" android:layout_marginRight="5dp" android:text="DISPLAY TEXT" android:textSize="25sp" android:textStyle="bold"/> </RelativeLayout> |
How To Display Text in TextView Using Kotlin :
11- Now, come to your ” MainActivity.kt “ file. Here we will provide the ids for our contents and we will use an OnClickListener on our Button.
12- First we will define our views ( EditText, TextView and Button ).
13- We will use ” lateinit “ because we do not have any default values for our Views.
|
1 2 3 |
lateinit var editText: EditText lateinit var textView: TextView lateinit var Button: Button |
14- Now, in our onCreate Method we are going to provide the Ids for our views like this:
|
1 2 3 |
editText = findViewById(R.id.edittext) textView = findViewById(R.id.textview) Button = findViewById(R.id.displaytext) |
15- After that we will use an interface “OnClickListener”. We will add it on the top of our activity like this:
|
1 |
class MainActivity : AppCompatActivity(), OnClickListener |
16- After adding “OnClickListener” we have to import the method of this abstract interface. We can do that simply by pressing ALT+ENTER.
17- We will register an OnClickListener on our Button in our onCreate method like this:
|
1 |
Button.setOnClickListener(this) |
18- So, in our onClick function outside onCreate method now we will create a variable ” name “ and we will store our text from EditText in it.
19- Finally, we will use “text” method to get our text from EditText and store it in our TextView with the help of “text” method again like this:
|
1 2 3 4 5 |
override fun onClick(v: View?) { val name = editText.text textView.text = name } |
20- Finally our complete “MainActivity.kt” file will look like this:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
package com.example.displaytext import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import android.view.View import android.view.View.OnClickListener import android.widget.Button import android.widget.EditText import android.widget.TextView class MainActivity : AppCompatActivity(), OnClickListener { lateinit var editText: EditText lateinit var textView: TextView lateinit var Button: Button override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) editText = findViewById(R.id.edittext) textView = findViewById(R.id.textview) Button = findViewById(R.id.displaytext) Button.setOnClickListener(this) } override fun onClick(v: View?) { val name = editText.text textView.text = name } } |
OUTPUT
People Also Read:
- Indeterminate Progress Bar In Android
- Horizontal ScrollView in Android
- ListView in Android
- Alert Dialog In Android
Pingback: RecyclerView With Data Binding in Android Kotlin: Example With Kotlin
Pingback: Android Custom Toolbar In Kotlin | Toolbar Kotlin Example - My Android