GUI Color Tween Help

  1. So, What I want to do is have the gui’s button change color then when something else is clicked the button reverts back to its original color

  2. I’ve been able to make it tween to a nice shade of green but when I clicked on a different button it stayed the green instead of reverting back to the gray-ish color

  3. I’ve tried looking up tutorials on youtube to see if I could find something that would help out then I came to dev forum but couldn’t find anything that matches my issue / anything that’s close to my issue I tried doing MouseButton1UP:Connect() then the same stuff that’s in the code pic but it ended up just not changing colors

GIF:
https://gyazo.com/a95cf0e029a1d4ec006f1428337dd1ce

Picture of the code:

PS: Sorry if the code’s sloppy, just started learning about scripting

I think you should create another tween to change the color back.

You should use one script to control the three buttons. That way, once you click one button you can tween the other two to gray, and the one you clicked to green.

If you’re trying to revert it back to it’s original color, I’d suggest checking out the TweenInfo API.

It states that, there is a property when instantiating TweenInfo, which essentially acts as a way to reverse the tween. It takes a boolean data type in, only. I’ll instantiate a TweenInfo with all their respective data types, and show you where exactly the reverse boolean fits in. I hope this helps! :grinning_face_with_smiling_eyes:

local Tween_Info = TweenInfo.new(number Time Enum easingStyle, Enum easingDirection, number repeatCount, bool Does_Reverse, number Delay_Time);

EDIT: Oh. I see I read this wrong, you should probably instantiate another goal, that being the original color instead, then firing that tween with the respective goal when needed.

1 Like

wrote a quick example, the comments in the script says it all:

code in work: gif

local tweenService = game:GetService("TweenService")
local button1 = yourButton1 --set these to the correct path to the buttons you want to change colors
local button2 = yourButton2
local button3 = yourButton3

local tableOfButtons = {} --create a table

--and insert the buttons to the table
table.insert(tableOfButtons, button1)
table.insert(tableOfButtons, button2)
table.insert(tableOfButtons, button3)

local click = nil
local originalColor = Color3.fromRGB(57,57,57)
local newColor = Color3.fromRGB(108,202,108)

local tweenInfo = TweenInfo.new(0.5, Enum.EasingStyle.Sine, Enum.EasingDirection.InOut)

for i=1, #tableOfButtons do
	tableOfButtons[i].MouseButton1Click:Connect(function()
		if click ~= nil then --check if any button was clicked before
			local tween = tweenService:Create(click, tweenInfo, {BackgroundColor3 = originalColor}) --create a tween to tween the button to the original tween
			tween:Play()
		end
		
		local tween = tweenService:Create(tableOfButtons[i], tweenInfo, {BackgroundColor3 = newColor}) --create a tween to tween the button to the new color
		tween:Play()
		
		click = tableOfButtons[i] --sets "click" to the last button that was clicked
	end)
end

Tysm this helped a lot, much appreciated!!!

1 Like

Of course! I’m glad I could help. :slight_smile:

Very helpful, started making a new script combining them together thank you for the suggestion!