Android Recyclerview Gridlayoutmanager Column Spacing

Android Recyclerview GridLayoutManager column spacing

RecyclerViews support the concept of ItemDecoration: special offsets and drawing around each element. As seen in this answer, you can use

public class SpacesItemDecoration extends RecyclerView.ItemDecoration {
  private int space;

  public SpacesItemDecoration(int space) {
    this.space = space;
  }

  @Override
  public void getItemOffsets(Rect outRect, View view, 
      RecyclerView parent, RecyclerView.State state) {
    outRect.left = space;
    outRect.right = space;
    outRect.bottom = space;

    // Add top margin only for the first item to avoid double space between items
    if (parent.getChildLayoutPosition(view) == 0) {
        outRect.top = space;
    } else {
        outRect.top = 0;
    }
  }
}

Then add it via

mRecyclerView = (RecyclerView) rootView.findViewById(R.id.my_recycler_view);
int spacingInPixels = getResources().getDimensionPixelSize(R.dimen.spacing);
mRecyclerView.addItemDecoration(new SpacesItemDecoration(spacingInPixels));

Divide width between two columns in GridLayoutManager

Try adding this on your recyclerView:

mRecyclerView.addItemDecoration(new RecyclerView.ItemDecoration() {
        @Override
        public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
            int position = parent.getChildAdapterPosition(view); // item position
            int spanCount = 2;
            int spacing = 10;//spacing between views in grid

            if (position >= 0) {
                int column = position % spanCount; // item column

                outRect.left = spacing - column * spacing / spanCount; // spacing - column * ((1f / spanCount) * spacing)
                outRect.right = (column + 1) * spacing / spanCount; // (column + 1) * ((1f / spanCount) * spacing)

                if (position < spanCount) { // top edge
                    outRect.top = spacing;
                }
                outRect.bottom = spacing; // item bottom
            } else {
                outRect.left = 0;
                outRect.right = 0;
                outRect.top = 0;
                outRect.bottom = 0;
            }
        }
    });

Android Recycler view using Grid Layout Manager equal spacing not working

You can add margin in your row xml for equal spacing in your recyclerview. Its the easy way to add equal spacing between your list items.

How to reduce space between columns in recycler view(GridLayoutManager) in android

You can use custom RecyclerViewItemDecorator:

public class RecyclerViewItemDecorator extends RecyclerView.ItemDecoration {
  private int spaceInPixels;

  public RecyclerViewItemDecorator(int spaceInPixels) {
    this.spaceInPixels = spaceInPixels;
  }

  @Override
  public void getItemOffsets(Rect outRect, View view, 
      RecyclerView parent, RecyclerView.State state) {
    outRect.left = spaceInPixels;
    outRect.right = spaceInPixels;
    outRect.bottom = spaceInPixels;

    if (parent.getChildLayoutPosition(view) == 0) {
        outRect.top = spaceInPixels;
    } else {
        outRect.top = 0;
    }
  }
}

Then add it to your RecyclerView:

// For example 10 pixels
int spaceInPixels = 10;
mRecyclerView.addItemDecoration(new RecyclerViewItemDecorator(spaceInPixels));

Hope it helps!

android gridLayoutManager - how to make equal spacing when recyclerview is constrained tot left and right side of screen

i figured this out and will give you some clues. gridlayoutmanager is scaling the items such that it will fit all items according to your span count. so imagine when gridlayoutmanager takes your item, it will says how can i stretch this item such that X number of them can fit on a row ?

the best approach i found is to use constraintLayout. such as:

 app:layout_constraintDimensionRatio="1:1" 

and/or depending your usecase for your content you can use this so it stretches with the container:

eg.

app:layout_constraintWidth_percent=".51"
app:layout_constraintHeight_percent=".63"

for me the percentage stuff i used for the imageView so it keeps the ratio when stretched.

and not give any hard dimensions. Hard dimensions are going to make the spacing not even as its forcing a certain size when gridlayoutmanager wants to strength to fit your item. instead let the system scale the items but maintain the aspect ratio.

all these examples are for your container. inside your container you can create content as you usually do but you might still need ayout_constraintWidth_percent so it stretches when the item stretches proportionally.

after you do all that your items will be tightly bunched together with no spaces. now use a itemdecorator to add the spacing and it should work.

---

Related Topics