带有 Material 大纲框的 boxStroke 不起作用

Question

我正在尝试使用 Material 设计为 Android 设计一个非常简单的 UI。

登录界面的想法是 2 个轮廓框，一个用于电子邮件，一个用于密码。密码框应包含一个尾随图标，如果您按下该图标，它应该会显示您的密码。这里没有代码问题，一切都应该由 Material.io

实现

所以我面临的问题是关于 boxStroke。

当你运行应用程序时，你可以清楚地看到boxStroke（但是在密码文本框上，尾随的图标使轮廓消失了）。

一旦您聚焦其中一个文本框，它就会显示如下：

你可以注意到盒子的轮廓已经完全消失了。如果你至少添加一个字符，它会回来：

两个文本框的代码在这里，与 Material.io 主页中的代码几乎相同，我将 post 在此 post 的末尾提供链接material 维基百科：

电子邮件文本框：

    <com.google.android.material.textfield.TextInputLayout
    android:id="@+id/login_email_layout"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:hint="@string/login_hint_email"
    app:boxStrokeWidthFocused="3dp"
    app:errorEnabled="true"
    app:layout_constraintBottom_toTopOf="@+id/login_password_layout"
    app:layout_constraintEnd_toEndOf="@+id/imageView"
    app:layout_constraintStart_toStartOf="@+id/imageView"
    app:layout_constraintTop_toBottomOf="@+id/imageView"
    app:shapeAppearanceOverlay="@style/ShapeAppearance.MaterialComponents.SmallComponent">

    <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@color/textColor" />

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

密码文本框：

    <com.google.android.material.textfield.TextInputLayout
    android:id="@+id/login_password_layout"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:hint="@string/login_hint_password"
    app:endIconMode="password_toggle"
    app:errorEnabled="true"
    app:layout_constraintBottom_toTopOf="@+id/login_forgot_password"
    app:layout_constraintEnd_toEndOf="@+id/login_email_layout"
    app:layout_constraintStart_toStartOf="@+id/login_email_layout"
    app:layout_constraintTop_toBottomOf="@+id/login_email_layout">

    <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textPassword"
        android:textColor="@color/textColor"
        android:visibility="visible" />

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

我不知道为什么尾随的图标使轮廓消失，我也不知道我怎么能做到这一点，即使它是空的，它也应该集中在轮廓上。所以欢迎任何帮助。

提前致谢。

PD: 当前使用1.2.1 material 版本，尝试切换到1.3.1-alpha03 版本，但它不会显示任何文本框。

Material Outlined Box

编辑： 添加 graddle:app 以防它可以为您提供更多信息：

dependencies {
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation 'androidx.appcompat:appcompat:1.2.0'
implementation 'androidx.constraintlayout:constraintlayout:2.0.2'
implementation platform('com.google.firebase:firebase-bom:25.12.0')
implementation 'com.google.firebase:firebase-analytics'
implementation 'com.google.android.material:material:1.2.1'
implementation 'com.google.gms:google-services:4.3.4'
implementation 'pl.droidsonroids.gif:android-gif-drawable:1.2.19'
implementation 'com.google.android.gms:play-services-auth:18.1.0'
implementation "androidx.navigation:navigation-fragment:2.3.1"
implementation "androidx.navigation:navigation-ui:2.3.1"
testImplementation 'junit:junit:4.12'
androidTestImplementation 'androidx.test.ext:junit:1.1.2'
androidTestImplementation 'androidx.test.espresso:espresso-core:3.3.0'
}

Answer 1

刚找到答案：

几天后我又回到了这个问题（这只是一个美学问题，所以我继续编写其他东西，比如神圣的 Firebase 东西）。

所以问题是在

styles.xml

我声明并初始化了 @color/background。 textEdit 的 Material 设计 API 使用了这种颜色作为轮廓。

所以解决方案是简单地删除@color/background。我本可以在 xml 文件 android:background=@null 上设置，但不得不在每个使用 textEdit 的 xml 文件上设置。

希望这能对某人有所帮助，抱歉我太笨了。

带有 Material 大纲框的 boxStroke 不起作用

boxStroke with Material Outline Box doesn´t work

android

outline

material-design

material-components-android