0

I am trying to implement a password field with an eye icon inside of it.
I am using <android.support.design.widget.TextInputLayout> for animation purposes.

The eye icon however keeps on displaying under the EditText.

Here is my code:

<android.support.design.widget.TextInputLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="5dp"
                android:layout_marginTop="5dp">

                <EditText
                    android:id="@+id/input_password"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:hint="Password"
                    android:inputType="textPassword" />

                <ImageView
                    android:id="@+id/fragment_login_password_visibility"
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    android:layout_alignRight="@+id/fragment_login_password"
                    android:clickable="true"
                    android:src="@drawable/ic_show_password" />

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

Any help is highly appreciated.

Phantômaxx
  • 37,901
  • 21
  • 84
  • 115
abedzantout
  • 802
  • 4
  • 15
  • 28
  • 1
    I think you should look at this post http://stackoverflow.com/questions/22297073/how-to-programatically-set-drawableright-on-android-edittext – OneCricketeer Apr 02 '16 at 15:22

1 Answers1

4

Add android:drawableLeft="@drawable/ic_show_password" to your EditText.
And get rid of the ImageView.

You can use compound drawables to put an icon to the left (as in my example), to the right, top and/or bottom of a View.

Phantômaxx
  • 37,901
  • 21
  • 84
  • 115