Tween a frame inside UIGridLayout help

I only assume this is the correct category since this is more scripting-based, but if not please let me know.

Hey! I am a UI design so I should be able to script a simple tween but for some reason in a UIGridLayout, it doesn’t tween. The reason for this is because of UIGridLayout overriding the size of the frames. I am trying to make a click and hover effect but I am not sure how would go about this, whilst still keeping it the grid layout.

Explorer view:
image

This is the temporary script I have in place to test:

--// Services
local TweenService = game:GetService("TweenService")

--// Frame
local MAIN_FRAME = script.Parent:WaitForChild("Main") -- Main Frame Holder

--// Menu
local MENU_BUTTON = MAIN_FRAME:WaitForChild("Menu") -- Menu Button (opens menu)
local MENU = MAIN_FRAME:WaitForChild("MenuHolder") -- Menu Frame
local MENU_GRID = MENU:WaitForChild("ButtonsHolder"):WaitForChild("Grid") -- The grid frame
local MENU_TWEEN_INFO = TweenInfo.new(0.5, Enum.EasingStyle.Quart, Enum.EasingDirection.Out) -- TweenInfo
local isMenuOpen = false 

MENU_BUTTON.Activated:Connect(function()
	if isMenuOpen then -- Its open, so close it
		TweenService:Create(MENU, MENU_TWEEN_INFO, {Size = UDim2.fromScale(0, 0)}):Play() -- Shrinks
		MENU.Visible = false -- Hides
		isMenuOpen = false
	else
		MENU.Visible = true -- Make visible
		TweenService:Create(MENU, MENU_TWEEN_INFO, {Size = UDim2.fromScale(0.6, 0.6)}):Play() -- Expands
		isMenuOpen = true
	end
end)

for _, button in pairs(MENU_GRID:GetDescendants()) do
	if button:IsA("ImageButton") and button.Name == "Activation" then
		button.Activated:Connect(function()
			print(button.Parent.Name)
		end)
	end
end

Pretty simple script, that works. It does change the size of the frame but as I said it’s still goes based on the CellSize of the UIGridLayout. Is there a better way to achieve this whilst still being able to tween a frame and keeping it in a perfect grid?

TL:DR
How would you tween a frame inside of UIGridLayout?

I appreciate any help, and this could be quite a dumb post. I couldn’t manage to get it working so I came here for help. Thank you!

1 Like

You can’t tween the frame inside UIGridLayout, however I think there are few ways of bypassing it.

The one I’m thinking of is having a second frame (shadow or something) inside the frame that’s under UIGridLayout and tweening that one, basically creating a second frame parented to the actual frame, with ZIndex lower than actual one, having same color and stuff.

1 Like

Yeah that’s what I was thinking of doing, I was just checking if it was possible to do it without a work around. I appreciate your help.

1 Like