Show and Hide Android EditText Password

Previously we had posted some posts like simple android contact form, material design login screen XML ui design, material design sign up/registration for android, floating label for android using design support library etc. In this tutorial, you will learn to show and hide edittext password in android application. Mobile screen is very small in comparison to desktop so there can be error while typing password in mobile, it is better to put show password option. Here you will learn to put an eye icon for show and hide password.

There are different ways to show and hide password in android like using toggle button, check box, using image icon and so on. But using eye icon is best way to show and hide password and you will learn it here.

Related:
Android Material Design Profile Screen XML UI Design
Android Floating Labels for EditText Using Design Support Library
How to Implement Ripple Effect in Android

Android Example: How to Show and Hide Password in Android Using Eye Icon

Let’s start by adding compile 'com.android.support:appcompat-v7:23.2.0' and compile 'com.github.scottyab:showhidepasswordedittext:0.6' dependencies in your build.gradle file. Build.gradle file will look like below.

build.gradle

XML Layout File

Open your XML layout file and add TextInputLayout widget using design support library. Inside TextInputLayout com.scottyab.showhidepasswordedittext.ShowHidePasswordEditText with app:drawable_hide, app:drawable_show and app:tint_color attributes. Following is the complete content of XML layout file.

res/layout/hide_show_android_edittext_password.xml

Java Activity File

Following is the code of java activity file.

src/HideShowAndroidEditTextPassword.java

Now, run Show and Hide Android EditText Password Using Eye Icon application and type something in the password edittext, there will appear an eye icon in the right side of edit text. After typing any text, click the eye icon then you’ll be able to see your password in the same place.