I’m starting to use Figma more professionally (used it in a personal way before), and just learned about prototype, scrolling and so on
I’m trying to create a scrollable list of tickets. If the user does not find the ticket she wants in the list, she can click a text at the end that says “Load more tickets” (see image below, I can only embed one).
Unfortunately, I’m unable to put this bottom padding you see above when I enable the scrolling on the list container (an auto-layout element, no component involved). It appears like this :
How do I add this bottom layout? I’ve been searching for what feels like hours without finding what I need.
Thanks in advance for any help ! Have a nice day ☀️
Best answer by Osama_Turki
I have been facing this issue for a while and the reason behind it is that the scrolling is only concerned with the frame content and the padding of the autolayout frame is not considered as its content, but here are two workarounds:
Keep the autolayout Frame height as hug content, and introduce a parent frame with the desired height with the vertical scrolling applied to the parent frame.
Add a rectangle with a height of 0.001 ( this height will translate to zero -another hack that might be beneficial in the future-) at the bottom of the autolayout frame.
P.S. with the second approach the bottom padding will be the same value as the spacing between the elements.
I have been facing this issue for a while and the reason behind it is that the scrolling is only concerned with the frame content and the padding of the autolayout frame is not considered as its content, but here are two workarounds:
Keep the autolayout Frame height as hug content, and introduce a parent frame with the desired height with the vertical scrolling applied to the parent frame.
Add a rectangle with a height of 0.001 ( this height will translate to zero -another hack that might be beneficial in the future-) at the bottom of the autolayout frame.
P.S. with the second approach the bottom padding will be the same value as the spacing between the elements.
We use 3 different kinds of cookies. You can choose which cookies you want to accept. We need basic cookies to make this site work, therefore these are the minimum you can select. Learn more about our cookies.
