android - 如何从 com.google.android.material.textfield.TextInputLayout 中删除背景错误红色

Question

我是使用 Material 设计的新手。我有自定义背景，但我的 TextInputEditText当我设置错误消息时背景红色；它在 TextInputEditText 中显示.
如何从 TextInputEditText 中删除此红色错误背景,
这是我的设计 xml

<com.google.android.material.textfield.TextInputLayout
            android:id="@+id/userIdLayout"
            android:layout_width="wrap_content"
            app:boxBackgroundMode="none"
            app:boxBackgroundColor="@android:color/transparent"
            app:hintEnabled="false"
            app:errorEnabled="true"
            app:errorTextColor="@color/red"
            android:layout_height="wrap_content">

            <com.google.android.material.textfield.TextInputEditText
                android:id="@+id/userId"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:backgroundTintMode="@null"
                android:background="@drawable/border_blue_fill_white_rectangle"
                android:drawableStart="@drawable/ic_account"
                android:drawablePadding="8dp"
                android:ems="14"
                android:fontFamily="@font/carrois_gothic"
                android:hint="@string/userId"
                android:longClickable="false"
                android:inputType="text"
                android:maxLines="1"
                android:paddingStart="16dp"
                android:paddingTop="12dp"
                android:paddingEnd="24dp"
                android:paddingBottom="12dp"
                android:text="@={LoginViewModel.userId}"
                android:textSize="16sp"
                android:textColor="@color/colorPrimaryDark"
                android:importantForAutofill="no" />

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

这是我的 style.xml

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="colorError">@android:color/transparent</item>
    <item name="windowActionBar">false</item>
    <item name="editTextBackground">@color/white</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:actionMenuTextAppearance">@style/AppTheme.PopupOverlay</item>
</style>

这是我的自定义背景

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="10dp"
android:shape="rectangle"
android:color="@android:color/transparent" >
<solid android:color="@android:color/white" />
<corners android:radius="32dp" />
    <stroke
        android:width="2px"
        android:color="@color/colorPrimaryDark" />
</shape>

这是图片

Answer 1

不要使用 android:background在 TextInputEditText .只需应用样式 Widget.MaterialComponents.TextInputLayout.OutlinedBox :

<com.google.android.material.textfield.TextInputLayout
            app:boxStrokeColor="@color/..."
            app:boxBackgroundColor="@color/white"
            android:hint="..."
            app:startIconDrawable="@drawable/...."
            app:shapeAppearanceOverlay="@style/corner32"
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
            ....>

            <com.google.android.material.textfield.TextInputEditText
                android:id="@+id/userId"
                android:drawablePadding="8dp"
                android:ems="14"
                android:longClickable="false"
                android:inputType="text"
                android:maxLines="1"
                android:paddingStart="16dp"
                android:paddingTop="12dp"
                android:paddingEnd="24dp"
                android:paddingBottom="12dp"
                android:text="User id"
                android:textSize="16sp"
                android:textColor="@color/colorPrimaryDark"
                android:importantForAutofill="no"
                .... />

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

用这个简单的 shapeAppearanceOverlay

<style name="corner32" parent="">
    <item name="cornerSize">32dp</item>
</style>