How to Overlap items in LinearLayoutManager – RecyclerView (like stacking cards)

I assume you’re looking for a partial overlap (e.g. deck of cards slightly fanned out). If so, this seems fairly simple with RecyclerView and a custom ItemDecoration. Here’s a trivial example of one that overlaps the items by 90px vertically:

public class OverlapDecoration extends RecyclerView.ItemDecoration {

  private final static int vertOverlap = -90;

  @Override
  public void getItemOffsets (Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {

    outRect.set(0, vertOverlap, 0, 0);

  }
}

This example hard codes the offset, but if your list items vary in height you’ll need to measure and add logic for this.

Add this decoration to the RV before setting the layoutmanager. I’ve tried it with a StaggeredGrid but it should work with LinearLayout and Grid LM’s as well.

Leave a Comment