【问题标题】:Change color of mask password selector更改掩码密码选择器的颜色
【发布时间】:2016-08-30 09:28:10
【问题描述】:

正如您在图片中看到的,我有一个黑色背景和白色文本的 android 应用程序。然而实际上有一个“显示文本”图标看起来像一个“眼睛”,它也是黑色的:(。有没有办法改变它的颜色?

activity_login.xml

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:fitsSystemWindows="true"
    android:background="@color/black">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="56dp"
        android:paddingLeft="24dp"
        android:paddingRight="24dp">

        <ImageView android:src="@drawable/logo"
            android:layout_width="wrap_content"
            android:layout_height="72dp"
            android:layout_marginBottom="24dp"
            android:layout_gravity="center_horizontal" />

        <!-- Email Label -->
        <android.support.design.widget.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:layout_marginBottom="8dp"
            android:textColorHint="#ffffff">
            <EditText android:id="@+id/input_email"
                android:theme="@style/MyEditTextTheme"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:inputType="textEmailAddress"
                android:hint="E-Mail Address"/>
        </android.support.design.widget.TextInputLayout>

        <!-- Password Label -->
        <android.support.design.widget.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:layout_marginBottom="8dp"
            android:textColor="#ffffff"
            android:textColorHint="#ffffff">
            <EditText android:id="@+id/input_password"
                android:theme="@style/MyEditTextTheme"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:inputType="textPassword"
                android:hint="Password"/>
        </android.support.design.widget.TextInputLayout>

        <android.support.v7.widget.AppCompatButton
            android:id="@+id/btn_login"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="24dp"
            android:layout_marginBottom="24dp"
            android:padding="12dp"
            android:text="Login"/>

        <TextView android:id="@+id/link_signup"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="24dp"
            android:text="No account yet? Create one"
            android:textColor="#ffffff"
            android:gravity="center"
            android:textSize="16dip"/>

    </LinearLayout>
</ScrollView>

字符串.xml

<resources>
    <color name="bg_color">#ffffff</color>
    <color name="black">#222222</color>
    <style name="MyEditTextTheme">
        <item name="colorControlNormal">#ffffff</item>
        <item name="colorControlActivated">#ffffff</item>
        <item name="colorControlHighlight">#ffffff</item>
        <item name="colorAccent">@android:color/white</item>
        <item name="android:textColor">#ffffff</item>
        <item name="android:textColorHint">#ffffff</item>
    </style>
</resources>

【问题讨论】:

    标签: android android-textinputlayout android-color


    【解决方案1】:

    rapid3642 的回答指出了正确的方向,但我仍然需要找出究竟什么会起作用。

    按照以下步骤更改切换绘图的颜色:

    1. ~/res/color/ 中创建selector_password_visibility_toggle

      <?xml version="1.0" encoding="utf-8"?>
      <selector xmlns:android="http://schemas.android.com/apk/res/android">
          <!-- When password is shown as text, the drawable will be off_white coloured -->
          <item android:color="@color/off_white" android:state_checked="true"/>
          <item android:color="@android:color/white"/>
      
      </selector>
      
    2. passwordToggleTintModepasswordToggleTint 添加到您的TextInputLayout,如下所示:

      <android.support.design.widget.TextInputLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          app:passwordToggleTintMode="src_atop"
          app:passwordToggleTint="@color/selector_password_visibility_toggle"
          app:passwordToggleEnabled="true">
      

    现在您的TextInputLayout 将更改其可绘制颜色。

    【讨论】:

    • 感谢您添加对您有用的内容!我希望这对其他人有帮助! :)
    【解决方案2】:

    好吧,伙计们,我找到了正确的答案,有一种方法可以自定义它的颜色。 https://developer.android.com/reference/android/support/design/widget/TextInputLayout.html#attr_android.support.design:passwordToggleTint

    setPasswordVisibilityToggleTintList(ColorStateList)
    

    更新:您可以直接在TextInputLayout中添加以下属性:

    app:passwordToggleTint="#FFF"
    

    【讨论】:

    • 太棒了
    • 仅供参考,passwordToggleTint 现已弃用。应该使用 endIconTint
    【解决方案3】:

    这是一种以编程方式进行的好方法:

    setPasswordVisibilityToggleTintList(AppCompatResources.getColorStateList(context, R.color.white));
    

    在 TextInputLayout 对象上调用此方法。

    【讨论】:

      【解决方案4】:

      添加可绘制文件selector.xml:

      <?xml version="1.0" encoding="utf-8"?>
      <selector xmlns:android="http://schemas.android.com/apk/res/android">
          <item android:state_pressed="true" android:drawable="@color/dim_orange_btn_pressed" />
          <item android:state_focused="true" android:drawable="@color/dim_orange_btn_pressed" />
          <item android:drawable="@android:color/white" />
      </selector>
      

      在这一行添加您的 EditText android:background="@drawable/selector"

          <LinearLayout
          android:orientation="vertical"
          android:layout_width="match_parent"
          android:layout_height="wrap_content">
                 <EditText android:id="@+id/txt_pass"
                  android:theme="@style/MyEditTextTheme"
                  android:layout_width="match_parent"
                  android:background="@drawable/selector"
                  android:layout_height="wrap_content"
                 android:inputType="textPassword"
                  android:hint="E-Mail Address"/>
      
              <ImageButton
              android:id="@+id/btn_eye"
              android:layout_width="fill_parent"
              android:layout_height="wrap_content"
              android:src="@drawable/eye"
              />
         </LinearLayout>
      

      在您的代码中:

      buttonEye.setOnTouchListener(new OnTouchListener() {
          @Override
          public boolean onTouch(View v, MotionEvent event) {
              if(event.getAction() == MotionEvent.ACTION_DOWN) {
      
                  txt_pass.setInputType(InputType.TYPE_TEXT_VARIATION_VISIBLE_PASSWORD);
      
              } else if (event.getAction() == MotionEvent.ACTION_UP) {
      
                   txt_pass.setInputType(InputType.TYPE_TEXT_VARIATION_PASSWORD);
              }
          }
      };
      

      【讨论】:

      • 哇,感谢您的有用编辑和快速响应! :),我尝试了这个编辑,但它说我需要为每个项目命名,项目名称是什么重要吗?总菜鸟在这里抱歉。如果您愿意解释更多。
      • 感谢您的编辑更清楚,但是我这样做了,但它使整个字段变白,我试图实现的目标是只制作“眼睛”或“密码掩码指示器”白色的。有没有办法做到这一点?对不起,如果我之前不清楚。
      • 我可能绝对是错的,但我不认为添加一个监听器并将其设置为显示或隐藏会完成我试图实现的颜色变化,我是一个菜鸟,所以我在这里可能错了,但如果我是请解释一下,以便我能理解更多:)
      【解决方案5】:

      在您的布局中添加以下 xmlns:app。

      xmlns:app="http://schemas.android.com/apk/res-auto"

      现在在 EditText 中相应地设置 passwordToggleEnabled & passwordToggleTint

      app:passwordToggleEnabled = "true"
      app:passwordToggleTint="#FFFFFF"

      【讨论】:

        【解决方案6】:

        如果您使用背景编辑文本或文本编辑布局,则密码可见性切换隐藏在背景下。所以移除背景或创建自定义样式,并将其作为 xml 布局中 edittext 的主题。

         <style name="EditText_theme" parent="">
                <item name="passwordToggleTintMode">src_over</item>
            </style>
        

        如果您仍然遇到问题或者您没有保留任何背景,请更改应用程序本身的主题,因为主颜色在那里确定。

        这是对我不起作用的其他解决方法。这是我从 Google 的 Android 文档本身获得的,

         <style name="EditText_theme" parent="">
                <item name="passwordToggleTint">@color/white</item>
            </style>
        

        【讨论】:

          【解决方案7】:
          Create a custom Style.
          
          <style name="PasswordText" parent="TextAppearance.AppCompat">
              <item name="android:textColor">@color/dt_login_text</item>
              <item name="android:textColorPrimary">@color/dt_login_text</item>
          </style>
          
          XML Code. // This will change the password mask color.
          
          <android.support.v7.widget.AppCompatEditText
                      android:layout_width="match_parent"
                      android:layout_height="wrap_content"
                      android:padding="@dimen/padding_6"
                      android:theme="@style/PasswordText"
                      android:layout_margin="@dimen/margin_3"
                      android:gravity="center"
                      android:inputType="textPassword"
                      android:text="Q"/>
          

          【讨论】:

            猜你喜欢
            • 2011-05-16
            • 1970-01-01
            • 1970-01-01
            • 2016-11-26
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多