Android Tutorial => Using Images as Background in CardView...

Example

While using Image/Colour as an background in a CardView, You might end up with slight white paddings (If default Card colour is white) on the edges. This occurs due to the default rounded corners in the Card View. Here is how to avoid those margins in Pre-lollipop devices.

We need to use an attribute card_view:cardPreventCornerOverlap="false" in the CardView. 1). In XML use the following snippet.

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    card_view:cardPreventCornerOverlap="false"
    android:layout_height="wrap_content"> 
      <ImageView
            android:id="@+id/row_wallet_redeem_img"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:adjustViewBounds="true"
            android:scaleType="centerCrop"
            android:src="@drawable/bg_image" />

</android.support.v7.widget.CardView>

In Java like this cardView.setPreventCornerOverlap(false).

Doing so removes an unwanted padding on the Card's edges. Here are some visual examples related to this implementation.

1 Card with image background in API 21 (perfectly fine)

2 Card with image background in API 19 without attribute (notice the paddings around image)

3 FIXED Card with image background in API 19 with attribute cardView.setPreventCornerOverlap(false) (Issue now fixed)

Also read about this on Documentation here
Original SOF post here

PDF - Download Android for free

Previous Next

Android

Fastest Entity Framework Extensions

Example

Got any Android Question?

Android

Android CardView Using Images as Background in CardView (Pre-Lollipop device issues)

Fastest Entity Framework Extensions

Example

Got any Android Question?