How do I make an automatic gui placement system

I’m making a PlayerList, But due to UIListLayout’s not being flexible enough, I have to manually script my own ListLayout. So this is how the GUI works (I will provide code):

We have a list, and we place all the teams in this list.
All the teams have a frame inside them call PlayerFrame which has a UIListLayout

My idea is to loop through all the team tabs and do this math:

Get the tab above it, Position it to the size of the tab times the amount of tabs inside the team list minus one, Then we add the amount of players inside the UIListLayout (using UIListLayout.AbsoluteContentSize.Y)

So basically:

Reference = Tab above the current one we're editing
Offset = ((25 + 2) * (#List:GetChildren() - 1)) + 
Reference.PlayerFrame.UIListLayout.AbsoluteContentSize.Y

Code:

local Player = game.Players.LocalPlayer
local Character = Player.Character or Player.CharacterAdded:Wait()

local RunServ = game:GetService("RunService")

local List = script.Parent
	local Scroll = List.ScrollingFrame

for _, Team in pairs(game.Teams:GetTeams()) do
	local TTT = script.TeamTabTemplate:Clone()
	TTT.Name = Team.Name
	TTT.TeamName.Text = string.upper(Team.Name)
	TTT.Damascus.ImageColor3 = Team.TeamColor.Color
	TTT.Parent = Scroll
end

local function Adjust()
	for Num,TTT in pairs(Scroll:GetChildren()) do
		if Num > 1 then
			local CappedM = math.clamp(Num - 1, 0, #Scroll:GetChildren())
			local CappedR = math.clamp(Num - 1, 1, #Scroll:GetChildren())
			local Reference = Scroll:GetChildren()[CappedR]
			local PlayerOffset = TTT.PlayerFrame.UIListLayout.AbsoluteContentSize.Y
			local YOffset = ((25 + 2) * CappedM)
			
			TTT.Position = UDim2.new(0, 0, 0, YOffset + PlayerOffset)
		end
	end
end

while wait(1) do
	Adjust()
end

I’m genuinely lost as to what is wrong with my logic here. I’m sure this would be the proper way to do this, Can anyone help?

Edit: Thought I’d post this to show you what the UI looks like when that code is ran: image

It’s not really clear what you’re trying to do. What’s wrong in the image you posted?

Basically, I’m trying to position each tab properly, And make sure it accounts for the children inside the playerframe

1 Like