android - 带圆角的 TextInputLayout

Question

如何为登录表单制作圆角？这是我的代码:

<com.google.android.material.textfield.TextInputLayout
        android:id="@+id/editLoginWrapper"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/appTitle"
        android:layout_marginBottom="8dp"
        android:layout_marginTop="18dp">

        <com.google.android.material.textfield.TextInputEditText    
      android:id="@+id/editLogin"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#FFFFFF"
            android:backgroundTint="#FFFFFF"
            android:hint="@string/login_hint"
            android:inputType="text"
            android:textColor="#000000"
            android:padding="7dp"
android:textColorLink="#FFFFFF" />

尝试添加:

style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        app:endIconMode="password_toggle"
        app:boxCornerRadiusBottomEnd="8dp"
        app:boxCornerRadiusTopEnd="8dp"
        app:boxCornerRadiusBottomStart="8dp"
        app:boxCornerRadiusTopStart="8dp"

如所述here但这没有任何区别-角落不会变圆。怎么了？

Answer 1

删除 TextInputEditText 中的 android:background="#FFFFFF" 和 android:backgroundTint="#FFFFFF"。

使用:

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/editLoginWrapper"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/appTitle"
    android:layout_marginBottom="8dp"
    android:hint="Login"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    app:endIconMode="password_toggle"
    app:boxCornerRadiusBottomEnd="8dp"
    app:boxCornerRadiusTopEnd="8dp"
    app:boxCornerRadiusBottomStart="8dp"
    app:boxCornerRadiusTopStart="8dp"
    android:layout_marginTop="18dp">

<com.google.android.material.textfield.TextInputEditText
    android:id="@+id/editLogin"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:inputType="text"
    android:textColor="#000000"
    android:padding="7dp"
    android:textColorLink="#FFFFFF" />

</com.google.android.material.textfield.TextInputLayout>

您还可以使用 shapeAppearanceOverlay 属性来代替声明所有的角:

<com.google.android.material.textfield.TextInputLayout
    app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.App.rounded"

与:

  <style name="ShapeAppearanceOverlay.App.rounded" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">8dp</item>
  </style>