可勾选MaterialCardView选中状态背景出现非预期透明度如何解决

问题原因 #

MaterialCardView默认在选中状态会叠加一层半透明的前景遮罩，这是Material Design规范的默认交互样式，就是这层遮罩导致你设置的纯黑背景出现了偏色。

解决方案 #

你只需要在布局的MaterialCardView配置中，关闭默认的前景遮罩即可，有两种实现方式：

方式一：直接添加属性（最简单） #

在你的MaterialCardView节点中新增app:cardForegroundColor属性，设置为透明：

<com.google.android.material.card.MaterialCardView
    android:id="@+id/card"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_margin="20dp"
    android:checkable="true"
    android:clickable="true"
    android:focusable="true"
    app:cardBackgroundColor="@color/background_color"
    app:checkedIcon="@null"
    <!-- 新增这一行 -->
    app:cardForegroundColor="@android:color/transparent">
</com.google.android.material.card.MaterialCardView>

如果同时需要去掉点击时的涟漪效果，可以再新增一行：
app:rippleColor="@android:color/transparent"

方式二：自定义样式（适合多处复用） #

如果你的项目中有多个同类可勾选卡片需要统一效果，可以提前定义自定义样式：

1. 在res/values/styles.xml中新增样式：

<style name="NoMaskCheckableCard" parent="Widget.MaterialComponents.CardView">
    <item name="cardForegroundColor">@android:color/transparent</item>
    <!-- 不需要涟漪的话加下面这行 -->
    <!-- <item name="rippleColor">@android:color/transparent</item> -->
</style>

2. 在布局中给卡片应用样式即可：

<com.google.android.material.card.MaterialCardView
    style="@style/NoMaskCheckableCard"
    其余原有属性不变...>
</com.google.android.material.card.MaterialCardView>

修改完之后，选中状态就会严格按照你定义的background_color选择器显示纯黑色，不会有额外的透明度叠加效果。

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