How to rotate gui button when the mouse entered it

Help and Feedback Scripting Support
,
#1

I’m trying to make a GUI button rotate when the mouse entered it, but in a smooth way. I used TweenService but when I tested it, it returns to its normal rotation (0) for 1 second.

Any help is appreciated!

You can view the script I made using TweenService but it didn’t work out well.


local Button = script.Parent

local tInfo = TweenInfo.new(
	.7,
	Enum.EasingStyle.Quint,
	Enum.EasingDirection.In,
	1,
	true,
	0
)

local tween1 = TweenService:Create(Button, tInfo, {Rotation = 45})

local mouseIn = false

Button.MouseButton1Click:Connect(function()
	
end)

Button.MouseEnter:Connect(function()
	tween1:Play()
	wait(.3)
	Button.Rotation = 45
end)

How it looks like:
robloxapp-20220325-2004223.wmv (216.3 KB)

1 Like
#2

If you don’t want it to go back to it’s original position, set the boolean value in the TweenInfo to false, and set the repeat time (one above the boolean) to 0. To return it to it’s normal position; create a new tween that plays on GUIObject.MouseLeave with same tweeninfo but with the Rotation goal set to 0.

Here’s your fixed script:


local Button = script.Parent

local tInfo = TweenInfo.new(
	.7,
	Enum.EasingStyle.Quint,
	Enum.EasingDirection.In,
	0,
	false,
	0
)

local tween1 = TweenService:Create(Button, tInfo, {Rotation = 45})

local mouseIn = false

Button.MouseButton1Click:Connect(function()
	
end)

Button.MouseEnter:Connect(function()
	tween1:Play()
	task.wait(.3)
	Button.Rotation = 45
end)
2 Likes