SetError Icon overlaps other edittext icons

Viewed 949

setError icon overlaps my other icon in the edittext

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/text_input_layout_password"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/white"
    android:paddingTop="10dp"
    app:hintTextAppearance="@style/TextAppearence.App.TextInputLayout"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/view_separator_2"
    app:passwordToggleDrawable="@drawable/custom_show_hide_password_black"
    app:passwordToggleEnabled="true"
    app:passwordToggleTint="@color/black">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/login_password"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="10"
            android:background="@null"
            android:contentDescription="@string/acc_password"
            android:hint="@string/password"
            android:imeOptions="actionDone"
            android:inputType="textPassword"
            android:padding="10dp"
            android:textColor="@color/color_1D1D1D"
            android:textColorHint="@color/color_5A5D63"
            android:textSize="14sp"
            tools:text="Password" />

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

In this image Eye icon and Exclamation mark are overlapped , i want it to be side by side first showerror message icon and then eye icon , is there any way to do it.

Image

2 Answers

You just need to call this function.

passwordTxtInputLayout = findViewById(R.id.text_input_layout_password);
    etPassword = findViewById(R.id.login_password);
    if (etPassword != null) {
        etPassword.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count, int after) {


            }

            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {
                passwordTxtInputLayout.setEndIconVisible(true);

            }

            @Override
            public void afterTextChanged(Editable s) {

            }
        });

and call this function whenever the password length is less than and equal to zero

passwordTxtInputLayout.setEndIconVisible(false);

Make sure this function should be called before calling setError otherwise eyeIcon will be disable.

Try this code. Since you are having your app:passwordToggleDrawable in TextInputLayout you should call setError() also in textInputLayout. Please refer the code below

TextInputLayout textInputLayout = findViewById(R.id.text_input_layout_password);
textInputLayout.setError("Password is empty");
Related