This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Harald Stangl
Posted Jan 05 - Read on Facebook

Hey guys, does anyone know how to stop a draggable or scrollable that is moved by momentum? Like when you flick the contacts list on your smartphone so that it scrolls by itself and then tap once to stop the scrolling.

5 Comments

Jonas Treub

You can call layer.animateStop()

Harald Stangl

Thanks for the hint. Note that you have to call that on the content layer, i.e. scrollComponent.content.animateStop().

Now I'm struggling to discern the tap that started the scrolling from a tap that happened while the list is scrolling (i.e. the stopping tap).

I hoped that I could use the events ScrollAnimationDidStart and ScrollAnimationDidEnd for this, but they also get fired when dragging and releasing the list, without any momentum involved. Is this behavior intentional or might that be considered a bug?

Jonas Treub

Check scroll.content.isAnimating onTapStart to see if it is already scrolling.

Harald Stangl

Thanks, that finally did the trick. If anyone is in need, the final solution is below:

scroll = new ScrollComponent
size: Screen.size
scrollHorizontal: false

list.parent = scroll.content

scroll.onTapStart ->
listIsBouncing = scroll.scrollY < 0 or scroll.scrollY > scroll.content.height - scroll.height
if scroll.content.isAnimating && !listIsBouncing
scroll.content.animateStop()

Note that onTapStart is not documented for normal taps, only for ForceTaps.

Harald Stangl

Sorry, again with indentation:

Read the entire post on Facebook