Where are we on scrolling overlays?

There are older posts about this, with Figma acknowledging that the feature isn’t available. But as the app continues to push out really impressive sets of new features, I wanna surface the request for the ability to scroll content with a frame that is acting as an overlay. The scrolling stuff works perfectly on a frame, but as soon as you set that frame as an overlay…nothing. I’m working on apps that utilize side panels for additional content, and not being able to scroll in them is a real bummer.

2 Likes

I’ve definitely used overlays with scrolling content in them. Is there a specific use case you’re talking about that doesn’t work?

1 Like

I’ve got some screens that have panels that slide in from the right side (and I’m using an overlay to display the panel on top of the screen. The content in those panels doesn’t always fit in the height of the screen, so I want to scroll vertically to see all the content. As its own frame, the scrolling works. But when you are viewing the frame as an overlay, it doesn’t respond to scrolling, rather all the content in it remains fixed regardless of how much additional content is “below the fold” so to speak.

Sorry for the slow reply. If you resize the height of the overlay to match the frame it appears in, you should be able to scroll to see any overflowing content, is the issue that you use the same overlay in multiple situations, so you want the height to match whichever frame it’s opened from?

2 Likes

It sounds like you’re saying if the primary frame (a screen of the app I’m designing) is 800 pixels tall, and I call up a frame as an overlay that is 850 pixels, Figma will dutifully place the overlay on top of my primary frame, but the scrolling capability won’t work. But if I increase the size of my primary frame to 850…voila, the scrolling capabilities of the frame that is being displayed as an overy will magically return.
I haven’t been able to try this, but wanted to make sure I understand your suggestion.
I’m not sure if they’re the exact same height or not, but I’ll check when I’m able to get back to those files.
Thanks!

Almost, you actually want to reduce the height of your overlay to match your screen height.

See the example prototype here, and the file itself here.

In this example I have a screen with scrolling content, and a separate overlay, with separate scrolling content.

If you want to scroll the whole screen, you have to select the Screen frame and set the scroll behaviour there. If you want to scroll the panel, you have to do the same on the Overlay frame itself.

2 Likes

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.