Nudge a paged recyclerview to hint at next page without switching

Question

I'm using a horizontal recyclerview with a LinearLayoutManager and a PagerSnapHelper and each viewholder/page is fullscreen and snaps to the window so only one page is viewable once settled. Like most fullscreen swipeable tabs.

When inserting a new page AFTER the current page, I want to temporarily show/hint at it's presence without snapping/scrolling to it i.e. so the user knows they opened a new page and it's there if they want to view it without forcing them to actually view it.

So it would be the same effect if you were to start dragging your finger a tiny bit to expose the next page before releasing and letting it snap back to the starting page.

How can I do this? Thanks

score 1 · Answer 1 · answered Jun 13 '19 at 18:06

I haven't done it with a RecyclerView yet, but I managed to do something similar on a ViewPager. Basically, you could use a ValueAnimator with a CycleInterpolator to scroll the RecyclerView each frame by a little bit and then back. Since it's scroll position is updated with each frame, I think this shouldn't collide with the snapping:

val startX = recyclerView.getScrollX().toFloat()
    val endX = startX + Utils.dpToPx(context, 100) // the amount you want to scroll in pixels


    val animator = ValueAnimator.ofFloat(1f, 0f)
    animator.cancel()
    animator.interpolator = CycleInterpolator(0.5f)
    animator.startDelay = 600
    animator.duration = 600
    animator.addUpdateListener { animation ->
        val alpha = animation.animatedValue as Float
        recyclerView.scrollTo((startX * alpha + (1f - alpha) * endX).toInt(), 0)
    }
    animator.start()

This works on a ViewPager and should just as well on a RecyclerView, since it has the same scrolling methods available...

The value animator worked nicely but the actual scrolling part didn't. I checked and it says "RecyclerView does not support scrolling to an absolute position." but thankfully this lead me to the "scrollBy" methods which is the way to go. With the SnapPagerHelper it turned out to be as simple as: recyclerView.smoothScrollBy(nudgeDistanceInPx, 0); (no animator needed) and then providing it's not too far the snap helper will snap it back to it's starting position. Thanks for your help :) — MeatPopsicle, Jun 14 '19 at 08:17

score 1 · Accepted Answer · answered Jun 14 '19 at 08:19

1

recyclerView.smoothScrollBy(nudgeDistanceInPx, 0);

This will smooth scroll to show the next page a little before the PagerSnapHelper kicks in and returns it to it's starting position

answered Jun 14 '19 at 08:19

MeatPopsicle

832
13
28

Nudge a paged recyclerview to hint at next page without switching

2 Answers2