Android-EditText实现小眼睛按钮显示密码

Android-EditText实现小眼睛按钮显示密码

1、密码框如何实现

在进行安卓开发时，需要获取用户输入内容我们通常需要使用EditText组件获取用户输入。在获取密码等敏感信息时就要对输入内容进行隐藏处理。实现这一需求，将EditText的inputType属性设置为textPassword模式即可。

xml布局时

 android:inputType="textPassword"

java代码布局

this.EditText.setInputType(InputType.TYPE_CLASS_TEXT |
 InputType.TYPE_TEXT_VARIATION_PASSWORD);

以上将EditText文本框设置为隐藏模式

2、添加小眼睛按钮

小眼睛类似的图标，是一个image。我们可以在将一个imageview布局到对应位置，然后添加其点击事件实现，缺点是大小和其他布局不好确定，适配相对麻烦。

另外一种方式我们可以通过TextView和EditText组件可以设置的4个方向的drawable实现。

xml布局时添加drawable

android:drawableRight="@drawable/password_eye_icon_idle"

以上是通过xml布局的方式设置了右边的drawable，其他三个方向以此类推。此方式方便的设置了drawable，缺点是无法在xml中调整drawable大小，可在代码中调整。

//this.EditText伪代码表示方法，指EditText对象
Drawable rightDrawable=this.EditText.getCompoundDrawables()[2];//获取drawable对象，
//下标0~3依次对应left、top、right、bottom方向的drawable

rightDrawable.setBounds(-10,0,50,70);//设置drawable大小

java代码添加drawable

//通过资源拿到对应drawable对象
 Drawable drawable = getResources().getDrawable(R.drawable.password_eye_icon_idle);
 //设置drawable大小
 drawable.setBounds(-10, 0, 35, 30);
 //将drawable设为EditText的drawable，4个参数分别是left、top、right、bottom
 //这里设置了right位置的drawable
 this.EditText.setCompoundDrawables(null, null, drawable, null);

//这样便成功添加了drawable并调整大小，需要取消对应位置的drawable只需要再设置null即可

this.EditText.setCompoundDrawables(null, null, null, null);

通过上面两种方法即可添加需要的drawable

3、小眼睛点击事件

第二点介绍了如何添加EditText的drawable，该组件并没有实现好的drawable点击事件，接下来介绍如何给drawable添加点击事件。

通过重写EditText.onTouchEvent方法添加drawable的点击事件。
继承EditText并重写EditText.onTouchEvent方法。

private RightListener rightListener;//通过set方法传入
    @Override
    public boolean onTouchEvent(MotionEvent event) {
         //EditText按下事件判断
        if (event.getAction() == MotionEvent.ACTION_DOWN) {
            //拿到对应方向的drawable
            Drawable rightDrawable = getCompoundDrawables()[2];
            //判断手指按下的位置是否在drawable上
            if (rightDrawable != null && event.getRawX() >= (getRight() - 
             rightDrawable.getBounds().width())) {
             //执行事件具体处理事务，通过回调的方式传入
                rightListener.OnDrawbleRightClick(this);
                //返回true表示该事件以处理  
                return true;
            }

        }
        return super.onTouchEvent(event);
    }

具体点击事件实现

this.EditText.setRightListener(new RightListener() {
            @Override
            public void OnDrawbleRightClick(View view) {
                Drawable drawable =null;
                if (!flog){
                    drawable= getResources().getDrawable(R.drawable.password_eye_icon_selected);
                   //将密码框设置成明文模式      
                     ((EditText)view).setTransformationMethod(HideReturnsTransformationMethod.getInstance());
                    flog=!flog;
                }else {
                    drawable= getResources().getDrawable(R.drawable.password_eye_icon_idle);
                    //将密码框设置成隐藏模式 
                    ((EditText)view).setTransformationMethod(PasswordTransformationMethod.getInstance());

                    flog=!flog;
                }

                drawable.setBounds(-10, 0, 35, 30);
                ((EditText)view).setCompoundDrawables(null, null, drawable, null);
            }
        });

4、如何设置EditText显示或隐藏密码

在EditText为 android:inputType="textPassword"模式下

//密码框显示密码
this.EditText.setTransformationMethod(HideReturnsTransformationMethod.getInstance());
//密码框隐藏密码
this.EditText.setTransformationMethod(PasswordTransformationMethod.getInstance());