There’s been a ton of issues that haven’t been resolved regarding how UI works in Roblox. Most have to switch to their own scripts in order to get the desired functionality.
This simple video will explain everything that is wrong with ScrollingFrames and HorizontalAlignment.
If set to Center, 5 should be the starting point and I should be able to scroll left and right.
If set to Left, it begins with 1, which is default, and also the only one working at the moment.
If set to Right, 10 should be the starting point and I should be able to scroll left.
I’m assuming you’re using scale on the x-axis since you have an aspect ratio constraint. Scale doesn’t scale well with automatic sizing (pun intended), so you’re left with janky cases that can’t reliably be solved. Automatic size should only really be used for predictable size requirements.
For instance, if you have 2 elements with scale of 0.5, you’d expect it to fill the container. But, if you add another element with a scale value of 0.5, where would it go? Obviously the parent container would have to resize to accommodate the new element, but you also can’t have 3 elements next to each other that all take a cumulative 150% of the space… because that’s impossible. So some elements will have to fall outside of the expected bounds, which is what you’re experiencing.
It works if the HorizontalAlignment is set to Left (default).
So if that works, why can’t the other two, Center and Right? Why have a setting we can’t use?
Center should ensure the elements stay in middle, and as more are added, still are centered on the middle kind of.
I think you need to try it yourself, it’s similar to Catalog Avatar Creator’s Currently Wearing feature, where somehow, the elements are indeed in the middle (if there’s like 1 or a few items)