{"id":762,"date":"2016-02-01T08:47:49","date_gmt":"2016-02-01T08:47:49","guid":{"rendered":"http:\/\/abhiandroid.com\/ui\/?page_id=762"},"modified":"2019-06-14T10:45:31","modified_gmt":"2019-06-14T10:45:31","slug":"edittext","status":"publish","type":"page","link":"https:\/\/abhiandroid.com\/ui\/edittext","title":{"rendered":"EditText Tutorial With Example In Android Studio: Input Field"},"content":{"rendered":"

In Android, EditText is a standard entry widget in android apps. It is an overlay over TextView that configures itself to be editable. EditText is a subclass of TextView with text editing operations. We often use EditText in our applications in order to provide an input or text field, especially in forms.<\/strong> The most simple example of EditText is Login or Sign-in form.<\/p>\n

\"EditText<\/center>Text Fields in Android Studio are basically EditText:<\/p>\n

\"EditText<\/center>Important Note: <\/strong><\/span>An\u00a0EditText\u00a0is simply a thin extension of a\u00a0TextView<\/a>. An EditText inherits all the properties of a TextView.<\/p>\n
\n

EditText Code:<\/strong><\/h4>\n

We can create a EditText\u00a0instance by declaring it inside a layout(XML file) or by instantiating it programmatically (i.e. in Java Class).<\/p>\n

EditText code in XML:<\/strong><\/p>\n

<EditText\r\nandroid:id=\"@+id\/simpleEditText\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_width=\"match_parent\"\/>\r\n<\/pre>\n
Retrieving \/ Getting the Value From EditText In Java Class:<\/strong><\/p>\n
Below is the example code of EditText in which we retrieve the value from a EditText in Java class. We have used this code in the example you will find at the end of this post.<\/p>\n
EditText simpleEditText = (EditText) findViewById(R.id.simpleEditText);\r\nString editTextValue = simpleEditText.getText().toString();\r\n<\/pre>\n
\n
Attributes of EditText:<\/strong><\/h4>\n
Now let\u2019s \u00a0we discuss few attributes that helps us to configure a EditText in your xml.<\/p>\n
1. id:<\/strong><\/span> id is an attribute used to uniquely identify a text EditText. Below is the example code in which we set the id of a edit text.<\/p>\n
<EditText\r\nandroid:id=\"@+id\/simpleEditText\" \r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_width=\"match_parent\"\/><\/pre>\n
2. gravity: <\/strong><\/span>The gravity attribute is an optional attribute which is used to control the alignment of the text like left, right, center, top, bottom, center_vertical, center_horizontal etc.<\/p>\n
Below is the example code with explanation included in which we set the right gravity for text of a EditText.<\/p>\n
<EditText\r\n    android:id=\"@+id\/simpleEditText\"\r\n    android:layout_width=\"fill_parent\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:text=\"Enter Email\"\r\n    android:gravity=\"right\"\/><!--gravity of a edit text--><\/pre>\n
\"gravity<\/center>3. text:<\/strong><\/span> text attribute is used to set the text in a EditText. We can set the text in xml as well as in the java class.<\/p>\n
Below is the example code in which we set the text \u201cUsername\u201d in a edit text.<\/p>\n
<EditText\r\n    android:id=\"@+id\/simpleEditText\"\r\n    android:layout_width=\"fill_parent\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:layout_centerInParent=\"true\"\r\n    android:text=\"Username\"\/><!--set text in edit text--><\/pre>\n
\"text<\/center>Setting text in EditText In Java class:<\/strong><\/p>\n
Below is the example code in which we set the text in a\u00a0 text view programmatically means in java class.<\/p>\n
EditText editText = (EditText)findViewById(R.id.simpleEditText);\r\neditText.setText(\"Username\");\/\/set the text in edit text<\/pre>\n
4. hint:<\/strong><\/span> hint is an attribute used to set the hint i.e. what you want user to enter in this edit text. Whenever user start to type in edit text the hint will automatically disappear.<\/p>\n
Below is the example code with explanation in which we set the hint of a edit text.<\/p>\n
<EditText\r\n    android:id=\"@+id\/simpleEditText\"\r\n    android:layout_width=\"fill_parent\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:layout_centerInParent=\"true\"\r\n    android:hint=\"Enter Your Name Here\" \/><!--display the hint--><\/pre>\n
\"hint<\/center>Setting hint in EditText In Java class:<\/strong><\/p>\n
Below is the example code in which we set the text in a\u00a0 text view programmatically means in java class.<\/p>\n
EditText editText = (EditText)findViewById(R.id.simpleEditText);\r\neditText.setHint(\"Enter Your Name Here\");\/\/display the hint\r\n<\/pre>\n
5. textColor:<\/strong><\/span> textColor attribute is used to set the text color of a text edit text. Color value is in the form of “#argb”, “#rgb”, “#rrggbb”, or “#aarrggbb”.<\/p>\n
Below is the example code with explanation included in which we set the red color for the displayed text of a edit text.<\/p>\n
<EditText\r\n    android:id=\"@+id\/simpleEditText\"\r\n    android:layout_width=\"fill_parent\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:layout_centerInParent=\"true\"\r\n    android:text=\"Password\"\r\n    android:textColor=\"#f00\"\/><!--set the red text color--><\/pre>\n
\"textColor<\/center>Setting textColor in EditText In Java class:<\/strong><\/p>\n
Below is the example code in which we set the text color of a edit text programmatically means in java class.<\/p>\n
EditText simpleEditText=(EditText)findViewById(R.id.simpleEditText<\/em>);\r\nsimpleEditText.setTextColor(Color.RED<\/em>);\/\/set the red text color\r\n<\/pre>\n
6. textColorHint:<\/strong><\/span> textColorHint is an attribute used to set the color of displayed hint.<\/p>\n
Below is the example code with explanation included in which we set the green color for displayed hint of a edit text.<\/p>\n
<EditText\r\n    android:id=\"@+id\/simpleEditText\"\r\n    android:layout_width=\"fill_parent\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:layout_centerInParent=\"true\"\r\n    android:hint=\"Enter Your Name Here\"\r\n    android:textColorHint=\"#0f0\"\/><!--set the hint color green--><\/pre>\n
\"textColorHint<\/center>Setting textColorHint in EditText In Java class:<\/strong><\/p>\n
Below is the example code in which we set the hint color of a edit text programmatically means in java class.<\/p>\n
EditText simpleEditText=(EditText)findViewById(R.id.simpleEditText<\/em>);\r\nsimpleEditText.setHintTextColor(Color.green<\/em>(0));\/\/set the green hint color\r\n<\/pre>\n
7. textSize:<\/strong><\/span> textSize attribute is used to set the size of text of a edit text. We can set the text size in sp(scale independent pixel) or dp(density pixel).<\/p>\n
Below is the example code in which we set the 25sp size for the text of a edit text.<\/p>\n
<EditText\r\n    android:id=\"@+id\/simpleEditText\"\r\n    android:layout_width=\"fill_parent\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:layout_centerInParent=\"true\"\r\n    android:text=\"AbhiAndroid\"\r\n    android:textSize=\"25sp\" \/><!--set 25sp text size--><\/pre>\n
\"Setting<\/center>Setting textSize in EditText in Java class:<\/strong><\/p>\n
Below is the example code in which we set the text size of a edit text programmatically means in java class.<\/p>\n
EditText simpleEditText=(EditText)findViewById(R.id.simpleEditText<\/em>);\r\nsimpleEditText.setTextSize(25);\/\/set size of text\r\n<\/pre>\n
8. textStyle:<\/strong><\/span> textStyle attribute is used to set the text style of a edit text. The possible text styles are bold, italic and normal. If we need to use two or more styles for a edit text then \u201c|\u201d operator is used for that.<\/p>\n
Below is the example code with explanation included, in which we set the bold and italic text styles for text.<\/p>\n
<EditText\r\n    android:id=\"@+id\/simpleEditText\"\r\n    android:layout_width=\"fill_parent\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:layout_centerInParent=\"true\"\r\n    android:text=\"Email\"\r\n    android:textSize=\"25sp\"\r\n    android:textStyle=\"bold|italic\"\/><!--set bold and italic text style--><\/pre>\n
\"Setting<\/center>9. background:<\/strong><\/span> background attribute is used to set the background of a edit text. We can set a color or a drawable in the background of a edit text.<\/p>\n
Below is the example code with explanation included in which we set the black color for the background, white color for the displayed hint and set 10dp padding from all the side\u2019s for edit text.<\/p>\n
<EditText\r\n    android:id=\"@+id\/simpleEditText\"\r\n    android:layout_width=\"fill_parent\"\r\n    android:layout_height=\"wrap_content\"\r\n    android:layout_centerInParent=\"true\"\r\n    android:hint=\"Enter Your Name Here\"\r\n    android:padding=\"15dp\"\r\n    android:textColorHint=\"#fff\"\r\n    android:textStyle=\"bold|italic\"\r\n    android:background=\"#000\"\/><!--set background color black--><\/pre>\n
\"Background<\/center>Setting Background in EditText In Java class:<\/strong><\/p>\n
Below is the example code in which we set the background color of a edit text programmatically means in java class.<\/p>\n
EditText simpleEditText=(EditText)findViewById(R.id.simpleEditText<\/em>);\r\nsimpleEditText.setBackgroundColor(Color.BLACK<\/em>);\/\/set black background color\r\n<\/pre>\n
10. padding:<\/strong><\/span> padding attribute is used to set the padding from left, right, top or bottom. In above example code of background we also set the 10dp padding from all the side\u2019s of edit text.<\/p>\n
\n
Example I – EditText in Android Studio<\/strong><\/h4>\n
Below is the example of edit text in which we get the value from multiple edittexts and on button click event the Toast will show the data defined in Edittext.<\/p>\n
Download Code<\/a> ? <\/a><\/p>\n
\"EditText
\nStep 1:<\/strong><\/span> Create a new project in Android Studio and name it EditTextExample.
\nStep 2:<\/strong><\/span> Now Open res -> layout ->\u00a0xml (or) activity_main.xml\u00a0and add following code. In this code we have added multiple edittext and a button with onclick functionality.<\/p>\n
<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n    android:id=\"@+id\/activity_main\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"match_parent\"\r\n    android:paddingBottom=\"@dimen\/activity_vertical_margin\"\r\n    android:paddingLeft=\"@dimen\/activity_horizontal_margin\"\r\n    android:paddingRight=\"@dimen\/activity_horizontal_margin\"\r\n    android:paddingTop=\"@dimen\/activity_vertical_margin\"\r\n    tools:context=\"com.example.edittextexample.MainActivity\">\r\n\r\n    <EditText\r\n        android:id=\"@+id\/editText1\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_alignParentLeft=\"true\"\r\n        android:layout_alignParentStart=\"true\"\r\n        android:layout_alignParentTop=\"true\"\r\n        android:layout_marginLeft=\"50dp\"\r\n        android:layout_marginStart=\"50dp\"\r\n        android:layout_marginTop=\"24dp\"\r\n        android:ems=\"10\"\r\n        android:hint=\"@string\/name\"\r\n        android:inputType=\"textPersonName\"\r\n        android:selectAllOnFocus=\"true\" \/>\r\n\r\n    <EditText\r\n        android:id=\"@+id\/editText2\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_alignLeft=\"@+id\/editText1\"\r\n        android:layout_alignStart=\"@+id\/editText1\"\r\n        android:layout_below=\"@+id\/editText1\"\r\n        android:layout_marginTop=\"19dp\"\r\n        android:ems=\"10\"\r\n        android:hint=\"@string\/password_0_9\"\r\n        android:inputType=\"numberPassword\" \/>\r\n\r\n    <EditText\r\n        android:id=\"@+id\/editText3\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_alignLeft=\"@+id\/editText2\"\r\n        android:layout_alignStart=\"@+id\/editText2\"\r\n        android:layout_below=\"@+id\/editText2\"\r\n        android:layout_marginTop=\"12dp\"\r\n        android:ems=\"10\"\r\n        android:hint=\"@string\/e_mail\"\r\n        android:inputType=\"textEmailAddress\" \/>\r\n\r\n    <EditText\r\n        android:id=\"@+id\/editText4\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_alignLeft=\"@+id\/editText3\"\r\n        android:layout_alignStart=\"@+id\/editText3\"\r\n        android:layout_below=\"@+id\/editText3\"\r\n        android:layout_marginTop=\"18dp\"\r\n        android:ems=\"10\"\r\n        android:hint=\"@string\/date\"\r\n        android:inputType=\"date\" \/>\r\n\r\n    <EditText\r\n        android:id=\"@+id\/editText5\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_alignLeft=\"@+id\/editText4\"\r\n        android:layout_alignStart=\"@+id\/editText4\"\r\n        android:layout_below=\"@+id\/editText4\"\r\n        android:layout_marginTop=\"18dp\"\r\n        android:ems=\"10\"\r\n        android:hint=\"@string\/contact_number\"\r\n        android:inputType=\"phone\" \/>\r\n\r\n    <Button\r\n        android:id=\"@+id\/button\"\r\n        style=\"@android:style\/Widget.Button\"\r\n        android:layout_width=\"match_parent\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_alignParentLeft=\"true\"\r\n        android:layout_alignParentStart=\"true\"\r\n        android:layout_below=\"@+id\/editText5\"\r\n        android:layout_marginTop=\"62dp\"\r\n        android:text=\"@string\/submit\"\r\n        android:textSize=\"16sp\"\r\n        android:textStyle=\"normal|bold\" \/>\r\n<\/RelativeLayout>\r\n<\/pre>\n
Step 3:<\/strong><\/span> Now open app -> java -> package -> MainActivity.java and add the below code.
\nIn this we just fetch the text from the edittext, further with the button click event a toast will show the text fetched before.<\/p>\n
package com.example.edittextexample;\r\n\r\nimport android.support.v7.app.AppCompatActivity;\r\nimport android.os.Bundle;\r\nimport android.view.View;\r\nimport android.widget.Button;\r\nimport android.widget.EditText;\r\nimport android.widget.Toast;\r\n\r\npublic class MainActivity extends AppCompatActivity {\r\n\r\n    Button submit;\r\n    EditText name, password, email, contact, date;\r\n\r\n    @Override\r\n    protected void onCreate(Bundle savedInstanceState) {\r\n        super.onCreate(savedInstanceState);\r\n        setContentView(R.layout.activity_main);\r\n        name = (EditText) findViewById(R.id.editText1);\r\n        password = (EditText) findViewById(R.id.editText2);\r\n        email = (EditText) findViewById(R.id.editText3);\r\n        date = (EditText) findViewById(R.id.editText4);\r\n        contact = (EditText) findViewById(R.id.editText5);\r\n        submit = (Button) findViewById(R.id.button);\r\n\r\n        submit.setOnClickListener(new View.OnClickListener() {\r\n            @Override\r\n            public void onClick(View v) {\r\n                if (name.getText().toString().isEmpty() || password.getText().toString().isEmpty() || email.getText().toString().isEmpty() || date.getText().toString().isEmpty()\r\n                        || contact.getText().toString().isEmpty()) {\r\n                    Toast.makeText(getApplicationContext(), \"Enter the Data\", Toast.LENGTH_SHORT).show();\r\n                } else {\r\n                    Toast.makeText(getApplicationContext(), \"Name -  \" + name.getText().toString() + \" \\n\" + \"Password -  \" + password.getText().toString()\r\n                            + \" \\n\" + \"E-Mail -  \" + email.getText().toString() + \" \\n\" + \"Date -  \" + date.getText().toString()\r\n                            + \" \\n\" + \"Contact -  \" + contact.getText().toString(), Toast.LENGTH_SHORT).show();\r\n                }\r\n            }\r\n        });\r\n    }\r\n}\r\n<\/pre>\n
Output:<\/span><\/strong><\/p>\n
Now start the AVD in Emulator and run the App. You will see screen asking you to fill the data in required fields like name, password(numeric), email, date, contact number. Enter data and click on button. You will see the data entered will be displayed as Toast on screen.<\/p>\n
\"\"<\/p>\n
\n
Example II – EditText in Android Studio<\/strong><\/h4>\n
Below is the example of edit text in which we get the value from a edit text on button click event and then display it in a Toast. Below is the final output and code.<\/p>\n
Download Code<\/a> ? <\/a><\/p>\n
\"EditText<\/center>Step 1:<\/strong><\/span> Create a new project in Android Studio and name it EditTextExample.<\/p>\n
Select File -> New -> New Project and Fill the forms and click \"Finish\" button.\r\n<\/pre>\n
Step 2:<\/strong><\/span> Now Open res -> layout ->\u00a0xml (or) activity_main.xml\u00a0and add following code. Here we will design one EditText for filling name and one Button which will be used to display the name entered by the user.<\/p>\n
<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"match_parent\"\r\n    android:paddingBottom=\"@dimen\/activity_vertical_margin\"\r\n    android:paddingLeft=\"@dimen\/activity_horizontal_margin\"\r\n    android:paddingRight=\"@dimen\/activity_horizontal_margin\"\r\n    android:paddingTop=\"@dimen\/activity_vertical_margin\"\r\n    tools:context=\".MainActivity\">\r\n\r\n    <EditText\r\n        android:id=\"@+id\/simpleEditText\"\r\n        android:layout_width=\"fill_parent\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_centerHorizontal=\"true\"\r\n        android:background=\"#F2F2F2\"\r\n        android:hint=\"Enter Your Name Here\"\r\n        android:padding=\"15dp\"\r\n        android:textColorHint=\"#000\"\r\n        android:textStyle=\"bold|italic\"\r\n        android:layout_marginTop=\"100dp\" \/>\r\n\r\n    <Button\r\n        android:id=\"@+id\/displayText\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_centerInParent=\"true\"\r\n        android:background=\"#000\"\r\n        android:padding=\"10dp\"\r\n        android:text=\"Display Text\"\r\n        android:textColor=\"#0f0\"\r\n        android:textStyle=\"bold\" \/>\r\n\r\n\r\n<\/RelativeLayout><\/pre>\n
Step 3:<\/strong><\/span> Now open app -> java -> package ->\u00a0MainActivity.java and add the below code. The explanation is included in the code itself as comment.
\n<\/strong><\/p>\n
package example.abhiandriod.edittextexample;\r\n\r\nimport android.graphics.Color;\r\nimport android.support.v7.app.AppCompatActivity;\r\nimport android.os.Bundle;\r\nimport android.view.Menu;\r\nimport android.view.MenuItem;\r\nimport android.view.View;\r\nimport android.widget.Button;\r\nimport android.widget.EditText;\r\nimport android.widget.Toast;\r\n\r\npublic class MainActivity extends AppCompatActivity {\r\n\r\n    @Override\r\n    protected void onCreate(Bundle savedInstanceState) {\r\n        super.onCreate(savedInstanceState);\r\n        setContentView(R.layout.activity_main);\r\n        final EditText simpleEditText = (EditText) findViewById(R.id.simpleEditText);\/\/get the id for edit text\r\n        Button displayText = (Button) findViewById(R.id.displayText);\/\/get the id for button\r\n        displayText.setOnClickListener(new View.OnClickListener() {\r\n            @Override\r\n            public void onClick(View view) {\r\n                if (simpleEditText.getText().toString() != null)\/\/check whether the entered text is not null\r\n                {\r\n                    Toast.makeText(getApplicationContext(), simpleEditText.getText().toString(), Toast.LENGTH_LONG).show();\/\/display the text that you entered in edit text\r\n                }\r\n            }\r\n        });\r\n    }\r\n\r\n\r\n}<\/pre>\n
Output:<\/strong><\/span><\/p>\n
Now start the AVD in Emulator and run the App. You will see screen asking you to fill your name. Enter your name and click on button. You will see the name entered will be displayed as Toast on screen.<\/p>\n
\"EditText<\/center><\/p>\n
\n
TextInputLayout \/ Floating Labels In EditText:<\/strong><\/h4>\n
TextInputLayout is a new element introduced in Material Design Support library to display the floating label in\u00a0EditText. Read our advance\u00a0Floating Labels tutorial <\/a>to learn how to use it in your App.<\/p>\n
\"Floating<\/p>\n","protected":false},"excerpt":{"rendered":"
In Android, EditText is a standard entry widget in android apps. It is an overlay over TextView that configures itself to be editable. EditText is a subclass of TextView with text editing operations. We often use EditText in our applications in order to provide an input or text field, especially in forms. The most simple … Continue reading EditText Tutorial With Example In Android Studio: Input Field<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"home.php","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-762","page","type-page","status-publish","hentry"],"acf":[],"psp_head":"EditText Tutorial With Example In Android Studio: Input Field \u2013 Abhi Android<\/title>\r\n<meta name=\"description\" content=\"EditText is used to provide an input or text field, especially in forms. Learn the concept and attributes in detail with example and code in Android Studio.\" \/>\r\n<meta name=\"robots\" content=\"index,follow\" \/>\r\n<link rel=\"canonical\" href=\"https:\/\/abhiandroid.com\/ui\/edittext\" \/>\r\n","_links":{"self":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/762","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/comments?post=762"}],"version-history":[{"count":5,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/762\/revisions"}],"predecessor-version":[{"id":2846,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/762\/revisions\/2846"}],"wp:attachment":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/media?parent=762"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}