TextInputLayout密码切换带圆角 [英] TextInputLayout passwordToggle with rounded corners

问题描述

我正在使用Android设计库版本25.1.1中的 TextInputLayout .使用以下代码:

I'm using TextInputLayout from android design library version 25.1.1. With the following code:

<android.support.design.widget.TextInputLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:local="http://schemas.android.com/apk/res-auto"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  local:passwordToggleEnabled="true"
  local:hintEnabled="false">
  <android.support.design.widget.TextInputEditText
    android:id="@+id/confirmationEditText"
    android:singleLine="true" />
</android.support.design.widget.TextInputLayout>

但是，当按下密码切换图标时，其波纹效果会绘制在TextInput背景的上方:

But when password toggle icon is pressed, its ripple effect is drawn above the background of TextInput:

如何为 passwordToggle 设置圆角半径?我是否可以引用其现有背景并用所需的属性包装"(如何找到用于切换的默认可绘制对象的路径)?

How can I set rounded corners radius for passwordToggle? Can I reference its existing background and "wrap" it with needed properties (how to find Path for default drawable that is used by toggle)?

推荐答案

我试图在新项目上实施以了解您的情况.

I tried to implement on fresh project to understand your scenario .

请查看解决方案.我已附上屏幕截图.

Please take a look into solution.I have attached screenshot of how it will look.

您必须在drawable文件夹中包含drawable并将其设置为 TextInputEditText

You have to include drawable in drawable folder and set it into background of TextInputEditText

round_corner_toggle.xml

round_corner_toggle.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:left="20dp">
        <shape android:shape="rectangle" >
            <size android:height="20dp" />
            <solid android:color="#d8d8d8" />
            <corners android:radius="5dp" />
        </shape>
    </item>

    <item android:right="60dp">
        <shape android:shape="rectangle" >
            <size android:height="20dp" />
            <solid android:color="#ecf0f1" />
            <corners android:radius="5dp" />

        </shape>
    </item>
</layer-list>

TextInputLayout的内容

Content for TextInputLayout

            <android.support.design.widget.TextInputLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:counterEnabled="true"
                app:counterMaxLength="8"
                android:background="#FFFFFF"
                app:passwordToggleEnabled="true"
                app:passwordToggleTint="@color/colorPrimary">

                <android.support.design.widget.TextInputEditText
                    android:id="@+id/tietPassword"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:hint="Password"
                    android:background="@drawable/round_corner_toggle"
                    android:inputType="textPassword"
                    android:padding="@dimen/activity_horizontal_margin"
                    android:maxLength="8" />
            </android.support.design.widget.TextInputLayout>
    </LinearLayout>

这篇关于TextInputLayout密码切换带圆角的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！