Material-components-android: [TextInputLayout] boxStrokeColor doesn't work with ColorStateLists for a variety of states.

[danielesegato]

Description:
According to the documentation we can change the box color of a TextInputLayout using the attribute boxStrokeColor.

in truth, unless this is defined as a color selector, this only alter the focused color.
It looks usually ok on white background but it's really bad in dark background.

Instead the focused color change and the non focused color stay the default, which is

• default = mtrl_textinput_default_box_stroke_color
• disabled = mtrl_textinput_disabled_color
• hovered = mtrl_textinput_hovered_box_stroke_color

Expected behavior:
the boxStrokeColor should be taken and be used to generate defaultStrokeColor, focusedStrokeColor, hoveredStrokeColor and disabledColor according to https://material.io/design/interaction/states.html#anatomy

Source code:

<com.google.android.material.textfield.TextInputLayout
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:boxStrokeColor="#FFF"/>

Android API version:
Any. We tried on P, Q.

Material Library version:
1.1.0-alpha10

Device:
Pixel 2, Pixel 3

[zishanj]

This is an issue with v1.0 also. Any progress on it or temporary workaround to change the defaultStrokeColor only?

[zishanj]

Just overriding the mtrl_textinput_default_box_stroke_color value fixed it:

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

[danielesegato]

Just overriding the mtrl_textinput_default_box_stroke_color value fixed it:

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

This is really a BAD idea.

mtrl_textinput_default_box_stroke_color is not used only there.

If you want to change the color right now create a color selector and use it to set the color:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="true" android:color="@color/stroke_enabled"/>
    <item android:state_hovered="true" android:color="@color/stroke_hovered"/>
    <item android:state_focused="true" android:color="@color/stroke_focused"/>
    <item android:color="@color/stroke_default"/>
</selector>

[zishanj]

Not really if you want to reflect the change everywhere for single state only. Thanks for the suggestion though!

[danielesegato]

That's a big IF :-) better to make sure people who come across your suggestion understand it ;-)

[ldjcmu]

Tracking that PR #524 is related to this.

[mladen1nf]

Just overriding the mtrl_textinput_default_box_stroke_color value fixed it:
<color name="mtrl_textinput_default_box_stroke_color" tools:override="true">#aaaaaa</color>

This is really a BAD idea.

mtrl_textinput_default_box_stroke_color is not used only there.

If you want to change the color right now create a color selector and use it to set the color:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="true" android:color="@color/stroke_enabled"/>
    <item android:state_hovered="true" android:color="@color/stroke_hovered"/>
    <item android:state_focused="true" android:color="@color/stroke_focused"/>
    <item android:color="@color/stroke_default"/>
</selector>

This solution does not work

[ldjcmu]

Include #515 and #534 in this issue.

[ldjcmu]

The TextInputLayout does not respect defined colors. I am using a filled text input layout but the floating label, underline and cursor colors, when focused is always the colorPrimary even after trying to change it. I have tried setting the color of choice using colorControlActivated but it doesn't work

[KelvinPac]

Using boxStrokeColor makes the floating label transparent I think it uses white color because my background color is also white

[danielesegato]

If you want to change the color right now create a color selector and use it to set the color:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="true" android:color="@color/stroke_enabled"/>
    <item android:state_hovered="true" android:color="@color/stroke_hovered"/>
    <item android:state_focused="true" android:color="@color/stroke_focused"/>
    <item android:color="@color/stroke_default"/>
</selector>

This solution does not work

yes it does?!

are you creating a COLOR selector or a drawable selector?

[douglasiacovelli]

@ymarian any chances of this fix entering on the 1.1.0-beta03 or 1.1.0-rc?

[damon-beaven]

Even with using that exact color selector (suggested above), I am not able to override the cursor color in TextInputLayout. It appears to be pulling colorPrimary. EditText uses colorAccent by default (which is what my app theme assumes). Mixing TextInputLayout and EditText w/in the same app leads a mixture of cursor colors.

Is it intentional that the cursor is based on colorPrimary...or is this a bug? If so, should I log a new bug for that?

[amatkivskiy]

Any updates on this?

[zishanj]

@amatkivskiy you should use this workaround if you want to change cursor color.

[jamessolo12]

Can we re-open this issue? Its clearly broken and the workaround doesn't work.

[marinantonio]

Heya all, I can confirm issue is still present in 1.2.0-alpha05, also drawable selector works, the color one doesn't.

So, in your layout xml:

<com.google.android.material.textfield.TextInputLayout
...
app:boxStrokeColor="@drawable/selector_box_stroke_color"
...
>

[nicolasCastro]

Hey,
I was looking to change the 'defaultStrokeColor' programmatically and I did it like this:

fun setDefaultBoxColor(color: Int) {
    try {
        val defaultStrokeColorField: Field = TextInputLayout::class.java.getDeclaredField("defaultStrokeColor")
        defaultStrokeColorField.isAccessible = true
        defaultStrokeColorField.set(this, color)
    } catch (e: Exception) {
        e.printStackTrace()
    }
}

[JonathanFStewart]

I can confirm this is still not working on 1.1.0 or 1.2.0-alpha06 with either the ColorSelector or setting the color to a static color. This issue needs to be reopened.

[platramos]

I'm currently experiencing the same issues. I can override boxStrokeColor in the xml like so:

However, doing it via code like I need does not change the boxStrokeColor:

This is what my color state list looks like:

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

I need to override boxStrokeColor programmatically so any guidance would be greatly appreciated

[m-i-n-a-r]

Still broken on 1.2.0-beta01. I've been waiting for the fix for a year now.

[wcshi]

@damon-beaven please open a separate issue about changing this cursor color.

[leticiarossi]

To all the people who say that it is still broken, can you provide more info? The fix introduced in https://github.com/material-components/material-components-android/commit/dc88b3e45fc857404bc2e07976fc037e541e98b8 was a setter to set a CSL to change the stroke color. Are you creating a CSL and calling setBoxStrokeColorStateList? If you are and still having issues, provide a sample app that reproduces the bug.

The CSL should follow the format of mtrl_outlined_stroke_color.xml

@platramos if you call setBoxStrokeColorStateList and pass that CSL it should work

[platramos]

@platramos if you call setBoxStrokeColorStateList and pass that CSL it should work

@leticiarossi That worked like a charm, thanks for the help :)