Tweening gui easingStyle problem

Hello, developers!
I got that issue a lot of times but only now i am writing this.

The problem: gui is acting soo weird if i use any other enum style than sine.

the script:

local frame = script.Parent
local button = frame:WaitForChild("Button")

local mainPos = UDim2.new(0.356, 0,0.822, 0)
local tweenedPos = UDim2.new(0.356, 0,0.818, 0)

frame.MouseEnter:Connect(function()
	frame:TweenPosition(tweenedPos, Enum.EasingDirection.InOut, Enum.EasingStyle.Sine, 0.2, true)
end)

frame.MouseLeave:Connect(function()
	frame:TweenPosition(mainPos, Enum.EasingDirection.InOut, Enum.EasingStyle.Sine, 0.2, true)
end)

image

How it works: if i use sine - it tweens perfectly. if i use any other enum style then it just tweens really weird. i dont know how to explain and i cant provide a video. sorry.

In my case, all but Enum.EasingStyle.Exponential are functional. I thought it was fixed long ago, but it appears it still isn’t. This only happens with the TweenX() functions for GuiObjects.

As an alternative, use TweenService with TweenInfo.

  • TweenService allows almost any instance properties to be tweened, not just UI objects.
  • TweenInfo is what you shall use to determine how the tween should progress/move.

Here’s you code with Tween objects used instead of TweenPosition:

local TweenService = game:GetService("TweenService")

local frame = script.Parent
local button = frame:WaitForChild("Button")

local mainPos = UDim2.new(0.356, 0,0.822, 0)
local tweenedPos = UDim2.new(0.356, 0,0.818, 0)

local tweenMovement = TweenInfo.new(
	-- The ordering of tween settings is the opposite of TweenPosition.
	0.2,
	Enum.EasingStyle.Exponential,
	Enum.EasingDirection.InOut
)

local tweenEnter = TweenService:Create(
	frame, -- Instance you want to animate.
	tweenMovement, -- TweenInfo.
	{Position = tweenedPos} -- A table of properties to animate. Property names are case-sensitive.
)
local tweenLeave = TweenService:Create(
	frame,
	mainPos,
	{Position = mainPos}
)

frame.MouseEnter:Connect(function()
	tweenEnter:Play()
end)

frame.MouseLeave:Connect(function()
	tweenLeave:Play()
end)
2 Likes

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.