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

Question

Is that possible to overlap the items from RecyclerView ?
I am trying that with LinearLayoutManager.
My requirements are just the same as in LinearLayoutM

Answer 1

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.

Answer 2

You can achieve using ItemDecoration of RecyclerView

set ItemDecoration :

var customAdapter = CustomListAdapter()
recyclerView.addItemDecoration(MyItemDecoration()) // here set decoration in recyclerview
recyclerView.layoutManager = LinearLayoutManager(context)
recyclerView.adapter = customAdapter

create ItemDecoration class :

class MyItemDecoration : RecyclerView.ItemDecoration() {

    private val overlapValue = -60

    override fun getItemOffsets(outRect : Rect, view : View, parent : RecyclerView, state : RecyclerView.State) {
        outRect.set(0, 0, 0, overlapValue)  // args is : left,top,right,bottom
    }
}