更改蒙版密码选择器的颜色

时间:2016-08-30 09:28:10

标签: android android-textinputlayout android-color

enter image description here

正如你在图片中看到的,我有一个黑色背景和白色文本的Android应用程序。然而实际上有一个" Show Text"看起来像眼睛的图标"并且它也是黑色的:(。有没有办法改变它的颜色?

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>

的strings.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>

7 个答案:

答案 0 :(得分:25)

Ok guys I found the right answer, there IS a way to customize the color of it. https://developer.android.com/reference/android/support/design/widget/TextInputLayout.html#attr_android.support.design:passwordToggleTint

setPasswordVisibilityToggleTintList(ColorStateList)

Update: You can directly add following attribute in the TextInputLayout:

app:passwordToggleTint="#FFF"

答案 1 :(得分:8)

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

按照以下步骤更改切换画面的颜色:

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

    <?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">
    
  3. 现在您的TextInputLayout将更改其可绘制颜色。

答案 2 :(得分:4)

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

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

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

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

答案 3 :(得分:4)

这是以编程方式执行此操作的好方法:

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

在TextInputLayout对象上调用此方法。

答案 4 :(得分:1)

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"/>

答案 5 :(得分:0)

添加可绘制文件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>

将此行android:background="@drawable/selector"

添加到您的EditText中
    <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);
        }
    }
};

答案 6 :(得分:0)

如果您使用edittext或texteditlayout的背景,则密码可见性切换隐藏在背景下。因此,删除背景或创建自定义样式,并将其作为xml布局中edittext的主题。

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

如果你仍然面临问题或者你没有保留任何背景,那么改变应用程序本身的主题,因为那里确定了主要颜色。

这是其他不适用的解决方法。这是我从google docs本身获得的,

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