For me, I always have a tween module function on my personal toolbox.
Example → in module script:
local Ui = {}
local TweenService = game:GetService("TweenService")
function Ui.TweenPosition(Gui : Frame, Time : number, Style : Enum.EasingStyle, Direction : Enum.EasingDirection, Pos : UDim2)
local Info = TweenInfo.new(Time, Style, Direction)
local Goals = {Position = Pos}
local Start = TweenService:Create(Gui, Info, Goals)
Start:Play()
end
function Ui.TweenRotation(Gui : Frame, Time : number, Style : Enum.EasingStyle, Direction : Enum.EasingDirection, Rot : number)
local Info = TweenInfo.new(Time, Style, Direction)
local Goals = {Rotation = Rot}
local Start = TweenService:Create(Gui, Info, Goals)
Start:Play()
end
function Ui.TweenSize(Gui : Frame, Time : number, Style : Enum.EasingStyle, Direction : Enum.EasingDirection, Scale : UDim2)
local Info = TweenInfo.new(Time, Style, Direction)
local Goals = {Size= Scale}
local Start = TweenService:Create(Gui, Info, Goals)
Start:Play()
end
return Ui
For custom use:
function Ui.TweenName(Gui : Frame , Time : number, Style : Enum.EasingStyle, Direction : Enum.EasingDirection, Variable)
local Info = TweenInfo.new(Time, Style, Direction)
local Goals = {ToChange = Variable} -- Where "ToChange" can be change to any type of properties that can be changed (e.g Transparency, Offset, etc.)
local Start = TweenService:Create(Gui, Info, Goals)
Start:Play()
end
In your script:
local Tween = require(game:GetService("ReplicatedStorage"):WaitForChild("Tween"))
-- Getting the module script
local Player = game:GetService("Players").LocalPlayer
local PlayerGui = Player.PlayerGui
local Frame = PlayerGui:WaitForChild("ScreenGui").Frame
-- Example Frame
task.wait(3)
Tween.TweenPosition(Frame, 2.5, Enum.EasingStyle.Quad, Enum.EasingDirection.Out, UDim2.new(0, 0, 0, 0))
Tween.TweenSize(Frame, 2.5, Enum.EasingStyle.Exponential, Enum.EasingDirection.In, UDim2.new(1, 0, 1, 0))
-- Using 2 Tweens at the same time
Tween.TweenName(FrameToChange, Time, Easing Style, Easing Direction, Final Variable)
Result:
It may seem like the change in size happens after the position; however, fear not as that only looks like it due to the easing style and direction.