Card View background color affects shadow color

Question

I have my Card View set up like this:

android:layout_marginTop="2dp"
android:layout_marginLeft="6dp"
android:layout_marginRight="6dp"
card_view:cardCornerRadius="2dp"
card_view:cardElevation="6dp"
card_view:cardUseCompatPadding="true"
card_view:contentPadding="10p"

Without a background color my Card View looks perfect like this:

However, when I add the simple property:

card_view:cardBackgroundColor="#xxxxxxxx"

the shadows change significantly in terms of color, transparency, blur etc.

How might I go about fixing this? I tried using a RelativeLayout as the background and changing the color there, so it wouldn't affect the shadows... but that affected the rounded corners.

Any ideas? Thanks for the help!

Answer 1

I ran into the exact same problem and solved it by removing the alpha portion of my hex code.

Example: #AA333333 removing the AA. Of course use the hex color that you need without the alpha.

Answer 2

Your idea of RelativeLayout is a good one. Instead of placing the card view in RelativeLayout , add RelativeLayout as CardView child, and than add its content to RelativeLayout , in your case it look like you got single child: TextView .

So change your TextView background color or place it in a RelativeLayout and change RelativeLayout background color.

Answer 3

作为一种解决方法，由于 alpha 是问题所在，您可以尝试使卡片颜色变亮（或将其与基础颜色混合）

ColorUtils.blendARGB(yourCardColor, Color.WHITE, 0.2f)

Answer 4

取而代之的是，设置 android:background="#hexColor"