Android EditText Using Kotlin With Example




In this post, we will learn about how to use android EditText using Kotlin with example. We will also go through different attributes that are commonly used to customise this widget.

Output

Tutorialwing EditText Using Kotlin Android EditText Widget Using Kotlin

Tutorialwing EditText Using Kotlin

Video Output

An Android EditText widget can be defined as below.

Android EditText widget is subclass of TextView and used to take input from user and modify the text.

While defining the EditText using kotlin, we also mention about the inputType acceptable by this widget. For example, to take plain text as input, we use android:inputType=”text”. Keyboard type shown also changes based on the value provided in inputType. For example, if you use numberPassword as inputType, Keyboard shown will appear as shown below –

Tutorialwing Android EditText numberPassword input Type

Android EditText numberPassword input Type

Different Attributes of Android EditText Widget

Attributes in EditText are inherited from TextView and View widget. Some of the commonly used attributes are –

Sr. XML Attributes Description
1 android:background Use to set background to this View.
2 android:backgroundTint Use to set tint to the background of this view.
3 android:clickable Use to set true when you want to make this View clickable. Otherwise, set false.
4 android:drawableBottom Use to set drawable to bottom of the text in this view.
5 android:drawableEnd Use to set drawable to end of the text in this view.
6 android:drawableLeft Use to set drawable to left of the text in this view.
7 android:drawablePadding Use to set padding to drawable of the view.
8 android:drawableRight Use to set drawable to right of the text in this view.
9 android:drawableStart Use to set drawable to start of the text in this view.
10 android:drawableTop Use to set drawable to top of the text in this view.
11 android:elevation Use to set elevation to this view.
12 android:gravity Use to set gravity of the text in this view. For example, center, horizontal_center, vertical_center etc.
13 android:height Use to set height of the EditText.
14 android:hint Use to set hint to be shown when there is no text in the EditText.
15 android:inputMethod It sets, it specifies that edittext should use specified input method.
16 android:inputType This is used to define what are the types of data that can be entered by the user for this View. For example, Phone, Password, Number, Date, Time etc.
17 android:lines If you want to set height of the View by number of lines, you can do it using this attribute. For example, android:lines=”2”, it means height of View will be 2 lines.
18 android:maxHeight Use to set maximum height of the View.
19 android:minHeight Use to set minimum height of the View.
20 android:maxLength Use to set maximum character length that can be entered in the View.
21 android:maxLines Use to set maximum lines this View can have.
22 android:minLines Use to set minimum lines this View can have.
23 android:maxWidth Use to set maximum width this View can have.
24 android:minWidth Use to set minimum width this Textview can have.
25 android:numeric If sets, it specifies that EditText has numeric input method.
26 android:password Use this attribute if you want to show the entered text as password dots. For example, If you enter ABCD, it will be shown as ****.
27 android:phoneNumber If set, specifies that this EditText has a phone number input method.
28 android:text Use to set the text of the EditText
29 android:textAllCaps Use this attribute to show the text in capital letters.
30 android:textColor Use to set color of the text.
31 android:textSize Use to set size of the text.
32 android:textStyle Use to set style of the text. For example, bold, italic, bolditalic etc.
33 android:typeface Use to set typeface of the text. For example, normal, sans, serif, monospace.
34 android:width Use to set width of the TextView.



Example of Android EditText widget using Kotlin

In this section, we will learn how to use Android EditText using kotlin.

At first, we will create android project in kotlin programming language. So, follow the steps below to create new kotlin project. Please ignore the steps below if you have already created a kotlin project.

1. Creating New Project in Kotlin

Step Description
1. Open Android Studio.
2. Go to File => New => New Project. Write application name as EditText. Then, check Include Kotlin Support and click next button.
3. Select minimum SDK you need. However, we have selected 17 as minimum SDK. Then, click next button
4. Then, select Empty Activity => click next => click finish.
5. If you have followed above process correctly, you will get a newly created project successfully.

You may also visit our post to create new project in android. This tutorial is covered in java. However, the steps are similar in kotlin too.

Since we have created new project, we will modify the xml and kotlin file to use EditText widget.

2. Modify Values Folders

Open res/values/strings.xml file. Then, add below code into it.

<resources>
	<string name="app_name">EditTextUsingKotlin</string>
	<string name="show_text">Show Text</string>
	<string name="hint_enter_something">Enter Something.......</string>
</resources>

Then, open res/values/dimens.xml file(Create it if not present) and add below code into it.

<?xml version="1.0" encoding="utf-8"?>
<resources>
	<dimen name="padding">10dp</dimen>
	<dimen name="margin">10dp</dimen>
</resources>

Other values folders have not been changed. So, we are not going to mention it here.

3. Use EditText in xml File

Open res/layout/activity_main.xml file. Then, add below code into it.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
	android:id="@+id/activity_main"
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	android:gravity="center"
	android:orientation="vertical">

	<EditText
		android:id="@+id/editText"
		android:layout_width="match_parent"
		android:layout_height="wrap_content"
		android:layout_margin="@dimen/margin"
		android:hint="@string/hint_enter_something"
		android:padding="@dimen/padding"/>

	<Button
		android:id="@+id/btnShow"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:text="@string/show_text">
	</Button>

</LinearLayout>

Here, we have added EditText widget in xml file. Now, we will access defined EditText using kotlin and show Toast message on Button click.

4. Access EditText in Kotlin File

Open src/main/java/com.tutorialwing.edittext/MainActivity.kt file. Then, add below code into it.

package com.tutorialwing.edittext

import android.os.Bundle
import android.support.v7.app.AppCompatActivity
import android.widget.Button
import android.widget.EditText
import android.widget.Toast

class MainActivity : AppCompatActivity() {

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

        val btnShow = findViewById<Button>(R.id.btnShow)
        btnShow?.setOnClickListener { showText() }
    }

    private fun showText() {
        val editText = findViewById<EditText>(R.id.editText)
        if (editText != null) {
            Toast.makeText(this, editText.text, Toast.LENGTH_LONG).show()
        }
    }
}

Here, we are showing Toast message, that displays text entered by user in EditText using kotlin.

Since AndroidManifest.xml file is very important file of android application. We are also going to see the content in this file.

AndroidManifest.xml file

Code inside main/AndroidManifest.xml file is as below.

<?xml version="1.0" encoding="utf-8"?>
<manifest package="com.tutorialwing.edittext"
		  xmlns:android="http://schemas.android.com/apk/res/android">

	<application
		android:allowBackup="true"
		android:icon="@mipmap/ic_launcher"
		android:label="@string/app_name"
		android:roundIcon="@mipmap/ic_launcher_round"
		android:supportsRtl="true"
		android:theme="@style/AppTheme">
		<activity android:name=".MainActivity">
			<intent-filter>
				<action android:name="android.intent.action.MAIN"/>

				<category android:name="android.intent.category.LAUNCHER"/>
			</intent-filter>
		</activity>
	</application>

</manifest>

Now, run the application. We will get output as shown above.

That’s end of our tutorial on Android EditText using Kotlin.