SurfaceGui Hovering Animation system

DragonDarkVader · November 16, 2022, 2:21pm

**Hello, I’m having trouble on a SurfaceGui Hover Animation System, Do you guys know why it’s not working?

CODE:

local btn = script.Parent

local isHovering = false


btn.MouseEnter:Connect(function()
	
	isHovering = true
	
	btn:TweenSize(UDim2.new(0, 73,0, 13), Enum.EasingDirection.InOut, Enum.EasingStyle.Quint, 0.2, true)
end)

btn.MouseLeave:Connect(function()
	
	isHovering = false
	
	btn:TweenSize(UDim2.new(0, 70,0, 13), Enum.EasingDirection.InOut, Enum.EasingStyle.Quint, 0.2, true)
end)

btn.MouseButton1Down:Connect(function()
	
	btn:TweenSize(UDim2.new(0.265, 0, 0.13, 0), Enum.EasingDirection.InOut, Enum.EasingStyle.Quint, 0.2, true)
end)

btn.MouseButton1Up:Connect(function()
	
	if not isHovering then
		btn:TweenSize(UDim2.new(0, 70,0, 13), Enum.EasingDirection.InOut, Enum.EasingStyle.Quint, 0.2, true)
	else
		btn:TweenSize(UDim2.new(0, 73,0, 13), Enum.EasingDirection.InOut, Enum.EasingStyle.Quint, 0.2, true)
	end
end)

Loraviis · November 16, 2022, 2:25pm

Elaborate upon the issue. Just saying “it’s not working” is not gonna make it easy for us to help you. Give us console outputs (errors) and tell us how or what isn’t working the way you intended it to (videos and screenshots can be helpful too).

DragonDarkVader · November 16, 2022, 2:27pm

Oh, for starts. I found a Hover script in YT. And i made a TextButton (Suppose to add that in) in SurfaceGui, but the Animation won’t play in SurfaceGui

Loraviis · November 16, 2022, 2:28pm

Is the console giving you any errors?

DragonDarkVader · November 16, 2022, 2:29pm

DragonDarkVader · November 16, 2022, 2:29pm

No, Not exactly…Is the Hover script not compatible for SurfaceGui's?

weakroblox35 · November 16, 2022, 2:32pm

Use TweenService instead of TweenSize

local __TS = game:GetService("TweenService")
local btn = script.Parent

local isHovering = false


btn.MouseEnter:Connect(function()
	
	isHovering = true
	
	__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut, Enum.EasingStyle.Quint,0.2, true), {Position = UDim2.new(0, 73,0, 13)}:Play() --Not sure if 0.2 is either `time` or `repeatcount` also i presume you want to tween Position?
end)

DragonDarkVader · November 16, 2022, 2:32pm

I’ll try it out, I’ll update you guys if it works

DragonDarkVader · November 16, 2022, 2:34pm

How will the Animation work? It’s currently a Size Animation. Not a Position Animation

weakroblox35 · November 16, 2022, 2:36pm

Just change position to Size in that case.

DragonDarkVader · November 16, 2022, 2:37pm

So i’ll just add it above the whole script?

DragonDarkVader · November 16, 2022, 2:38pm

This?

local TS = game:GetService("TweenService")
local btn = script.Parent

local isHovering = false


btn.MouseEnter:Connect(function()

	isHovering = true
	
	local btn = script.Parent

	local isHovering = false


	btn.MouseEnter:Connect(function()

		isHovering = true

		btn:TweenSize(UDim2.new(0, 73,0, 13), Enum.EasingDirection.InOut, Enum.EasingStyle.Quint, 0.2, true)
	end)

	btn.MouseLeave:Connect(function()

		isHovering = false

		btn:TweenSize(UDim2.new(0, 70,0, 13), Enum.EasingDirection.InOut, Enum.EasingStyle.Quint, 0.2, true)
	end)

	btn.MouseButton1Down:Connect(function()

		btn:TweenSize(UDim2.new(0, 70,0, 13), Enum.EasingDirection.InOut, Enum.EasingStyle.Quint, 0.2, true)
	end)

	btn.MouseButton1Up:Connect(function()

		if not isHovering then
			btn:TweenSize(UDim2.new(0, 70,0, 13), Enum.EasingDirection.InOut, Enum.EasingStyle.Quint, 0.2, true)
		else
			btn:TweenSize(UDim2.new(0, 73,0, 13), Enum.EasingDirection.InOut, Enum.EasingStyle.Quint, 0.2, true)
		end
	end)

	
end)

weakroblox35 · November 16, 2022, 2:41pm

local btn = script.Parent
local __TS = game:GetService("TweenService")
local isHovering = false


btn.MouseEnter:Connect(function()
	
	isHovering = true
	
	__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut, Enum.EasingStyle.Quint,0.2, true), {Size = UDim2.new(0, 73,0, 13)}:Play() 

end)

btn.MouseLeave:Connect(function()
	
	isHovering = false
	
	__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut, Enum.EasingStyle.Quint,0.2, true), {Size = UDim2.new(0, 70,0, 13)}:Play()
end)

btn.MouseButton1Down:Connect(function()
	__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut, Enum.EasingStyle.Quint,0.2, true), {Size = UDim2.new(0.265, 0, 0.13, 0)}:Play() 
	
end)

btn.MouseButton1Up:Connect(function()
	
	if not isHovering then
		__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut, Enum.EasingStyle.Quint,0.2, true), {Size = UDim2.new(0, 70,0, 13)}:Play()
	else
		__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut, Enum.EasingStyle.Quint,0.2, true), {Size = UDim2.new(0, 73,0, 13)}:Play()
	end
end)

DragonDarkVader · November 16, 2022, 2:42pm

Why does it have alot of orange lines? (Warning)

weakroblox35 · November 16, 2022, 2:43pm

show me them. post a screenshot.

DragonDarkVader · November 16, 2022, 2:44pm

weakroblox35 · November 16, 2022, 2:47pm

TweenInfo.new(0.2,Enum.EasingDirection.InOut,Enum.EasingStyle.Quint,true)

This should be fix it.

DragonDarkVader · November 16, 2022, 2:48pm

Still has an orange line

	__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut,Enum.EasingStyle.Quint,true)

DragonDarkVader · November 16, 2022, 2:49pm

WHOLE SCRIPT

local btn = script.Parent
local __TS = game:GetService("TweenService")
local isHovering = false


btn.MouseEnter:Connect(function()

	isHovering = true

	__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut,Enum.EasingStyle.Quint,true)
		
		end)

btn.MouseLeave:Connect(function()

	isHovering = false

	__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut, Enum.EasingStyle.Quint,0.2, true), {Size = UDim2.new(0, 70,0, 13)}:Play()
end)

btn.MouseButton1Down:Connect(function()
	__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut, Enum.EasingStyle.Quint,0.2, true), {Size = UDim2.new(0.265, 0, 0.13, 0)}:Play() 

end)

btn.MouseButton1Up:Connect(function()

	if not isHovering then
		__TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut, Enum.EasingStyle.Quint,0.2, true), {Size = UDim2.new(0, 70,0, 13)}:Play()
	else
		_TS:Create(btn,TweenInfo.new(0.2,Enum.EasingDirection.InOut, Enum.EasingStyle.Quint,0.2, true), {Size = UDim2.new(0, 73,0, 13)}:Play()
	end
end)