Search code examples
androidmaterial-designandroid-stylesandroid-textinputlayout

Change the TextInputLayout outline color


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?


Solution

  • 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>