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

What is Framer? Join the Community
Return to index
Rohan Dang
Posted Aug 21 - Read on Facebook

I'm trying to build a simple list of items that scrolls within a container (vertically), and each item can be swiped left or right. The problem is, it works fine in the preview within studio, but on mobile Safari the vertical scroll on the parent container doesn't allow me to swipe the individual items within it left or right (I've set draggable.speedY=0 on the items and the container has scrollVertical=true). Anybody else having trouble with this? :/


Rohan Dang

Here's a quick example describing the problem I'm running into.. works fine on desktop, but doesn't swipe on the phone —

Koen Bok

Phone is empty so I'll check in a bit. But one thing to understand about scroll views on mobile is (not sure if this is related) that they have a bunch of aggressive optimizations. For example, they don't emit the "scroll" event, and they pause animation while scrolling.

Rohan Dang

Is there a workaround? The interaction I'm describing seems like a pretty common one. For example the Mail app has a list of emails that can scroll, and each item can also be swiped to reveal additional actions for a specific email. That interaction would be impossible to prototype today given what I'm seeing. Or am I doing something wrong?

Brett Johnson

Rohan Dang did you ever find a solution to this? I'm trying to do exactly the same thing.

Rohan Dang

Nope. I ended up implementing a workaround — double-tap to enable drag/disable scroll, double-tap again to do the vice-versa

Kevin Cannon

I'm trying to do something similar aswelll. I tried a different approach, just using a draggable layer, rather than scroll. It worked ok, but in a browser, when you drag out of the browser, then the page starts scrolling strangely. :|

Read the entire post on Facebook