How can I create an expandable GUI list?

[scs1323 (waffle)]

I want to create an expandable GUI list like this, but without using offsets in the GUI.

[East98]

You can achieve this using a UIListLayout inside a ScrollingFrame. Set the CanvasSize to {(0, 0), (0, 0)} and AutomaticCanvasSize to Enum.AutomaticSize.Y. Also add the elements to the ScrollingFrame and have the expanding details slider (child of each element Frame) set to Position of {(0, 0), (1, 0)} and Size of {(1, 0), (0, 0)}. When an element is selected tween the size of the details sliding frame, for example to {(1, 0), (0, 40)}

[scs1323 (waffle)]

I tried it, and it worked, but when adjusting the frame sizes with offsets, the scaling ends up being too large or too small compared to the screen resolution.
And the expanded GUI is not applied to the UIListLayout, so it overlaps with other elements.

[scs1323 (waffle)]

I fixed like this.

Gui Objects

In this canvas.AutomaticSize should Y

MenuDown Script

local tweenService = game:GetService("TweenService")
local currentCaemra = workspace.CurrentCamera

local menuDownTween = tweenService:Create(script.Parent.SaveMenu, TweenInfo.new(0.5, Enum.EasingStyle.Quad, Enum.EasingDirection.Out), {Position = UDim2.new(0, 0, 0.75, 0)})
local menuUpTween = tweenService:Create(script.Parent.SaveMenu, TweenInfo.new(0.5, Enum.EasingStyle.Quad, Enum.EasingDirection.Out), {Position = UDim2.new(0, 0, 0.5, 0)})

local isMenuDown = false

script.Parent.SaveInfo.MouseButton1Click:Connect(function()
	if isMenuDown == false then
		menuDownTween:Play()
		isMenuDown = true
	elseif isMenuDown == true then
		menuUpTween:Play()
		isMenuDown = false
	end
end)

SaveInfoButtonResizer Script

local currentCamera = workspace.CurrentCamera

local function resize()
	script.Parent.SaveInfo.Size = UDim2.new(1, 0, 0, workspace.Camera.ViewportSize.Y / 6)
end

resize()

currentCamera.GetPropertyChangedSignal("ViewportSize"):Connect(function()
	resize()
end)