使用android中的drawable图标显示和隐藏密码

Question

I have designed a screen with password field using EditText, in the EditText I am using drawableRightIcon which has to show the password visible when we click the drawable button and also replace that drawable icon with another icon? can anyone help please?

Answer 1

Execute the following statements when your image button is clicked

String password= your_editText.getText().toString().trim();
your_editText.setText(password);
your_imgview.setImageResource(R.drawable.new_image)

Answer 2

Following is the code that I'm using currently in my apps for this purpose. We basically put a touch listener to our EditText and identify if the click occurred on the drawable and act accordingly (also switching icons):

getPasswordEditText().setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                final int DRAWABLE_RIGHT = 2; // index

                if (event.getAction() == MotionEvent.ACTION_UP) {
                    if (event.getRawX() >= (getPasswordEditText().getRight() - getPasswordEditText().getCompoundDrawables()[DRAWABLE_RIGHT].getBounds().width())) {
                        if (passwordShown) {
                            passwordShown = false;
                            // 129 is obtained by bitwise ORing InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD
                            getPasswordEditText().setInputType(129);

                            // Need to call following as the font is changed to mono-space by default for password fields
                            getPasswordEditText().setTypeface(Typeface.SANS_SERIF);
                            getPasswordEditText().setCompoundDrawablesWithIntrinsicBounds(0, 0, R.drawable.locked_icon, 0);
                        } else {
                            passwordShown = true;
                            getPasswordEditText().setInputType(InputType.TYPE_TEXT_VARIATION_PASSWORD);

                            getPasswordEditText().setCompoundDrawablesWithIntrinsicBounds(0, 0, R.drawable.unlocked_icon, 0);
                        }

                        return true;
                    }
                }
                return false;
            }
        });

Answer 3

Use the following code to show and hide the password. You can use an ImageView beside the check box.

Used a checkbox (you can use a image button also instead of it using the same concept except that you have to use an onCLickListener instead).

     loginShowHidePassword.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
        @Override
        public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
            // EditText loses the cursor position when you change the InputType
            int curPos = mPasswordView.getSelectionStart();
            if (isChecked) {
                mPasswordView.setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD); 
   imageview.setImageResource(R.drawable.newImage);

            } else {
                mPasswordView.setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD);
   loginShowHidePassword.setImageResource(R.drawable.newImage);

            }
            mPasswordView.setSelection(curPos);
        }
    });

You need to save a new a new image named newImage in drawable.

mPasswordView is the password EditText