CODEWITHSUNDEEP
androideclipse-adtandroid-recyclerviewandroid-cardview
vj9
vj9

Reputation: 1554

CardView inside RecyclerView has extra margins

I am using a CardView as element inside a RecyclerView. When doing so android automatically generates margins between the cardView and the screen and between different cardViews.

<android.support.v7.widget.CardView 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/galleryCardBGColor"
app:cardCornerRadius="2dp" >

<android.support.v7.widget.RecyclerView
    android:id="@+id/my_recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scrollbars="vertical" />

I followed the instructions in the link to integrate them into my project: using-recyclerview-and-cardview-in-eclipse-adt

I had been previously using a linearlayout for the list element :

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

This was working perfectly fine, with no margins whatsoever between the list elements. I have now just placed the linear layout inside the cardView which has resulted in extra margins.

The reason being that i want to provide exact margins to these elements, and any margins I supply now is being added over to this preexisting margins. I have tried supplying zero/negative paddings/margins to the cardView element but none of these work.

Any idea, I can remove these margins or otherwise know exactly how much margin is being added.

Upvotes: 37

Views: 44180

Answers (11)

owjsub
owjsub

Reputation: 241

If you don't need the corner radius or elevation downlevel, consider using FrameLayout on pre-Lollipop.

<include layout="@layout/card_view_compat" />

layout/card_view_compat

<merge
    xmlns:android="http://schemas.android.com/apk/res/android"
    >
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >
        <include layout="@layout/content" />
    </FrameLayout>
</merge>

layout-v21/card_view_compat

<merge
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    >
    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:cardCornerRadius="3dp"
        app:cardElevation="4dp"
        >
        <include layout="@layout/content" />
    </android.support.v7.widget.CardView>
</merge>

Upvotes: 0

Zubair Rehman
Zubair Rehman

Reputation: 2545

I know its late but i hope it will help someone 

app:cardPreventCornerOverlap="false"

setting app:cardPreventCornerOverlap to false will do the trick :)

Upvotes: 4

Don Louis
Don Louis

Reputation: 71

use

android:adjustViewBounds="true"

on the view you want wrapped in the cardview

Upvotes: 0

wildzic
wildzic

Reputation: 416

myCardView.setShadowPadding(0,0,0,0);

Upvotes: -3

yigit
yigit

Reputation: 38263

did you check if it is margin or padding? (Dev Options / show layout bounds)

CardView adds padding in platforms pre-L to draw shadows. In L, unless you set useCompatPadding=true, there should not be any gap.

Adding negative margins (although it is ugly) should work. If it is not, please add some more code on how you are adding them and how you are setting up the RecyclerView.

Upvotes: 47

Ani kukadiya
Ani kukadiya

Reputation: 174

Well, seems there is a much easier way to do it, without guessing the padding and all:

card_view:cardPreventCornerOverlap="false"

or using java:

cardView.setPreventCornerOverlap(false)

Upvotes: 2

Markus Rubey
Markus Rubey

Reputation: 5238

The comment from @vj9 under the accepted question helped me to calculate the offsets. Sharing it here because it might help someone else:

public static int getVerticalCardViewOffset(Context context) {
    Resources res = context.getResources();
    int elevation = res.getDimensionPixelSize(R.dimen.cardview_default_elevation);
    int radius = res.getDimensionPixelSize(R.dimen.cardview_default_radius);
    return (int) (elevation * 1.5 + (1 - Math.cos(45)) * radius);
}

public static int getHorizontalCardViewOffset(Context context) {
    Resources res = context.getResources();
    int elevation = res.getDimensionPixelSize(R.dimen.cardview_default_elevation);
    int radius = res.getDimensionPixelSize(R.dimen.cardview_default_radius);
    return (int) (elevation + (1 - Math.cos(45)) * radius);
}

Upvotes: 1

Shayan_Aryan
Shayan_Aryan

Reputation: 2042

add card_view:cardPreventCornerOverlap="false" to your card It works only if your Image has Rounded Corners

Upvotes: 5

Omar Faroque Anik
Omar Faroque Anik

Reputation: 2609

Use this two tags below: 

card_view:cardPreventCornerOverlap="false"
card_view:cardUseCompatPadding="true"

Upvotes: 18

Piasy
Piasy

Reputation: 1009

Just described in @yigit 's answer, the CardView will add a default padding to draw it's shadow before Android L. The padding size is described in CardView's doc.

I found the way to clear this padding (also to add padding for content) is to use CardView's contentPaddingLeft(/Right/Top/Bottom) attributes.

If you want to clear the default padding, you can set the contentPadding to minus value. If you want to add content padding, set the contentPadding to the value you want.

In my case, I use these code to clear the default padding:

card_view:contentPaddingLeft="-3dp"
card_view:contentPaddingRight="-3dp"
card_view:contentPaddingTop="-3dp"
card_view:contentPaddingBottom="-3dp"

I tried @Shubham 's answer, but an IllegalStateException is thrown in RadialGradient.java with message the "radius must be > 0".

Upvotes: 18

Shubham
Shubham

Reputation: 2757

It worked for me. Use:

 card_view:cardElevation="0dp"
 card_view:cardMaxElevation="0dp"

Upvotes: 45

Related Questions