Android Material Components中TextInputLayout背景颜色问题求助

我来帮你解决这个问题，刚接触Material Components的时候确实容易踩这个坑😉

问题原因分析 #

当你直接设置app:boxBackgroundColor="#ffffff"后文本和提示消失，核心原因是Material Components的FilledBox样式TextInputLayout会自动根据背景色计算内容的对比度：

• 纯白背景（#ffffff）属于高亮度背景，系统会自动调整文本、提示文本的颜色来满足对比度要求，但如果你的主题默认的文本/提示色是浅色（比如白色），就会和背景完全融合，导致看不见。
• 而设置#80ffffff（半透明白）时，背景亮度降低，系统计算出的对比度足够，所以文本可见，但保留了透明效果。

另外，FilledBox的默认背景是带透明度的Material Design规范样式，直接硬编码不透明色会打破组件默认的状态变化（比如聚焦、错误状态的背景过渡），所以更推荐用主题属性来调整。

解决方法 #

方法一：自定义主题（推荐，保留所有状态样式）

在res/values/styles.xml中定义一个继承自FilledBox默认样式的自定义主题，覆盖背景色和相关文本颜色属性：

<style name="CustomFilledTextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
    <!-- 设置纯白背景 -->
    <item name="boxBackgroundColor">#ffffff</item>
    <!-- 输入文本的颜色 -->
    <item name="android:textColor">#ff000000</item>
    <!-- 普通状态下的提示文本颜色 -->
    <item name="hintTextColor">#ff0000</item>
    <!-- 浮动状态下的提示文本颜色（必须设置，否则会被系统自动调整） -->
    <item name="android:textColorHint">#ff0000</item>
    <!-- 可选：设置聚焦时的提示文本/下划线颜色，保持设计一致性 -->
    <item name="colorAccent">#your_preferred_accent_color</item>
</style>

然后在布局中使用这个自定义主题：

<com.google.android.material.textfield.TextInputLayout
    style="@style/CustomFilledTextInputLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="120dp">

    <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Location"/>
</com.google.android.material.textfield.TextInputLayout>

方法二：直接在布局中覆盖所有相关属性（快速测试用）

如果不想自定义主题，需要确保覆盖所有可能影响文本可见性的属性，包括浮动提示的颜色：

<com.google.android.material.textfield.TextInputLayout
    style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="120dp"
    app:boxBackgroundColor="#ffffff"
    app:hintTextColor="#ff0000"
    app:hintTextColorEnabled="#ff0000"
    android:textColorHint="#ff0000">

    <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="#ff000000"
        android:hint="Location"/>
</com.google.android.material.textfield.TextInputLayout>

注意事项 #

• 尽量使用主题属性而非硬编码颜色，这样能轻松适配深色模式，同时保留组件的状态变化（聚焦、错误、禁用等状态下的样式）。
• 如果需要调整更多状态（比如错误状态的背景/文本颜色），可以在自定义主题中继续添加对应的属性。

内容的提问来源于stack exchange，提问作者Dangui