Scrolling UI Scaling

Hello, I am trying to create a banland kind of database for my game, but instead of pages, I want a scrolling frame, but the issue is that the way scrolling frame with with scaling it is all messed up. So I am trying to fix it, and it gets affected to the minuscule level of spacing

Video example: https://youtu.be/qWTdsAx1WLQ

local banLandHandled = false
local template = banLandSet.Template

banLand.MouseButton1Click:Connect(function()
	set_Select_Visible(banLandSet.Parent)
	
	if banLandHandled then return end
	banLandHandled = true
	
	banLandEvent:FireServer()
	
	local AbsolTemp = template.AbsoluteSize.Y
	local AbsolScroll = banLandSet.AbsoluteSize.Y
	
	local absoluteSizeEx = 0
	
	local result = AbsolTemp/AbsolScroll
	
	banLandEvent.OnClientEvent:Connect(function(banLandTable)
		print("Recieved", banLandTable, print(#banLandTable))
		
		local amount = 0
		local spacing = 0.03
		local numberOfChildren = 0
		
		for _, _ in banLandTable do
			numberOfChildren += 1
		end
		
		local fixatedSpacingSize = 0.03*AbsolScroll
		
		local mathEquation = ((numberOfChildren +1) * AbsolTemp) + ((numberOfChildren-1) * fixatedSpacingSize)
		if mathEquation > AbsolScroll then
			banLandSet.CanvasSize = UDim2.new(banLandSet.Size.X.Scale, 0, (mathEquation/AbsolScroll), 0)
		end
		
		spacing = spacing/banLandSet.CanvasSize.Y.Scale
		local thumbType = Enum.ThumbnailType.HeadShot
		local thumbSize = Enum.ThumbnailSize.Size48x48
		
		for users, info in banLandTable do
			amount += 1
			
			local clone = template:Clone()
			clone.Parent = banLandSet
			clone.Name = users
			clone.Visible = true
			clone.Size = UDim2.new(template.Size.X.Scale, 0, math.round((result/banLandSet.CanvasSize.Y.Scale)*10000)/10000 , 0)
			print(result, banLandSet.CanvasSize.Y.Scale, math.round((result/banLandSet.CanvasSize.Y.Scale)*10000)/10000)
			
			clone.Position = UDim2.new(template.Position.X.Scale, 0, (((amount-1) * clone.Size.Y.Scale) + ((amount-1) * spacing)), 0)
			
			absoluteSizeEx += clone.AbsoluteSize.Y
			
			clone.ID.Text = tostring(users)
			clone.Username.Text = tostring(game:GetService("Players"):GetNameFromUserIdAsync(users))
			
			local content, isReady = game:GetService("Players"):GetUserThumbnailAsync(users, thumbType, thumbSize)
			clone.ImageLabel.Image = content
		end
		
		print(banLandSet.AbsoluteCanvasSize.Y, absoluteSizeEx + ((amount-1) * spacing))
	end)
end)

If you have any idea on how to fix this please let me know!

1 Like

Instead of doing all that math, you can try using the AutomaticCanvasSize property on ScrollingFrames. If you use it, make sure that the normal CanvasSize is set to 0 otherwise it’ll bug out.

Also if you’re using UIListLayouts the padding property will also bug it out :sob:, so you might need to add your own padding.

Oh wow, I feel dumb now, I had no idea this even existed I wasted like a day on something that already exists. Thank you!

1 Like