Android EditText - Get Text from Edittext and display

Last updated Dec 12, 2021


In this example tutorial, we'll look at how to create an EditText and show text in TextView using button click and explore its various properties in Android Studio using the Kotlin language.

What is EditText?
In the app, EditText is used to collect user input. EditText is most commonly used in login and registration form screens.

Implementation:

To begin, Create a new project in android studio with the name EditText Kotlin. Then press the Finish button.
   Open the activity main.xml file and add the LinearLayout with orientation (Vertical or horizontal).

    <LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:background="#22FFAA00"
    tools:context=".MainActivity"></LinearLayout>

 

In activity_main.xml, insert an EditText view inside a LinearLayout.

        <EditText
        android:id="@+id/edittext"
        android:layout_width="300dp"
        android:layout_height="wrap_content"
        android:hint="Enter Username"
        android:drawableLeft="@drawable/user"
        android:drawablePadding="10dp"
        android:textColorHint="@color/white"
        android:textColor="@color/white"
        android:drawableTint="@color/white"
        ></EditText>

 

Add an drawable to the edittext using the drawableLeft property, hint set using hint attribute.

android:hint="Enter Username"
android:drawableLeft="@drawable/user"

 

EditText has the following attributes
    id, padding, drawablePadding, textColor, textColorHint, background, layout_margin, layout_marginLeft, layout_marginRight, layout_marginEnd, layout margin, paddingLeft etc....

 

 android:layout_marginRight="20dp"
        android:layout_marginLeft="20dp"
        android:padding="10dp"
        android:hint="Enter Username"
        android:drawableLeft="@drawable/user"
        android:drawablePadding="10dp"
        android:textColorHint="@color/white"
        android:textColor="@color/white"
        android:drawableTint="@color/white"
        android:layout_margin="10dp"

 

Add Button and TextView below EditText in activity_main.xml file

     <Button
        android:id="@+id/showBtn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Show"></Button>

 <TextView
       android:id="@+id/textview"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_marginTop="30dp"
       android:textSize="29sp"
       android:textColor="@color/white"
       android:textStyle="bold"
     ></TextView>

 

Now, let's put our EditText, Button and TextView to use inside Activity. Any view, from layout to activity, can be used by using its unique id: "id" property with findViewById() method.

val edittext = findViewById(R.id.edittext)
val showBtn = findViewById(R.id.showBtn)
val textview = findViewById(R.id.textview)

 

R.id.edittext is the id of the edittext defined in the activity main.xml file.

Enter some value in the EditText Box and get the text using

val text = edittext.text.toString()

 

in MainActivity.kt file.

Set the text to TextView with this setText() method

textview.setText("Text is: " + text)

 

By implementing onClickListener, we will click on button and set the text on textView.

showBtn.setOnClickListener {
            val text = edittext.text.toString()
            textview.setText("Text is: " + text)
        }

 

Now run the application, you will see the output shown below.

 

Output:

Edittext Example

 

EditText Example


 Complete source code  for Android EditText example:

 activity_main.xml file

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:background="#79231D11"
    tools:context=".MainActivity">

    <EditText
        android:id="@+id/edittext"
        android:layout_width="300dp"
        android:layout_height="wrap_content"
        android:hint="Enter Username"
        android:drawableLeft="@drawable/user"
        android:drawablePadding="10dp"
        android:textColorHint="@color/white"
        android:textColor="@color/white"
        android:drawableTint="@color/white"
        ></EditText>

    <Button
        android:id="@+id/showBtn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Show"></Button>

    <TextView
        android:id="@+id/textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:textSize="29sp"
        android:textColor="@color/white"
        android:textStyle="bold"
        ></TextView>

</LinearLayout>

 

MainActivity.kt

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

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val edittext = findViewById(R.id.edittext)
        val showBtn = findViewById(R.id.showBtn)
        val textview = findViewById(R.id.textview)

 

        showBtn.setOnClickListener {
            val text = edittext.text.toString()
            textview.setText("Text is: " + text)
        }
    }
}

 

 

Conclusion: We have covered the topic how to add EditText to Android and set the text on Textview using Button click event using Kotlin.


Article Contributed By :
https://www.rrtutors.com/site_assets/profile/assets/img/avataaars.svg

36 Views

Subscribe For Daily Updates

Flutter Questions
Android Questions