Circular Scroll View Implementation

Hey, I want to implement a circular dialer using a scroll view component like this
image

Scrolling downwards won’t be an issue as I will just increase the content element size and add a new entry for the relevant number but if we scroll upwards then after we reach the 0th entry, we cannot go up any further which will hinder the movement for the dialer.

Let me know if someone has any solution to this issue or any other way to implement the dialer.

Hmm, for the example lets say it was a circular reel for 0-9. I would have a scroll view with the numbers 0-9 twice (ie 01234567890123456789) so you can set the scroll position when it wraps around an edge (for example, 4 would be the edge) using similar code to this: Scrolling Content of Scrollview to a specific item - #4 by yaustar

The downside is that I don’t think it works with inertia unless you use the private API to maintain it after setting the scroll position

1 Like