EditText is a most commonly used widget in android applications. This will allow the user to type text and do required action on button click or any other actions. By default edittext is just a rectangular box with a line on bottom, which height and width can be specified through xml.
What if we want to give border to a EditText or if we want to give rounded edges to EditText . For achieving a custom design for an edittext we need to specify another layout as background . This file will be located in drawable folder and use that as edittext background drawable. Here we will implement an example of a custom design with rounded corners.
Steps
- Create new project in android studio
- Implement the background drawable file for edittext
- Add the edittext with custom background to your layout file
Create New project in android studio
Refer Android beginners app development guide (if you are beginner or if you don’t know how to create project in android studio). This is a tutorial contains all the basic information for start learning to implement an android application.
Implement the background drawable file for edittext
Next step is to create an xml file under res/drawable/edit_text_border.xml. This will be custom background for edittext widget which will define the border color,radius and width of the edittext layout
edit_text_border.xml
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="#ffffff" /> <stroke android:width="1dip" android:color="#C0C0C0" /> <corners android:bottomLeftRadius="12dp" android:bottomRightRadius="12dp" android:topLeftRadius="12dp" android:topRightRadius="12dp"></corners> </shape>
Add the edittext with custom background to your layout file
Once we created the custom background drawable file, all we have to do is to set that file as the background of the edittext which is using in your layout file.
android:background="@drawable/edit_text_border"
Following is the complete EditText code which should be add the layout file with the above line added , you can add your own features as well.
<EditText android:layout_width="match_parent" android:layout_height="60dp" android:layout_marginTop="10dp" android:background="@drawable/edit_text_border" android:hint="Title" android:padding="5dp" android:textColor="#000000" />