How to design EditText Border

A EditText is an overlay over TextView that configures itself to be editable. It is the predefined subclass of TextView that includes rich editing capabilities.

MainActivity.java

package com.test.border;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

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

activity_main.xml

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:orientation="vertical"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.test.border.MainActivity">

    <EditText
        android:layout_width="match_parent"
        android:background="@drawable/first_name_edit_text_border"
        android:hint="@string/fName"
        android:gravity="center_vertical"
        android:paddingLeft="10dp"
        android:layout_height="40dp" />


    <EditText
    android:layout_width="match_parent"
    android:background="@drawable/last_name_edit_text_border"
    android:hint="@string/lName"
    android:gravity="center_vertical"
    android:layout_marginTop="10dp"
    android:paddingLeft="10dp"
    android:layout_height="40dp" />

    <EditText
        android:layout_width="match_parent"
        android:background="@drawable/age_edit_text_border"
        android:hint="@string/age"
        android:gravity="center_vertical"
        android:layout_marginTop="10dp"
        android:paddingLeft="10dp"
        android:layout_height="40dp" />

    <EditText
        android:layout_width="match_parent"
        android:hint="@string/without_border"
        android:gravity="center_vertical"
        android:layout_marginTop="10dp"
        android:paddingLeft="10dp"
        android:layout_height="40dp" />

</LinearLayout>

Create selector xml file and keep inside drawable directory which will show you as a border of the edittext. Use below xml file as a background of the edittext.

first_name_edit_text_border.xml

First Name EditText Border result given below.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#fffae5"/>
            <stroke
                android:color="@color/colorAccent"
                android:width="1dp"
                />
            <corners android:radius="7dp"/>
        </shape>
    </item>
</selector>

last_name_edit_text_border.xml

Last Name EditText Border result given below.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">

            <solid android:color="@color/last_name_background_white" />
            <stroke android:width="2dp" android:color="@color/colorAccent" />
            <corners android:radius="7dp" />
        </shape>
    </item>
</selector>

age_edit_text_border.xml

Age EditText Border result given below.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">

            <solid android:color="@color/age_edit_text_background_color" />
            <stroke android:width="2dp" android:color="@color/age_border_color" />
            <corners android:radius="0dp" />
        </shape>
    </item>
</selector>

colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
    <color name="age_border_color">#FF00FF</color>
    <color name="last_name_background_white">#FFFFFF</color>
    <color name="age_edit_text_background_color">#ffffffff</color>
</resources>

styles.xml

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

</resources>

Please comment in case of any issues.