美文网首页
Android EditText密码可见、不可见的切换

Android EditText密码可见、不可见的切换

作者: 100个大西瓜 | 来源:发表于2021-09-13 16:39 被阅读0次

    简单的效果图如下:


    密码不可见 密码可见
       <EditText
            android:id="@+id/edittext_password"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:hint="@string/hotspot_password_hint"
            android:imeOptions="flagForceAscii"
            android:inputType="textPassword"
            android:maxLength="63"/>
    
         private EditText mEditTextPassword = view.findViewById(R.id.edittext_wifi_password);
    

    密码可见状态切换

        /**
         * 切换显示密码
         *
         * @param showPassWord
         */
        private void togglePassword(boolean showPassWord) {
            final int selectionEnd = mEditTextPassword.getSelectionEnd();
            final int selectionStart = mEditTextPassword.getSelectionStart();
            mEditTextPassword.setInputType(
                    InputType.TYPE_CLASS_TEXT |
                            (showPassWord ?
                                    InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD :
                                    InputType.TYPE_TEXT_VARIATION_PASSWORD));
            mEditTextPassword.setSelection(selectionStart, selectionEnd);
        }
    

    kotlin版本的,保持光标不变

    package your.pkg.name;
    
    import android.os.Bundle
    import android.support.v7.app.AppCompatActivity
    import android.text.InputType
    import android.widget.CheckBox
    import android.widget.EditText
    
    class MainActivity : AppCompatActivity() {
        private lateinit var mCheckBox: CheckBox
        private lateinit var mEditText: EditText
    
        override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            setContentView(R.layout.activity_main)
    
            mEditText = findViewById<EditText>(R.id.edittext_password)
            mCheckBox = findViewById<CheckBox>(R.id.checkbox)
            mCheckBox.setOnCheckedChangeListener { _, checked ->
                togglePasswordVisible(checked)
            }
        }
    
        private fun togglePasswordVisible(checked: Boolean) {
            mEditText.apply {
                val selection =
                    if (selectionStart == selectionEnd) {
                        selectionEnd
                    } else {
                        text.length
                    }
                val selectionStart = selectionStart
                val selectionEnd = selectionEnd
                inputType = InputType.TYPE_CLASS_TEXT or
                        if (checked) {
                            InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD
                        } else {
                            InputType.TYPE_TEXT_VARIATION_PASSWORD
                        }
                //setSelection(selection)
                setSelection(selectionStart, selectionEnd)
            }
        }
    }
    

    切换按钮可以使用一个Checkbox

        <CheckBox
            android:id="@+id/checkbox"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:button="@drawable/password_checkbox_button"
            android:buttonTint="@color/teal_700"
            android:checked="false"
            android:gravity="center"
            android:minWidth="0dp"
            android:minHeight="0dp"/>
    

    其中 password_checkbox_button 内容如下:

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:drawable="@drawable/icon_password_visible" android:state_checked="true" />
        <item android:drawable="@drawable/icon_password_invisible" />
    </selector>
    

    icon_password_visible.xml 如下:

    <vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="20dp"
        android:height="20dp"
        android:viewportWidth="1024"
        android:viewportHeight="1024">
        <path
            android:fillColor="#ffffff"
            android:pathData="M511.37,388.95c-58.97,0 -104.07,45.1 -104.07,104.07s45.1,104.07 104.07,104.07 104.07,-45.1 104.07,-104.07S570.34,388.95 511.37,388.95zM511.37,666.46c-97.13,0 -173.45,-76.32 -173.45,-173.45 0,-97.13 76.32,-173.45 173.45,-173.45s173.45,76.32 173.45,173.45C684.81,590.15 608.5,666.46 511.37,666.46zM511.37,232.85c-173.45,0 -322.61,107.54 -381.58,260.17 58.97,152.63 208.13,260.17 381.58,260.17s322.61,-107.54 381.58,-260.17C833.98,340.38 684.81,232.85 511.37,232.85z" />
    </vector>
    
    密码可见

    icon_password_invisible.xml 如下

    <vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="20dp"
        android:height="20dp"
        android:viewportWidth="1024"
        android:viewportHeight="1024">
        <path
            android:fillColor="#ffffff"
            android:pathData="M505.05,388.62l107.71,107.71c0,-3.47 0,-3.47 0,-6.95 0,-59.07 -45.17,-104.24 -104.24,-104.24C508.52,388.62 508.52,388.62 505.05,388.62zM355.64,416.42l52.12,52.12c0,10.42 0,17.37 0,24.32 0,59.07 45.17,104.24 104.24,104.24 6.95,0 13.9,0 24.32,-3.48l52.12,52.12c-24.32,13.9 -48.64,20.85 -76.44,20.85 -97.29,0 -173.73,-76.44 -173.73,-173.73C338.27,465.06 345.21,440.74 355.64,416.42zM164.53,225.32l79.92,79.92 13.9,13.9c-59.07,45.17 -104.24,104.24 -128.56,173.73 59.07,152.88 208.48,260.6 382.21,260.6 52.12,0 104.24,-10.42 152.88,-27.8l13.9,13.9 100.76,100.76 45.17,-45.17 -615.01,-615.01L164.53,225.32zM512,319.13c97.29,0 173.73,76.44 173.73,173.73 0,20.85 -3.48,45.17 -13.9,62.54l100.76,100.76c52.12,-45.17 93.81,-100.76 118.14,-163.31 -59.07,-152.88 -208.48,-260.6 -382.21,-260.6 -48.64,0 -93.81,10.42 -138.99,24.32l76.44,76.44C466.83,322.6 491.15,319.13 512,319.13z" />
    </vector>
    
    密码不可见

    矢量图是来自阿里巴巴矢量图库的,具体哪一个忘记了

    相关文章

      网友评论

          本文标题:Android EditText密码可见、不可见的切换

          本文链接:https://www.haomeiwen.com/subject/bhsfgltx.html