Evenly distribute space between items in RecyclerView

Question

I am trying to put equal space between the items of RecyclerView. For that I am using the below SpanningLinearLayoutManager. What it does is, it will auto distribute space between the items in a RecyclerView but it will make the RecyclerView un-scrollable. All the items will come inside the width of the parent. This works fine for 5 or 6 items. But if the list has around 10 elements all will get really close to each other. I want to distribute the space between items equally and make the recyclerview scrollable way.

I have a child RecyclerView inside a parent RecyclerView. I want to equally distribute space between the items of the child RecyclerView

Here is my code:

import android.content.Context;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.AttributeSet;
import android.view.ViewGroup;

public class SpanningLinearLayoutManager extends LinearLayoutManager {

public SpanningLinearLayoutManager(Context context) {
    super(context);
}

public SpanningLinearLayoutManager(Context context, int orientation, boolean reverseLayout) {
    super(context, orientation, reverseLayout);
}

public SpanningLinearLayoutManager(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
    super(context, attrs, defStyleAttr, defStyleRes);
}

@Override
public RecyclerView.LayoutParams generateDefaultLayoutParams() {
    return spanLayoutSize(super.generateDefaultLayoutParams());
}

@Override
public RecyclerView.LayoutParams generateLayoutParams(Context c, AttributeSet attrs) {
    return spanLayoutSize(super.generateLayoutParams(c, attrs));
}

@Override
public RecyclerView.LayoutParams generateLayoutParams(ViewGroup.LayoutParams lp) {
    return spanLayoutSize(super.generateLayoutParams(lp));
}

@Override
public boolean checkLayoutParams(RecyclerView.LayoutParams lp) {
    return super.checkLayoutParams(lp);
}

private RecyclerView.LayoutParams spanLayoutSize(RecyclerView.LayoutParams layoutParams){
    if(getOrientation() == HORIZONTAL){
        layoutParams.width = (int) Math.round(getHorizontalSpace() / (double) getItemCount());
    }
    else if(getOrientation() == VERTICAL){
        layoutParams.height = (int) Math.round(getVerticalSpace() /  (double) getItemCount());
    }
    return layoutParams;
}

@Override
public boolean canScrollVertically() {
    return false;
}
@Override
public boolean canScrollHorizontally() {
    return false;
}

private int getHorizontalSpace() {
    return getWidth() - getPaddingRight() - getPaddingLeft();
}

private int getVerticalSpace() {
    return getHeight() - getPaddingBottom() - getPaddingTop();
}
}

https://stackoverflow.com/questions/24618829/how-to-add-dividers-and-spaces-between-items-in-recyclerview — Raghunandan, Jun 19 '19 at 05:14
@nTri didn't work. All items are getting aligned at the beginning. I am using `recyclerview` inside another `recyclerview`. — sagar suri, Jun 19 '19 at 11:53
@Raghunandan I have a child `RecyclerView` inside parent `RecyclerView`. The `SpacingDecoration` is not working. — sagar suri, Jun 19 '19 at 11:55

Tobibur Rahman · Answer 1 · 2019-06-19T06:00:45.647

Declare these two variables flagDecoration and mItemDecoration:

private var flagDecoration = false

private var mItemDecoration: RecyclerView.ItemDecoration = object : RecyclerView.ItemDecoration() {
        override fun getItemOffsets(outRect: Rect, view: View, parent: RecyclerView, state: RecyclerView.State) {
            super.getItemOffsets(outRect, view, parent, state)
            outRect.left = 20 //use the value as per your need
            outRect.right = 20
            outRect.top = 20
            outRect.bottom = 20
            flagDecoration = true
        }
    }

Add use it in your recyclerView.

if (!flagDecoration) {
   recyclerView.addItemDecoration(mItemDecoration)
}

Where should I delete from? – sagar suri Jun 19 '19 at 05:59 — sagar suri, Jun 19 '19 at 05:59

score 0 · Answer 2 · answered Jun 19 '19 at 06:00

You do not need a custom LayoutManager to achieve this. You can the desired result by using LinearLayoutManager.

All you need to add spacing to every child item is an ItemDecorator.

https://developer.android.com/reference/android/support/v7/widget/RecyclerView.ItemDecoration?hl=en

@Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent,
                               RecyclerView.State state) {
        super.getItemOffsets(outRect, view, parent, state);
        outRect.top = spacing;
    }

..

recyclerView.layoutManager = LinearLayoutManager(..)
recyclerView.addItemDecoration(MyItemDecorator())

Evenly distribute space between items in RecyclerView

2 Answers2