textinputlayout password toggle icon is blocked

问题

I do not know how to explain in words but let the attached picture do the talking ya?

Problem

Basically, the setError icon is blocking the password toggle icon.

Initially I thought it to be a simple layout issue where I had played around with the colors & background, etc. However, so many trial & error yet I can't seem to find the solution to the problem.

I'll post my XML here for your reference:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/bokeh"
tools:context=".RegistrationActivity">


<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <ImageView
        android:layout_width="495dp"
        android:layout_height="130dp"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="15dp"
        android:src="@drawable/loginboa" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginLeft="30dp"
    android:layout_marginRight="30dp"
    android:layout_marginTop="10dp"
    android:orientation="vertical"
    android:weightSum="1">

    <EditText
        android:id="@+id/etSignUpUsername"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:drawableLeft="@drawable/ic_user"
        android:drawablePadding="20dp"
        android:background="@drawable/edittext_bg"
        android:hint="Name"
        android:textColorHint="#a3a1a1"
        android:inputType="textPersonName"
        android:padding="10dp"
        android:layout_weight="0.10"/>

    <EditText
        android:id="@+id/etSignUpEmail"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0.10"
        android:drawableLeft="@drawable/ic_email"
        android:drawablePadding="20dp"
        android:background="@drawable/edittext_bg"
        android:layout_marginTop="3dp"
        android:hint="Email"
        android:inputType="textEmailAddress"
        android:padding="10dp"
        android:textColorHint="#a3a1a1" />

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        app:passwordToggleEnabled="true"
        app:hintEnabled="false">

        <EditText
            android:id="@+id/etSignUpPassword"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Password"
            android:textColorHint="#a3a1a1"
            android:inputType="textPassword"
            android:drawableStart="@drawable/ic_password"
            android:background="@drawable/edittext_bg"
            android:layout_marginTop="3dp"
            android:drawablePadding="20dp"
            android:padding="10dp"
            android:layout_weight="0.09"/>

    </android.support.design.widget.TextInputLayout>


    <TextView
        android:id="@+id/tvPasswordHint"
        android:visibility="gone"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="5dp"
        android:text="Password must contain at least 8 characters including 
        one uppercase letter, one lowercase letter, one number &amp; one 
        special character."
        android:textAlignment="center"
        android:textSize="12sp"
        android:textStyle="bold|italic"
        android:textColor="#ff0000"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.623" />

    <EditText
        android:id="@+id/etSignUpDepartment"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0.09"
        android:drawableLeft="@drawable/ic_department"
        android:drawablePadding="20dp"
        android:background="@drawable/edittext_bg"
        android:layout_marginTop="3dp"
        android:hint="Department"
        android:inputType="text"
        android:padding="10dp"
        android:textColorHint="#a3a1a1" />

    <EditText
        android:id="@+id/etSignUpRole"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0.09"
        android:drawableLeft="@drawable/ic_role"
        android:drawablePadding="20dp"
        android:background="@drawable/edittext_bg"
        android:layout_marginTop="3dp"
        android:hint="Role"
        android:inputType="text"
        android:padding="10dp"
        android:textColorHint="#a3a1a1" />

    <Button
        android:id="@+id/btnRegister"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="25dp"
        android:background="@drawable/button_bg"
        android:text="SIGN UP"
        android:textSize="20dp"
        android:textColor="#000000"/>

    <TextView
        android:id="@+id/tvUserLogin"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="8dp"
        android:text="Already have an account? LOGIN NOW! "
        android:textColor="#ba080000"
        android:textAlignment="center"
        android:textSize="14sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.382"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/tvInfo"
        app:layout_constraintVertical_bias="0.437" />

</LinearLayout>
</LinearLayout>

I could have just create another drawable as the red exclamation mark icon but I liked how the error message pops up.

If possible, I'd like to maintain this method but of course with a better layout arrangement. As such, anyone know how I can fix this? Thank you.

回答1:

Assign id to the textinputlayout and setError to textinputlayout, not edittext. Like:

  <android.support.design.widget.TextInputLayout
    android:id="@+id/tilSignUpPassword"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="5dp"
    app:passwordToggleEnabled="true"
    app:hintEnabled="false">

    <EditText
        android:id="@+id/etSignUpPassword"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Password"
        android:textColorHint="#a3a1a1"
        android:inputType="textPassword"
        android:drawableStart="@drawable/ic_password"
        android:background="@drawable/edittext_bg"
        android:layout_marginTop="3dp"
        android:drawablePadding="20dp"
        android:padding="10dp"
        android:layout_weight="0.09"/>

 </android.support.design.widget.TextInputLayout>

In Class:

 //your condition
  .....
  tilSignUpPassword.setError("Message")
  .....

Don't forget to setError(null) after your condition match.

回答2:

Here a way

  <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        app:passwordToggleEnabled="true"
        app:hintEnabled="false">

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <EditText
                android:id="@+id/etSignUpPassword"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Password"
                android:textColorHint="#a3a1a1"
                android:inputType="textPassword"
                android:drawableStart="@drawable/ic_lock_outline_black_24dp"
                android:layout_marginTop="3dp"
                android:padding="10dp"
                android:layout_weight="0.09"/>

            <ImageButton
                android:layout_gravity="center_vertical"
                android:background="@android:color/transparent"
                android:src="@drawable/ic_visibility_black_24dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />

        </LinearLayout>
    </android.support.design.widget.TextInputLayout>

回答3:

I don't know if you already solved the problem. My solution is setting the error to the TextLayout and textLayout.errorIconDrawable = null

来源：https://stackoverflow.com/questions/53277261/textinputlayout-password-toggle-icon-is-blocked

标签

java

android

xml

android-layout

android-textinputlayout