How to apply ItemDecoration from left and right side both to RecyclerView item?

Question

I have been trying to achieve this for so long. What I want is to overlap the selected RecyclerView item from left and right as shown in the picture below.

I'm able to achieve left or right by ItemDecoration like below:

class OverlapDecoration(private val overlapWidth:Int) : RecyclerView.ItemDecoration() {
    private val overLapValue = -40

    val TAG = OverlapDecoration::class.java.simpleName

    override fun getItemOffsets(outRect: Rect, view: View, parent: RecyclerView, state: RecyclerView.State?) {

        val itemPosition = parent.getChildAdapterPosition(view)

        if (itemPosition == 0) {
            return
        } else {
            outRect.set(overLapValue, 0, 0, 0)
        }
    }
}

I have achieved like below image so far.

I have already tried with CarouselLayoutManager but it not what I'm looking for.

setting itemDecoration(assigning overlap value to left and riht end at a time) to selctedItem and null to another will not help? — Vir Rajpurohit, Aug 27 '18 at 12:56
@Maddy Have you tried doing so with animations? Here is similar question https://stackoverflow.com/q/33269409/548208 — Dhruv, Aug 28 '18 at 04:59
@DhruvMevada Yes, It also gives the same result as ItemDecoration with the negative margin. — Maddy, Aug 28 '18 at 05:10
Maybe this library can help you, although I've never used it myself - https://github.com/yarolegovich/DiscreteScrollView — Tohu, Aug 29 '18 at 06:46

score -1 · Answer 1 · answered Nov 24 '18 at 19:47

-1

To achieve the result you're looking for you need to take two steps:

First, to correct the decorator calculations:

if (itemPosition == 0) {
    return
} else {
    outRect.set(-1 * overLapValue, 0, overLapValue, 0) //Need left, AND right
}

Second, you need to actually add the shadow

And, one quick bit of cleanup for the class, you don't need the private val overLapValue.

Instead:

class OverlapDecoration(private val overlapWidth:Int = 40) : RecyclerView.ItemDecoration() {

answered Nov 24 '18 at 19:47

gtcompscientist

671
5
18

Thanks, but this is not what I want! It will only increase the space from the right item. Actually, I want the right item to go under the selected item in RecyclerView. – Maddy Nov 28 '18 at 04:54

How to apply ItemDecoration from left and right side both to RecyclerView item?

1 Answers1