Collapse Sidebar




The AbsoluteContentSize property of a UIGridStyleLayout shows how much space the elements of the grid are taking up, including any padding created by the grid. This property is particularly useful to size containers of grids such as Frames and Frame to make sure they aren’t any larger than the grid itself.

It updates as soon as it’s read. It won’t fire a changed event immediately after the UI has changed, but if the value is read it will be up to date. A Instance/Changed event should fire on the next render step.

Code Samples

Tracking AbsoluteContentSize Changes

In this example a UIGridLayout is created inside of a ScrollingFrame. To make sure the ScrollingFrame/CanvasSize is exactly the size it needs to be to contain the grid, a function is connected to the grids Instance/GetPropertyChangedSignal to listen for when the AbsoluteContentSize of the grid changes, and sets the canvas size accordingly.

local Players = game:GetService("Players")

local player = Players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")

local screen = Instance.new("ScreenGui")
screen.Parent = playerGui

local scrollingFrame = Instance.new("ScrollingFrame")
scrollingFrame.Parent = screen
scrollingFrame.AnchorPoint = Vector2.new(0.5, 0.5)
scrollingFrame.Position = UDim2.new(0.5, 0, 0.5, 0)
scrollingFrame.Size = UDim2.new(0, 412, 0, 300)

local grid = Instance.new("UIGridLayout")
grid.CellPadding = UDim2.new(0, 0, 0, 0)
grid.CellSize = UDim2.new(0, 100, 0, 100)
grid.Parent = scrollingFrame

local function onContentSizeChanged()
	local absoluteSize = grid.AbsoluteContentSize
	scrollingFrame.CanvasSize = UDim2.new(0, absoluteSize.X, 0, absoluteSize.Y)


for x = 1, 10 do
	for y = 1, 4 do
		local button = Instance.new("TextButton")
		button.Text = x .. ", " .. y
		button.Parent = scrollingFrame