Material-components-android: [TextInputLayout] Show/Hide Password Icons are Mixed Up

Created on 1 Apr 2020 · 3Comments · Source: material-components/material-components-android

Description:

I am using:

<com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputEditText />
</com.google.android.material.textfield.TextInputLayout>

with
<item name="passwordToggleEnabled">true</item>

To create the UI for a Password entry with a show/hide password toggle. The behavior matches the specs from the Material Guidelines shown here. However, these feel entirely counter-intuitive AND Google's own behavior for other apps does not match this.

Current Behavior
component_show_password
component_hide_password

Expected Behavior (and Google's own behavior)
hide_password
show_password

Android API version:
All versions

Material Library version:
1.2.0-alpha05

Device: All devices

bug

Source

zkovar

👍3

Most helpful comment

Thanks for filing this @zkovar. I'm bringing this up with design to see what they have to say.

hunterstich on 3 Apr 2020

🎉2

All 3 comments

Thanks for filing this @zkovar. I'm bringing this up with design to see what they have to say.

hunterstich on 3 Apr 2020

🎉2

design agreed the current behavior should be flipped, so that the icon shows the action (what will happen after the click), instead of how now it shows the current status