Question

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

<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的背景上方绘制：

如何为passwordToggle设置圆角半径？我可以引用其现有背景并使用所需属性“包装”它（如何查找切换使用的默认drawable的路径）？

Answer 1

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

请查看解决方案。我附上了它的外观截图。

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

的背景

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的内容

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

Answer 2

只需使用Material Components库和标准的TextInputLayout组件即可。

添加 app:boxCornerRadiusBottomEnd="xxdp" ， app:boxCornerRadiusTopEnd="xxdp" ， app:boxCornerRadiusBottomStart="xxdp" ， {{1 }} 属性。

类似的东西：

app:boxCornerRadiusTopStart="xxdp"

否则，您可以定义自定义样式并使用 <com.google.android.material.textfield.TextInputLayout style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox" app:endIconMode="password_toggle" app:boxCornerRadiusBottomEnd="8dp" app:boxCornerRadiusTopEnd="8dp" app:boxCornerRadiusBottomStart="8dp" app:boxCornerRadiusTopStart="8dp" ...> 属性：

shapeAppearanceOverlay

具有：

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/custom_end_icon"
        android:hint="Hint text"
        style="@style/OutlinedRoundedBox"
        ...>

Answer 3

我知道已经有一段时间了，但是可以将它添加到您的TextInputLayout中：

 app:boxCornerRadiusBottomEnd="20dp"
 app:boxCornerRadiusBottomStart="20dp"
 app:boxCornerRadiusTopEnd="20dp"
 app:boxCornerRadiusTopStart="20dp"

Answer 4

使用自定义形状：

  <shape xmlns:android="http://schemas.android.com/apk/res/android">
         <gradient
            android:endColor="@color/something"
            android:centerColor="@color/something_else"
            android:startColor="@color/something_else_still"
            android:angle="270" />
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>

TextInputLayout passwordToggle with圆角

4 个答案: