Tony
Tony

Reputation: 3805

How to change bottom line color of EditText?

I'm trying to change color of bottom line under EditText. I can see few question on SO like mine, but nothing helps. This is my xml:

<EditText
        android:id="@+id/loginEditText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"         
        android:hint="@string/login"
         android:theme="@style/EditTextStyle"
        android:inputType="textPersonName" >

And this is my style:

 <resources>
    <style name="Theme.MyTheme" parent="Theme.AppCompat.Light">
       <item name="colorPrimary">@color/material_blue_500</item>
       <item name="colorPrimaryDark">@color/material_blue_700</item>
       <item name="colorAccent">@color/material_blue_700</item>  
       <item name="colorControlNormal">@color/material_blue_700</item>
       <!-- Active thumb color & Active track color(30% transparency) -->
       <item name="colorControlActivated">@color/material_blue_500</item>
       <!-- Inactive thumb color -->
       <item name="colorSwitchThumbNormal">@color/lightGrey</item>
       <!-- Inactive track color(30% transparency) -->
       <item name="android:colorForeground">@color/grey</item>   
       <item name="android:editTextStyle">@style/EditTextStyle</item>
       <item name="colorControlNormal">@color/material_blue_400</item>
       <item name="colorControlActivated">@color/material_blue_700</item>
       <item name="colorControlHighlight">@color/material_blue_700</item>

    </style>

    <style name="EditTextStyle" parent="Widget.AppCompat.EditText">
             <item name="colorControlNormal">@color/material_blue_400</item>
             <item name="colorControlActivated">@color/material_blue_700</item>
             <item name="colorControlHighlight">@color/material_blue_700</item>
    </style>
    </resources> 

This is my colors:

<color name="green">#00FF00</color>
<color name="thumbColor">#66aaaaaa</color>
<color name="darkGrey">#888</color>
<color name="grey">#ccc</color>
<color name="white">#fff</color>
<color name="lightGrey">#bbb</color>
<color name="veryMidGrey">#eeeeee</color>
<color name="veryLightGrey">#efefef</color>
<color name="transparent">#00000000</color>
<color name="whiteTransparent">#CCFFFFFF</color>
<color name="blackTransparent">#CC000000</color>
<color name="material_blue_800">#1565C0</color>
<color name="material_blue_500">#2196F3</color>
<color name="material_blue_400">#42A5F5</color>
<color name="material_blue_700">#1976D2</color>
<color name="material_blue_300"> #64B5F6</color>
<color name="black">#000</color>

But my bottom line is still black.

enter image description here

What do?

Upvotes: 2

Views: 2244

Answers (4)

Jay Rathod
Jay Rathod

Reputation: 11255

If you are using appcompat-v7:22.1.0+ Use Drawable Compat.

Refer this Function.

 public void tintColorWidget(View view, int color) {
        Drawable wrappedDrawable = DrawableCompat.wrap(view.getBackground());
        DrawableCompat.setTint(wrappedDrawable.mutate(), getResources().getColor(color));
        view.setBackgroundDrawable(wrappedDrawable);
 }

And Apply to your Views.

 EditText txtView = (EditText) findViewById(R.id.edtCurrency);
 tintColorWidget(txtView, R.color.colorPrimary);

Upvotes: 0

Abhinaw Kumar
Abhinaw Kumar

Reputation: 132

Create a drawable edit.xml

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

        </selector>

And apply this drawable to editText

android:background="@drawable/edit"

now your bottom line will change

9 patch images

apptheme_textfield_activated_holo_light apptheme_textfield_activated_holo_light

Upvotes: 0

Piyush
Piyush

Reputation: 18923

Use :

editText.getBackground().mutate().setColorFilter(getResources().getColor(R.color.your_color), PorterDuff.Mode.SRC_ATOP);

Note : getColor() method is deprecated for API level 23. So you need to use Contextcompat to get color.

Upvotes: 1

Damini Mehra
Damini Mehra

Reputation: 3347

try this answer: change in your style.xml

<style name="Theme.App.Base" parent="Widget.AppCompat.EditText">
<item name="colorControlNormal">#c5c5c5</item>
<item name="colorControlActivated">@color/accent</item>
<item name="colorControlHighlight">@color/accent</item>
</style>

Upvotes: 0

Related Questions