Can my color changing button tween be improved?

Hello! How is it going? I am wondering if my color changing script tween’s code can be improved.

So basically, this will be used inside of a menu, and the buttons change color. If that menu is being selected, the tween will play on the menu, and make it green. If not, the menu will turn white.

local TweenService = game:GetService("TweenService")
local ColorChangingTweenInfo = TweenInfo.new(0.2, Enum.EasingStyle.Linear, Enum.EasingDirection.InOut, 0, false, 0)

for _, Buttons in pairs(script.Parent:GetChildren()) do
	if Buttons:IsA("GuiButton") then
		Buttons.MouseButton1Click:Connect(function()
			for _, Menus in pairs(script.Parent.Parent.ScrollingFrame:GetChildren()) do
				if Menus:IsA("Frame") then
					Menus.Visible = false
				end
				if Menus.Name == Buttons.Name then
					Menus.Visible = true
				end
				for _, Button in pairs(script.Parent:GetChildren()) do
					if Button:IsA("GuiButton") then
						if Button.Name ~= Buttons.Name then
							TweenService:Create(Button, ColorChangingTweenInfo, {BackgroundColor3 = Color3.new(1, 1, 1), TextColor3 = Color3.new(0, 0, 0)}):Play()
						else
							TweenService:Create(Button, ColorChangingTweenInfo, {BackgroundColor3 = Color3.new(0, 0.666667, 0), TextColor3 = Color3.new(1, 1, 1)}):Play()
						end
					end
				end
			end
		end)
	end
end

If you believe there is something I should change, please let me know. Thanks! WE

2 Likes

I think maybe you could play with the numbers a bit here. Other than that it’s pretty awesome!

Or maybe the colour sequences.

Im actually perfectly happy with the colors I chose, and the numbers. 0.1 was too fast, 0.3 was too slow. 0.2 was perfect.

1 Like

Alright, I just tested it and I agree! Great job and great design. You should be happy with your work!

1 Like

Probably late but here’s how I’d do it

local TweenService = game:GetService("TweenService")
local ColorChangingTweenInfo = TweenInfo.new(0.2, Enum.EasingStyle.Linear, Enum.EasingDirection.InOut, 0, false, 0)

local Tween1 = {BackgroundColor3 = Color3.new(1, 1, 1), TextColor3 = Color3.new(0, 0, 0)}
local Tween2 = {BackgroundColor3 = Color3.new(0, 0.666667, 0), TextColor3 = Color3.new(1, 1, 1)}

for _, Buttons in pairs(script.Parent:GetChildren()) do
	if not Buttons:IsA("GuiButton") then
		continue
	end
	Buttons.MouseButton1Click:Connect(function()
		for _, Menus in pairs(script.Parent.Parent.ScrollingFrame:GetChildren()) do
			if Menus:IsA("Frame") then
				Menus.Visible = Menus.Name == Buttons.Name
			end
			for _, Button in pairs(script.Parent:GetChildren()) do
				if not Button:IsA("GuiButton") then
					continue
				end
				local chosenTween = Button.Name ~= Buttons.Name and Tween1 or Tween2
				TweenService:Create(Button, ColorChangingTweenInfo, chosenTween):Play()
			end
		end
	end)
end

If Menus doesn’t have a visible property it’ll error. You can put it in the IsA if statement and just make it equal to the result of a condition, in this case, if the names are the same

For your tweening, you can put the tweens as variables and use a fake ternary to pick which one it should use

local chosenTween = Button.Name ~= Buttons.Name and Tween1 or Tween2
TweenService:Create(Button, ColorChangingTweenInfo, chosenTween):Play()

If the name of the buttons are not the same, choose the first tween, otherwise choose the second and use that info to create a tween and then play it

I also used Guard clauses to remove some indentation whilst keeping functionality the same