How to make when you click a button, its color changes and remains unchanged

Help and Feedback Scripting Support
#1

Hello everyone! I’m making a main menu for my game and I ran into a pretty complicated problem that I can’t get out for myself. Before I made this post, I seached throughout the entire internet for an answer, and changed my code many times but it still doesn’t work.

I made a MouseEnter and MouseLeave thing, and it works perfectly fine, but I want to when i click some button, it goes to the color to the MouseEnter until I click another button, basically indicating that you selected that button, that in my view it’s fancier and it’s used on most games nowadays.

The problem is that when I change the color of the button, The MouseLeave goes and changes it’s color, making it useless (atleast it was before I change the code, and I think it’s the same problem yet but I don’t know)

I made a stringvalue on ReplicatedStorage named “MapSelected”, so when you click a button, the value changes to the button name, and I tried triggering the MouseLeave just when the value of the string is not as the same as button, but that logic didn’t work (and it’s perfect, why it doenst!!!)

Well, heres the script, any help is appreciated, I’m already frustated with this and it’s my second post without any answer

HoverEffects

local sound = script:WaitForChild("Hover sound test 3")

local replicatedStorage = game:GetService("ReplicatedStorage")

local selectedMap = replicatedStorage:WaitForChild("SelectedMap")

for i, button in pairs(script.Parent:GetChildren()) do
	if button:IsA("ImageButton")  then
		button.MouseEnter:Connect(function()
			local textButton = button:WaitForChild("Text")
			button.ImageTransparency = 0
			textButton.BackgroundColor3 = Color3.fromRGB(255,100,0)
			textButton.TextColor3 = Color3.fromRGB(0,0,0)
			sound:Play()
		end)

		button.MouseButton1Click:Connect(function()
			selectedMap.Value = button.Name
			if selectedMap.Value == button.Name then
				button.MouseLeave:Connect(function()
					local textButton = button:WaitForChild("Text")
					button.ImageTransparency = 0
					textButton.BackgroundColor3 = Color3.fromRGB(255,100,0)
					textButton.TextColor3 = Color3.fromRGB(0,0,0)
				end)
			end
		end)
	end
end

I fixed something and discovered that when clicking some button it works perfectly and the button color is fixed, but when clicking another one, the button you pressed before dont change colors

2 Likes
#2

Try connecting the MouseLeave event no matter what, then handle what to do inside of that event. When the MouseLeave event fires, only change the color if the button is not the selected button.

#3

wait so i put the mouseleave, and inside of the function i put the if statement

#4

Yeah, treat it like the MouseButton1Click event. Don’t connect the event inside of another event, you may run the risk of connections overlapping and never clearing up.

#5

well i tried that and came with this

local sound = script:WaitForChild("Hover sound test 3")

local replicatedStorage = game:GetService("ReplicatedStorage")

local selectedMap = replicatedStorage:WaitForChild("SelectedMap")

for i, button in pairs(script.Parent:GetChildren()) do
	if button:IsA("ImageButton")  then
		button.MouseEnter:Connect(function()
			local textButton = button:WaitForChild("Text")
			button.ImageTransparency = 0
			textButton.BackgroundColor3 = Color3.fromRGB(255,100,0)
			textButton.TextColor3 = Color3.fromRGB(0,0,0)
			sound:Play()
		end)
		
		button.MouseLeave:Connect(function()
			if not selectedMap.Value == button.Name then
				print("theres nothing wrong-")
				local textButton = button:WaitForChild("Text")
				button.ImageTransparency = 0
				textButton.BackgroundColor3 = Color3.fromRGB(255,100,0)
				textButton.TextColor3 = Color3.fromRGB(0,0,0)
			end			
		end)
	end
end

but when i hover my mouse over a button, without even clicking it, the mouseleave dont fire no matter what

#6

Try using the ~= operation instead of “not object == thing”

#7

well, now it prints but it doesnt work itself, the button dont change color when i hover over it

#8

It looks like the colors you’re setting are the same for the MouseEnter and MouseLeave events.

#9

omg what an oversight, now it works but when i click another button, the button i pressed before stays with the color of the mousenter, and i think i have an idea to solve this but i dont know if it will work, maybe can i make a formerbutton variable and then make a elseif statement then in this elseif put the color of the formerbutton to normal, or its a waste of time

and actually idk how to make the formerbutton variable

#10

I would probably keep an empty variable at the top of the script and set it every time a MouseEnter event is fired. But before setting the variable to the new button, check if an old button exists. If there is one that isn’t the button you just fired MouseEnter on, set the old button color. Beware of the MouseLeave event firing when you try to set the old button color. If that happens, you may have to iterate over all of the buttons instead of using a variable.

#11

how would i check if theres a old button that i had fired mousenter?

#12 
if lastButton then

end