EditText Example in Android Studio

An editText is a user interface element for entering and changing text. When you define an edit text #widget, you have to specify the R.styleable.TextView_inputType attribute. For example, for plain text input set inputType to "text".

Choosing the input type configures the keyboard type that is shown, acceptable characters, and appearance of the edit text.

For example, if you want to accept a secret number, like a unique pin or serial number, you can set inputType to "numericPassword". An inputType of "numericPassword" results in an edit text that accepts numbers only, shows a numeric keyboard when focused, and masks the text that is entered for privacy.

XML for an EditText:

<androidx.appcompat.widget.AppCompatEditText
       android:id="@+id/editTextName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="text"
        app:layout_constraintTop_toTopOf="parent"
        android:hint="Name" />

Input Types for EditText

Most common input types include:

• textUri - Text that will be used as a URI

• textEmailAddress - Text that will be used as an e-mail address

• textPersonName - Text that is the name of a person

• textPassword - Text that is a password that should be obscured

• textVisiblePassword - Text, next button, and no microphone input

• number - A numeric only field

• phone - For entering a phone number

• date - For entering a date

• time - For entering a time

• textMultiLineAllow - multiple lines of text in the field

You can set multiple inputType attributes if needed (separated by '|')

See the Text Fields guide for examples of other R.styleable.TextView_inputType settings.

Listening for EditText Input

You also can receive callbacks as a user changes text by adding a TextWatcher to the edit text. This is useful when you want to add auto-save functionality as changes are made, or validate the format of user input, for example. You add a text watcher using the TextView#addTextChangedListener method.

public void addTextChangedListener (TextWatcher watcher)

It is also common to pair an edit text with a button, so a setOnClickListener() works well.

EditText Example Tutorial

In this tutorial we use an editText widget to get information from a user.

Step 1: Create a new Android Studio project with an Empty Activity. Name the project EditTextExample.

The Save location should be a place that makes sense on your computer. If you click on the open folder you can choose a location. Choose Java or Kotlin. Pick a minimum SDK of API 21: Android 5.0 (Lollipop). You do not need any legacy android support libraries.

Add the Widgets to UI

AppCompatEditText is an EditText which supports compatible features on older versions of Android. Here I have included the hint attribute to tell users what should be entered.

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">

    <androidx.appcompat.widget.AppCompatEditText
        android:id="@+id/editTextName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="text"
        app:layout_constraintTop_toTopOf="parent"
        android:hint="Name"/>

</androidx.constraintlayout.widget.ConstraintLayout>

Retrieving Value from an EditText

To get the value of the text entered into the editText create a variable for it, connect it to your widget with findViewById.

Create a String variable to hold the EditText's value and use the follow methods:

AppCompatEditText editTextName;
editTextName = findViewById(R.id.editTextName);
String name = editTextName.getText().toString();

Set a Listener

Here the edit text is paired with a button and an onClickListener. The name variable holds the value of the EditText when the button is pressed.

btnSubmit.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        String name = editTextName.getText().toString();
       
    }
});

Include a Toast

Add a toast to the onClick() method that shows the name that the user has entered into the EditText.

Toast.makeText(MainActivity.this, "Your name is " + name, Toast.LENGTH_SHORT).show();

Run the app

*Bonus: Changing the bottom line color

When using the AppCompat library, you can override the style colorControlActivated in themes.xml to change the color of the bottom line.

<item name="colorControlActivated">#ff8787</item>

Bonus* Creating an EditText with a Floating Hint

Use the Material Library's TextInputLayout to create a floating hint.

Hint on line before inputting text

Floating hint with input

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/textInputLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="Name"
    app:layout_constraintTop_toTopOf="parent">

    <com.google.android.material.textfield.TextInputEditText
        android:id="@+id/editTextName"
        android:inputType="text"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</com.google.android.material.textfield.TextInputLayout>

Source code for activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    android:layout_margin="24dp">


    <androidx.appcompat.widget.AppCompatEditText
        android:id="@+id/editTextName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="text"
        app:layout_constraintTop_toTopOf="parent"
        android:hint="Name"/>

    <com.google.android.material.button.MaterialButton
        android:id="@+id/btnSubmit"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Submit"
        app:layout_constraintTop_toBottomOf="@id/editTextName"/>

</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity.java:

package io.meghandev.edittextexample;

import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.AppCompatEditText;

import android.os.Bundle;
import android.text.Editable;
import android.text.TextWatcher;
import android.view.View;
import android.widget.Toast;

import com.google.android.material.button.MaterialButton;

public class MainActivity extends AppCompatActivity {
    AppCompatEditText editTextName;
    MaterialButton btnSubmit;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        editTextName = findViewById(R.id.editTextName);
        btnSubmit = findViewById(R.id.btnSubmit);

        btnSubmit.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String name = editTextName.getText().toString();
                Toast.makeText(MainActivity.this, 
                "Your name is " + name, 
                Toast.LENGTH_SHORT).show();
            }
        });



    }
}