Setting EditText underline color in Android

For API 21 (Lollipop) and above, just set the color of property backgroundTint on the EditText

<android.support.v7.widget.AppCompatEditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="Enter some inputs"
    android:backgroundTint="#0c53e2"/>

For Pre Lollipop, API 21 and below.

The quick and easy way.

<style name="MyEditTextStyle2" parent="Widget.AppCompat.EditText">
    <item name="colorControlActivated">#dc8f41</item>
    <item name="colorControlNormal">#d11472</item>
</style>
<EditText
    android:theme="@style/MyEditTextStyle2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="Enter some inputs" />

The more complex way but with more control and customization if needed.

<style name="MyEditTextStyle" parent="Widget.AppCompat.EditText">
    <item name="colorControlActivated">#dc8f41</item>
</style>

text_box_underline.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:top="-4dp" android:left="-4dp" android:right="-4dp">
        <shape android:shape="rectangle">
            <stroke android:width="3dp" android:color="#dc8f41" />
        </shape>
    </item>
</layer-list>

text_box_underline_activated.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:top="-4dp" android:left="-4dp" android:right="-4dp">
        <shape android:shape="rectangle">
            <stroke android:width="3dp" android:color="#dc8f41" />
        </shape>
    </item>
</layer-list>

text_box_underline_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="true" android:state_focused="true"
        android:drawable="@drawable/text_box_underline_activated" />
    <item android:drawable="@drawable/text_box_underline" />
</selector>

Assign the selector to the background of the EditText.

<EditText
    android:theme="@style/MyEditTextStyle"
    android:layout_width="match_parent"
    android:layout_height="30dp"
    android:hint="Enter some inputs"
    android:background="@drawable/text_box_underline_selector"/>

References:
http://stackoverflow.com/questions/14542557/android-different-edittext-backgrounds-for-different-states-using-shapes-select
http://stackoverflow.com/questions/26574328/changing-edittext-bottom-line-color-with-appcompat-v7
http://stackoverflow.com/questions/24677414/how-to-change-line-color-in-edittext

Search within Codexpedia

Custom Search

Search the entire web

Custom Search