Recyclerview using gridlayout showing extra spacing

Question

I want to display list-items in recyclerview using GridLayoutManager, I able to display data but some times recyclerview showing extra spacing in rows as like below, so how can I avoid this extra spacing. Also I want to expand recyclerview to full height

Below is layout code of fragment

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorShopListingBackground"
    android:orientation="vertical">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="@dimen/margin_124"
        android:background="@android:color/white" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/margin_8"
        android:layout_marginTop="@dimen/margin_8"
        android:layout_marginRight="@dimen/margin_8"
        android:layout_marginBottom="@dimen/margin_16"
        android:background="@drawable/bg_dashboard_categories"
        android:elevation="@dimen/margin_16"
        android:orientation="vertical">

        <TextView
            android:id="@+id/tv_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="@dimen/margin_16"
            android:layout_marginRight="@dimen/margin_16"
            android:layout_marginTop="@dimen/margin_16"
            android:fontFamily="@font/montserrat_bold"
            android:textSize="@dimen/text_size_18"
            android:textColor="@color/colorHandPickedOffer"
            android:text="@string/txt_handpicked_offers" />

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/rv_categories"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/margin_16"
            android:background="@drawable/bg_dashboard_categories"
            android:layout_below="@id/tv_title"
            android:layoutAnimation="@anim/grid_layout_animation_from_bottom"/>

    </RelativeLayout>
</LinearLayout>

Below is list item

<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:background="@color/colorCategoryDivider"
    android:paddingRight="@dimen/margin_1"
    android:paddingEnd="@dimen/margin_1"
    android:paddingBottom="@dimen/margin_1"
    android:paddingTop="@dimen/margin_1"
    android:gravity="center"
    android:orientation="vertical">

    <LinearLayout
        android:id="@+id/rl_category"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:color/white"
        android:gravity="center_horizontal"
        android:orientation="vertical"
        android:paddingBottom="@dimen/margin_16"
        android:minWidth="@dimen/margin_136">

        <ImageView
            android:id="@+id/iv_category_image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="@dimen/margin_16"
            android:src="@drawable/fashion" />

        <TextView
            android:id="@+id/tv_category_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_below="@id/iv_category_image"
            android:fontFamily="@font/montserrat_semi_bold"
            android:hint="@string/txt_category_name"
            android:layout_marginTop="@dimen/margin_16"
            android:gravity="center"
            android:textSize="@dimen/text_size_12"
            android:textColor="@color/colorCategoryText"
            android:textStyle="bold" />

    </LinearLayout>

</LinearLayout>

below is image with error

Answer 1

I have been Checking and I believe this Library Called flexbox, will help you, its going to take a bit of conversion but it is fairly easy to use and it is perfect for a dashboard like you want

Here is an extract from the page that I think will help you alot

The second one is FlexboxLayoutManager that can be used within RecyclerView.

RecyclerView recyclerView = (RecyclerView) context.findViewById(R.id.recyclerview);
FlexboxLayoutManager layoutManager = new FlexboxLayoutManager(context);
layoutManager.setFlexDirection(FlexDirection.COLUMN);
layoutManager.setJustifyContent(JustifyContent.FLEX_END);
recyclerView.setLayoutManager(layoutManager);
or for the attributes for the children of the FlexboxLayoutManager you can do like:

mImageView.setImageDrawable(drawable);
ViewGroup.LayoutParams lp = mImageView.getLayoutParams();
if (lp instanceof FlexboxLayoutManager.LayoutParams) {
    FlexboxLayoutManager.LayoutParams flexboxLp = (FlexboxLayoutManager.LayoutParams) lp;
    flexboxLp.setFlexGrow(1.0f);
    flexboxLp.setAlignSelf(AlignSelf.FLEX_END);
}

The advantage of using FlexboxLayoutManager is that it recycles the views that go off the screen for reuse for the views that are appearing as the user scrolls instead of inflating every individual view, which consumes much less memory especially when the number of items contained in the Flexbox container is large.

Answer 2

set android:layout_height="wrap_content" to android:layout_height="match_parent"