Android CardView inside RecyclerView - cardElevation cause unwanted margin & bottom shadow

Question

In Android, I am using RecyclerView. For RecyclerView's item, I am using CardView as item's layout, with below xml layout:

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="0dp"
    android:layout_marginLeft="8dp"
    android:layout_marginRight="8dp"
    android:layout_marginTop="0dp"
    app:cardElevation="2dp"
    app:cardCornerRadius="0dp"
    app:cardPreventCornerOverlap="false"

    android:foreground="?attr/selectableItemBackground"
    android:clickable="true" >

    <LinearLayout
        android:minHeight="48dp"
        android:layout_marginTop="0dp"
        android:layout_marginLeft="16dp"
        android:layout_marginRight="16dp"
        android:layout_marginBottom="0dp"
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    .......

    </LinearLayout>
</CardView>

I am using CardView from android.support.v7.widget.CardView.

I set cardElevation="2dp", layout_marginBottom="0dp", layout_marginTop="0dp". Setting cardElevation makes shadow around left, right & bottom of CardView. Then by setting layout_marginBottom & layout_marginTop=0dp, if item is not the last item in the list, it's bottom shadow will disappear as it is covered by the next item (CardView) in the list.

Below is the intended UI behaviour. Whole Watchlist looks like single CardView, but indeed it is a RecyclerView, with each item consists of CardView, just the bottom shadow is covered up by next item below it. This works well in Android API 25 (Android 7.1.2) :

But on Android API 16 (Android 4.1.2), outcome is not as expected. The bottom shadow (border) still is visible, also look like there is extra margin added between each item.

Any idea how to solve this problem in Android 4.1.2 ?

Answer 1

My raw guess is, you are using CardView from support library. There are different card view implementation under different version of of Android.

I believe before Android L, the library add padding in order to reserve space for shadow drawing.

Please check CardView inside RecyclerView has extra margins for more details.