如何在android中单击按钮时隐藏和显示密码？答案

【问题标题】：How to hide and show password on button click in android?如何在android中单击按钮时隐藏和显示密码？
【发布时间】：2024-05-23 13:05:01
【问题描述】：

当按下按钮时想要显示密码，否则它应该被隐藏或者说是虚线。我已经应用了以下代码，但它不起作用。任何帮助，将不胜感激。

 button.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View view, MotionEvent motionEvent) {
            if(button.isPressed()) {
                upass.setInputType(InputType.TYPE_TEXT_VARIATION_PASSWORD);
                return true;
            }
            return true;
        }
   });

【问题讨论】：

标签： android button ontouchlistener ontouch

【解决方案1】：

您使用了OnTouchListener，它为您提供MotionEvent。使用它们！无需检查按钮是否再次按下，只要您按下它MotionEvent就在那里。

显示密码字段，密码为：inputType = TYPE_CLASS_TEXT | TYPE_TEXT_VARIATION_VISIBLE_PASSWORD

当按下按钮MotionEvent.ACTION_UP 这样你就可以看到文本了。当MotionEvent.ACTION_DOWN 保持原样时。

 button.setOnTouchListener(new OnTouchListener() {
    public boolean onTouch(View v, MotionEvent event) {

            switch ( event.getAction() ) {

            case MotionEvent.ACTION_UP:
            editText.setInputType(InputType.TYPE_CLASS_TEXT | InputType.TYPE_TEXT_VARIATION_PASSWORD);
            break;

            case MotionEvent.ACTION_DOWN:
            editText.setInputType(InputType.TYPE_CLASS_TEXT);
            break;

            }
            return true;
            }
            });

【讨论】：

【解决方案2】：

showhide.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                global.hideKeyboard();

                if(showhide.getText().equals("Hide"))
                {
                    showhide.setText("Show");
                    etPassword.setTransformationMethod(PasswordTransformationMethod.getInstance());
                }
                else if(showhide.getText().equals("Show"))
                {
                    showhide.setText("Hide");
                    etPassword.setTransformationMethod(HideReturnsTransformationMethod.getInstance());
                }
            }
        });

【讨论】：

【解决方案3】：

您不应该重新发明*。使用它：

<android.support.design.widget.TextInputLayout
android:id="@+id/passwordLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:passwordToggleEnabled="true">

<android.support.design.widget.TextInputEditText
    android:id="@+id/password"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:inputType="textPassword"/>

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

属性app:passwordToggleEnabled 显示/隐藏你想要的按钮。请注意，您还必须将此字符串添加到应用的 build.gradle：

compile 'com.android.support:design:25.1.0'

【讨论】：

它不工作。给出错误 - 错误：（123）在包'android'中找不到属性'passwordToggleEnabled'的资源标识符。 @Hetfieldan24
看起来您使用的是 android:passwordToggleEnabled="true"> 而不是 app:passwordToggleEnabled="true"。请张贴您的xml文件。你把 xmlns:app="schemas.android.com/apk/res-auto";在这个文件的根布局中？
@Hetfieldan24 就像一个魅力。这必须是公认的答案

【解决方案4】：

增强的密码输入视图：切换密码的可见性。嘿！我决定在延迟之后继续写博客来分享更多关于 Android 开发的东西。今天先从一个简单的开始：密码输入框。

增强的密码输入。通常，登录或注册 UI 表单有一些密码输入字段。 Android SDK 提供了一种简单的方法来输入带有隐藏字符的字段：EditText 和 inputType="textPassword"。很简单。但是，如果您需要输入一些又长又复杂的密码，这可能会有点乏味：输入类型很容易，然后您需要重新开始输入密码。

解决方案。因此，为了使密码输入更容易，我们可以实现一个简单但非常有效的解决方案：在输入字段的右边缘显示一个图标，当您点击图标时 - 输入的密码变得可见，当您抬起手指时 - 它再次仅显示模糊的字符。简单、有效且安全！

至少有三种明显的可能方法可以实现这一目标：在布局中编写默认的 Android SDK 视图并将行为逻辑放入父 Fragment/Activity 制作一个组合的 ViewGroup 来封装布局和行为逻辑创建一个 EditText 子类来管理视图右侧的自定义可绘制对象

所有这三种方式都对你有好处。最初我使用第一种方式制作有几个原因，例如：我不喜欢在没有真正必要的情况下创建额外的实体。类似于奥卡姆剃刀原则。 :) 我只需要把它放在一个地方

当然，如果您需要在不同的地方多次查看相同的增强密码视图，请选择第 2 或第 3（首选，因为视图层次结构是扁平的）选项。

实施。因此，使用默认 Android SDK 视图的增强密码视图的最简单实现可能如下所示：

在 XML 布局中的标志中（省略了与主题无关的琐碎参数，如填充）：

<RelativeLayout
...>

  <EditText
      android:id="@+id/fragment_login_password"
      android:inputType="textPassword"
  .../>

  <ImageView
      android:id="@+id/fragment_login_password_visibility"
      android:layout_alignRight="@+id/fragment_login_password"
      android:clickable="true"
      android:src="@drawable/ic_show_password"
  .../>
</RelativeLayout>

在父片段/活动中：

2.1。为了获得良好的用户体验，让我们添加一个文本更改侦听器，以在输入密码值时显示密码可见性，并在空密码视图中隐藏它：

mPasswordView.addTextChangedListener(new TextWatcher() {
    @Override
    public void beforeTextChanged(CharSequence s, int start, int count, int after) {
    }

    @Override
    public void onTextChanged(CharSequence s, int start, int before, int count) {
    }

    @Override
    public void afterTextChanged(Editable s) {
        mPasswordVisibilityView.setVisibility(s.length() > 0 ? View.VISIBLE : View.GONE);
    }
});

2.2。为密码可见性视图设置触摸侦听器以对触摸做出反应

mPasswordVisibilityView.setOnTouchListener(mPasswordVisibleTouchListener);

如果手指在可见性视图内向下，触摸侦听器应用可见字符模式，并在手指向上或离开可见性视图时应用原始密码模式。我们还关注光标位置的持久化，因此用户可以随时切换可见性模式而不会丢失当前输入光标位置。

private View.OnTouchListener mPasswordVisibleTouchListener = new View.OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        final boolean isOutsideView = event.getX() < 0 ||
            event.getX() > v.getWidth() ||
            event.getY() < 0 ||
            event.getY() > v.getHeight();

    // change input type will reset cursor position, so we want to save it
    final int cursor = mPasswordView.getSelectionStart();

    if (isOutsideView || MotionEvent.ACTION_UP == event.getAction())
        mPasswordView.setInputType( InputType.TYPE_CLASS_TEXT | 
                                    InputType.TYPE_TEXT_VARIATION_PASSWORD);
    else
        mPasswordView.setInputType( InputType.TYPE_CLASS_TEXT | 
                                    InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD);

        mPasswordView.setSelection(cursor);
        return true;
    }
};

就是这样！正如我所说，它实现起来非常简单，但它极大地改善了用户体验！

【讨论】：

非常感谢您的解释。但不幸的是 View.OnTouchListener mPasswordVisibleTouchListener.... 这段代码不起作用。 @Anurag_Systematix

【解决方案5】：

这个作品：

   button.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            switch(event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    upass.setTransformationMethod(HideReturnsTransformationMethod.getInstance());
                    return true;
                case MotionEvent.ACTION_UP:
                    upass.setTransformationMethod(PasswordTransformationMethod.getInstance());
                    return true;
            }
            return false;
        }
    });

【讨论】：

【解决方案6】：

在 XML 中这样做，下面是 java 代码

    <LinearLayout
          android:layout_height="wrap_content"
          android:layout_width="fill_parent"
          android:orientation="vertical"
          >
          <RelativeLayout
              android:id="@+id/REFReLayTellFriend"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:orientation="horizontal"
              >
          <EditText
              android:id="@+id/etpass1"
              android:layout_width="fill_parent"
              android:layout_height="wrap_content"
              android:background="@android:color/transparent"
              android:bottomLeftRadius="10dp"
              android:bottomRightRadius="50dp"
              android:fontFamily="@font/frutiger"
              android:gravity="start"
              android:inputType="textPassword"
              android:hint="@string/regpass_pass1"
              android:padding="20dp"
              android:paddingBottom="10dp"
              android:textColor="#000000"
              android:textColorHint="#d3d3d3"
              android:textSize="14sp"
              android:topLeftRadius="10dp"
              android:topRightRadius="10dp"/>
              <ImageButton
                  android:id="@+id/imgshowhide1"
                  android:layout_width="40dp"
                  android:layout_height="20dp"
                  android:layout_marginTop="20dp"
                  android:layout_marginRight="10dp"
                  android:background="@drawable/showpass"
                  android:layout_alignRight="@+id/etpass1"/>
          </RelativeLayout>    

 boolean show=true;
 //on image click inside password do this
 if(show){
                imgshowhide2.setBackgroundResource(0);
                imgshowhide2.setBackgroundResource(R.drawable.hide);
                etpass2.setInputType(InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD);
                etpass2.setSelection(etpass2.getText().length());

                show=false;
            }else{
                imgshowhide2.setBackgroundResource(0);
                imgshowhide2.setBackgroundResource(R.drawable.showpass);
                //etpass1.setInputType(InputType.TYPE_TEXT);
                etpass2.setInputType(InputType.TYPE_CLASS_TEXT |
                        InputType.TYPE_TEXT_VARIATION_PASSWORD);
                etpass2.setSelection(etpass2.getText().length());
                show=true;
            }

【讨论】：