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

Instead of that, set android:background="#hexColor"