A list that stops only at values with animation when scrolled?

[Hungry Loser]

Let's say that all possible values are 1,2,3,4,...... 10.

I want a vertical list view that shows only part of the values and allows scrolling with a finger. I am using Ionic, so there is no mouse.

I want the scrolling stops only at each values, not between values. That is, it can either stop at 6 or 7, but not at the space between 6 and 7. And I want some animation for that. For example, if the user stops scrolling at 2/3 between 6 and 7, show some elastic scrolling animation to 7 as if a rubber band is pulling the list to 7. If the user stops at 1/3 between 6 and 7, animate to 6.

Basically, it is similar to what the old Apple's time picker's dial worked, but simpler: No round transformation, but just plain text list with scrolling animation. And it should not be a pop-up but a component embedded on the page.

I think this is not so uncommon, so I feel as if someone must have provided a library for it, but I do not know what things like this called. I have searched Google, but since I do not know the name, I could not find it. If you know a component library that provides this feature, please let me know.

[Sander Elias]

Hi Hungry,

So you are looking for virtual scrolling. Something like the twitter feed? Those are available, but I do not know of one that 'snaps' to a whole result.

Regards

Sander