Change the TextInputLayout outline color

Addev picture Addev · Jun 12, 2018 · Viewed 61.1k times · Source

I'm trying to customize a TextInputLayout with material style. I managed to set the focused state to the colors I want:

enter image description here

Using

<com.google.android.material.textfield.TextInputLayout
     style="@style/LoginTextInputLayoutStyle"
     android:theme="@style/LoginTextInputLayoutStyle"
     android:textColorHint="#fff"
     app:boxStrokeColor="#fff"
     .....>
          <EditText ...

where the style is:

<style name="LoginTextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
    <item name="colorAccent">#fff</item>
</style>   

But when the textinput is not focused I get this look:

enter image description here

How can I change the color of the black line to be white too. Thanks

Answer

Rutvik Bhatt picture Rutvik Bhatt · Jun 12, 2018

Use this style to apply border color and border width like this :

<style name="LoginTextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
    <item name="boxStrokeColor">#fff</item>
    <item name="boxStrokeWidth">2dp</item>
</style>

get Additional details about styling from this link

Add below line in your colors.xml file that overrides default color for TextInputLayout

<color name="mtrl_textinput_default_box_stroke_color" tools:override="true">#fff</color>