Unable to remove excess space between CardView items - Scrollable RecyclerView

Question

People,

I have no options when trying to remove excess space between map elements in my recyclerview below, this is the current output. Please suggest.

<android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#303030" android:id="@+id/cv" android:layout_marginTop="2dip" android:layout_marginBottom="2dip" card_view:cardUseCompatPadding="true" card_view:cardElevation="5dp" android:foreground="?android:attr/selectableItemBackground" > <RelativeLayout android:layout_width="match_parent" android:layout_height="80dp" android:padding="5dp" android:longClickable="true" android:background="#303030"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/person_photo" android:background="@drawable/vector_red" android:layout_alignBottom="@+id/txtSub" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textAppearance="?android:attr/textAppearanceLarge" android:text="Large Text" android:id="@+id/txtMain" android:layout_alignParentTop="true" android:layout_toRightOf="@+id/person_photo" android:layout_toEndOf="@+id/person_photo" android:elevation="4dp" android:textSize="20dp" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textAppearance="?android:attr/textAppearanceSmall" android:text="Small Text" android:id="@+id/txtSub" android:layout_below="@+id/txtMain" android:layout_toRightOf="@+id/person_photo" android:layout_toEndOf="@+id/person_photo" /> </RelativeLayout> </android.support.v7.widget.CardView> 

My view of Recycler

  <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:card_view="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".HomeFragment"> <android.support.v7.widget.RecyclerView android:id="@+id/rv" android:layout_width="match_parent" android:layout_height="match_parent" android:scrollbars="vertical" card_view:cardUseCompatPadding="false" card_view:cardPreventCornerOverlap="false" android:background="#0fffffff" /> </RelativeLayout> 

Answer 1

I did not implement RecyclerView , but I replicated two lines in a linear layout, minus the padding from the original question:

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content" xmlns:card_view="http://schemas.android.com/apk/res-auto" android:background="#303030" android:id="@+id/cv1" card_view:cardElevation="5dp" android:foreground="?android:attr/selectableItemBackground" xmlns:android="http://schemas.android.com/apk/res/android"> <RelativeLayout android:layout_width="match_parent" android:layout_height="80dp" android:layout_margin="4dp" android:longClickable="true" android:background="#303030"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/person_photo" android:background="@drawable/vector_red" android:layout_alignBottom="@+id/txtSub" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textAppearance="?android:attr/textAppearanceLarge" android:text="Large Text" android:id="@+id/txtMain" android:layout_alignParentTop="true" android:layout_toRightOf="@+id/person_photo" android:layout_toEndOf="@+id/person_photo" android:elevation="4dp" android:textSize="20dp" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textAppearance="?android:attr/textAppearanceSmall" android:text="Small Text" android:id="@+id/txtSub" android:layout_below="@+id/txtMain" android:layout_toRightOf="@+id/person_photo" android:layout_toEndOf="@+id/person_photo" /> </RelativeLayout> </android.support.v7.widget.CardView> <android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content" xmlns:card_view="http://schemas.android.com/apk/res-auto" android:background="#303030" android:id="@+id/cv1" card_view:cardElevation="5dp" android:foreground="?android:attr/selectableItemBackground" xmlns:android="http://schemas.android.com/apk/res/android"> <RelativeLayout android:layout_width="match_parent" android:layout_height="80dp" android:layout_margin="4dp" android:longClickable="true" android:background="#303030"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/person_photo" android:background="@drawable/vector_red" android:layout_alignBottom="@+id/txtSub" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textAppearance="?android:attr/textAppearanceLarge" android:text="Large Text" android:id="@+id/txtMain" android:layout_alignParentTop="true" android:layout_toRightOf="@+id/person_photo" android:layout_toEndOf="@+id/person_photo" android:elevation="4dp" android:textSize="20dp" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textAppearance="?android:attr/textAppearanceSmall" android:text="Small Text" android:id="@+id/txtSub" android:layout_below="@+id/txtMain" android:layout_toRightOf="@+id/person_photo" android:layout_toEndOf="@+id/person_photo" /> </RelativeLayout> </android.support.v7.widget.CardView> </LinearLayout> 

Play with the expansion and you will get the best results. You can also try adding background color to your map, then you can get rid of the layout fields in your RelativeLayout!

Answer 2

Can you try this?

 <?xml version="1.0" encoding="utf-8"?> <android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:card_view="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> ... ... ... </android.support.v7.widget.CardView> 

I checked it works great for me.

Screenshot:

Hope this helps you.

Answer 3

All you have to do is remove the following two lines from xml for CardLayout :

 android:layout_marginTop="2dip" android:layout_marginBottom="2dip" 

What this does is determine the separation between the two layouts, in which case you have 4dip (2 on the top and 2 on the bottom). You can also try reducing it to 1 dip and check the effect it gives you.

Hope this helps :)

Answer 4

change the location of the map to

 <android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#303030" android:id="@+id/cv" card_view:cardCornerRadius="2dp" card_view:cardElevation="2dp" card_view:cardPreventCornerOverlap="false" card_view:cardUseCompatPadding="true"> 

Answer 5

In the xml map viewer window, change the total width of the parent layout for wrapping the content.

 android:layout_width="math_parent" 

to

 android:layout_width="wrap_content"