I'm creating an inventory which involves use of a scrolling frame. I've made a frame which holds a picture of them item look the exact size I want it in the scrolling frame - and there are 5 columns in a row of items.

How do I keep these items at the exact same size respective to the changing canvas, whilst making the canvas frame big enough to hold every item? Here's what I've tried, and I can't think of what else to change from this point.

Item size I want to keep (canvas is 0,0,2,0): https://gyazo.com/65f866ec796fdd8357d49d047d9ef1cc

Properties of the Item: https://gyazo.com/4ebf086ad1d8f5996d3b071cbf3b3d51

I move the item 0.2 along the X axist, until 0.8, where I start a new row after that.

Here's the code i've ended up with; 

local row = 0
local count = 0
xModifier = 0
local MagicList = require(game.ReplicatedStorage.Modules.MagicList)
Items = script.Parent.Container.Collection.MagicContainer
Items:ClearAllChildren()
for i, q in pairs(MagicList) do
    local m = script.ItemFrame:Clone()

    if count % 5 == 0 then
		xModifier = 0
		m.Position = UDim2.new(xModifier, 0, 0.01 + (row - 1)* m.Size.Y.Scale , 0)
    else
        row = row + 1
        m.Position = UDim2.new(xModifier, 0, 0.01 + (row - 1)* m.Size.Y.Scale ,0)
    end
    m.Parent = Items
	xModifier = xModifier + 0.2
    count = count + 1
end

if count % 5 ~= 0 then count = count + 1 end

Items.CanvasSize = UDim2.new(0, 0, 2 + (count /5) * script.ItemFrame.Size.Y.Scale, 0)

Where Items is the ScrollingFrame.

Here is the outcome of this: https://gyazo.com/b5e850d75a5fd6bedfdd5ee7f2b4a58b.gif

There should be 52 items - here there's barely 10 lol.

Thanks for any help! I'll be able to reply with gifs of outcomes for a little while, and my discord is ibarhim#7042 if anyone needs.

AnonymousEdited