Show/Hide Password in EditText in Android

To show/hide password in android simply change the attribute dynamically  
android:inputtype = "textpassword" or "text" using this setTransformationMethod

Full code definition is below for show and hide password in edittext

//Show Password
edit_password.setTransformationMethod(HideReturnsTransformationMethod.getInstance());

//Hide Password
edit_password.setTransformationMethod(PasswordTransformationMethod.getInstance());

Here one edittext with input type = password and one eye toggle ImageView button. We have to manage show/hide password using this Imageview onClick Action.

                    <RelativeLayout
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="@dimen/dp10">

                    <EditText
                        android:id="@+id/edit_password"
                        android:layout_width="fill_parent"
                        android:layout_height="@dimen/dp45"
                        android:background="@drawable/edittext_bg"
                        android:hint="@string/employeelogin_form_password"
                        android:inputType="textPassword"
                        android:paddingLeft="@dimen/dp10"
                        android:paddingTop="@dimen/dp10"
                        android:paddingRight="@dimen/dp40"
                        android:paddingBottom="@dimen/dp10"
                        android:text=""
                        android:textColor="@color/postjob_bg"
                        android:textSize="@dimen/dp13" />

                    <ImageView
                        android:id="@+id/show_pass_btn"
                        android:layout_width="@dimen/dp40"
                        android:layout_height="@dimen/dp40"
                        android:layout_alignParentRight="true"
                        android:layout_centerVertical="true"
                        android:layout_marginRight="@dimen/dp5"
                        android:alpha=".5"
                        android:onClick="ShowHidePass"
                        android:padding="@dimen/dp5"
                        android:src="@drawable/show_password" />
                </RelativeLayout>

This is layout preview of Password Editext with Eye Icon On right

In Imageview Tag XML we simply add Attribute android:onClick=”ShowHidePass” for calling onclick function
ShowHidePass() directly in code

public void ShowHidePass(View view){

        if(view.getId()==R.id.show_pass_btn){

        if(edit_password.getTransformationMethod().equals(PasswordTransformationMethod.getInstance())){
        ((ImageView(view)).setImageResource(R.drawable.hide_password);

        //Show Password                 
        edit_password.setTransformationMethod(HideReturnsTransformationMethod.getInstance());
        }
        else{
        ((ImageView)(view)).setImageResource(R.drawable.show_password);

        //Hide Password
        edit_password.setTransformationMethod(PasswordTransformationMethod.getInstance());

        }
        }
        }

One thought on “Show/Hide Password in EditText in Android

Leave a Reply

Your email address will not be published. Required fields are marked *