Inertia-based list scrolling

[alf]

So close...yet so far...

I'm trying to make a list of icons scroll just like they do in the iOS App Store app:

1. Scroll left or right slowly and the icons essentially follow your finger.
2. Scroll quickly and the icons scroll quickly.
3. Scroll past the first icon in the row and it eases back into the exactly perfect first icon location.
3. Ditto for scrolling past the last icon in the row.

The issues I'm currently having achieving this goal using Chipmunk2D are:

1. The icons collide with each other and scatter all over the screen unless I put each icon on its own layer. Unfortunately this means I can have no more than 32 icons. Putting all my icons in the same "group" did not have the same effect as layering even though it appears from the documentation that's what I SHOULD be doing instead. So while I've worked around this problem I don't like my "solution" and feel there should be a better way.

2. Math & physics aren't my strong suits, but my approach was to apply an impulse to each game icon relative to the user's touch and direction of motion. This results in a pleasing enough "scroll slowly" option, but doesn't provide "accelerated" swipes where more icons go by quicker.

3. Because I'm applying forces to each individual icon, I have no way to know exactly how much force to apply to bring the first/last icon back to rest exactly where it belongs after the user lets go. For the moment, I have a linear formula based on the time-span of your swipe. This seems to kinda-sorta work for flicking, but has some odd side-effects.

4. I thought about putting constraints between each of the icons to make them move in unison, but not sure if that would really make any difference?

5. I thought about putting springs on the two end icons that will force them into the correct spot after a swipe. However, springs wouldn't allow you to scroll the first/last icons off the screen so as to view the icons in the middle of the list.

6. Could use some help understanding constraints in general, especially how to hook them up to "walls" in the environment, etc.

Thanks much,
ALF

[mobilebros]

I really don't think you should attempt doing it this way. It's a bit overkill and certainly not easily scalable to a large number of icons.

That being said, I actually attempted to do this awhile ago with somewhat satisfactory results. It's in obj-c and cocos2d-iphone and if you really want it I could try and dig it up.