Trying To Achieve:
What I’m trying to do is have a shop like how Pet Sim X and some other notable names have their shops; In sections, such as gamepasses, developer products, boosts, etc, and all being on one infinitely scrolling frame, without any “dead / white space” at the bottom. I’m trying to make it so that it allows me to hardcode in the products being sold to go into the shop, so that it keeps updated with the game’s products, and doesn’t require me to update the UI every time something new gets added.
The Issue
As seen in the below images, I have a shop UI, which is handed within a ScrollingFrame (HolderNew), and in this, there are multiple frames, all with automatic scaling set to Y, and a UIGridLayout within these, as well as a constraint in them. This works completely fine when the UIGridLayout is set to offset and not scale, which although works, I cannot use purely for the fact that it makes the shop contents that big that it’s unusable on smaller screens.
So upon trying to use scale, it works, somewhat, until more children are added to one of the parenting frames, whether that be boosts, cash or gamepasses, where then the gaps between the UI get larger and larger (also seen below).
What have I tried?
I’ve tried a few things to try to get it to work, such as;
- Setting it all to scale, turning off Automatic Size and hard-coding the size of the canvas to the size of the 3 UIGridLayout Content Size’s combined.
- Keeping it as offset but hardcoding it to change depending on the screen size
- Putting them all under “HolderNew” which, although fixes the issue, makes the boosts smaller, and unusable, and breaks the design of the UI
- Setting the CanvasSize via code
None of these seemed to work for me, unless I was doing them incorrectly (and I don’t have to code to show as it was in a test place which I didn’t save 
), so any help or guide in the right way would be appreciated, as I’ve been stuck trying to figure it out for the past week.