TweenService

Show Deprecated

Not Creatable

Service

Tweens are used to interpolate the properties of instances. These can be used to create animations for various Roblox objects. Almost any numeric property can be tweened using TweenService. Note that only specific types of properties can be used with TweenService. The types of properties that can be tweened are:

TweenService's constructor function, TweenService:Create(), takes information about the animation and generates the Tween object which can be used to play the animation. Note that Tweens can animate multiple properties at the same time.

Details on how the interpolation of the tween is to be carried out are given in the tweenInfo parameter of TweenService:Create(). The TweenInfo data type includes a range of properties that can be used to achieve various styles of animation, including reversing and looping Tweens (see examples).

Multiple tweens can be played on the same object at the same time, but they must not be animating the same property. If two tweens attempt to modify the same property, the initial tween will be cancelled and overwritten by the most recent tween (see examples).

Although other methods exist for tweening objects, such as GuiObject:TweenSizeAndPosition(), TweenService allows multiple properties to be modified and for the animation to be paused and cancelled at any point.

Code Samples

Tween Creation

local TweenService = game:GetService("TweenService")

local part = Instance.new("Part")
part.Position = Vector3.new(0, 10, 0)
part.Color = Color3.new(1, 0, 0)
part.Anchored = true
part.Parent = game.Workspace

local goal = {}
goal.Position = Vector3.new(10, 10, 0)
goal.Color = Color3.new(0, 1, 0)

local tweenInfo = TweenInfo.new(5)

local tween = TweenService:Create(part, tweenInfo, goal)

tween:Play()

Tween Conflict

local TweenService = game:GetService("TweenService")

local part = Instance.new("Part")
part.Position = Vector3.new(0, 10, 0)
part.Anchored = true
part.Parent = game.Workspace

local tweenInfo = TweenInfo.new(5)

-- create two conflicting tweens (both trying to animate part.Position)
local tween1 = TweenService:Create(part, tweenInfo, { Position = Vector3.new(0, 10, 20) })
local tween2 = TweenService:Create(part, tweenInfo, { Position = Vector3.new(0, 30, 0) })

-- listen for their completion status
tween1.Completed:Connect(function(playbackState)
	print("tween1: " .. tostring(playbackState))
end)
tween2.Completed:Connect(function(playbackState)
	print("tween2: " .. tostring(playbackState))
end)

-- try to play them both
tween1:Play()
tween2:Play()

Looping a Tween

local TweenService = game:GetService("TweenService")

local part = Instance.new("Part")
part.Position = Vector3.new(0, 10, 0)
part.Anchored = true
part.Parent = workspace

local tweenInfo = TweenInfo.new(
	2, -- Time
	Enum.EasingStyle.Linear, -- EasingStyle
	Enum.EasingDirection.Out, -- EasingDirection
	-1, -- RepeatCount (when less than zero the tween will loop indefinitely)
	true, -- Reverses (tween will reverse once reaching it's goal)
	0 -- DelayTime
)

local tween = TweenService:Create(part, tweenInfo, { Position = Vector3.new(0, 30, 0) })

tween:Play()
task.wait(10)
tween:Cancel() -- cancel the animation after 10 seconds

Pausing a Tween

local TweenService = game:GetService("TweenService")

local part = Instance.new("Part")
part.Position = Vector3.new(0, 10, 0)
part.Anchored = true
part.BrickColor = BrickColor.new("Bright green")
part.Parent = workspace

local goal = {}
goal.Position = Vector3.new(50, 10, 0)

local tweenInfo = TweenInfo.new(10, Enum.EasingStyle.Linear)

local tween = TweenService:Create(part, tweenInfo, goal)

tween:Play()

task.wait(3)
part.BrickColor = BrickColor.new("Bright red")
tween:Pause()

task.wait(2)
part.BrickColor = BrickColor.new("Bright green")
tween:Play()

Tween an EnumItem

local TweenService = game:GetService("TweenService")

local part = Instance.new("Part")
part.Shape = 0
part.TopSurface = 0
part.BottomSurface = 0
part.Size = Vector3.new(1, 1, 1)
part.Position = Vector3.new(0, 100, 0)
part.Parent = workspace

local info = TweenInfo.new(5)

local propertyTable = {
	Shape = 2,
}

TweenService:Create(part, info, propertyTable):Play()

Summary

Properties

Properties inherited from Instance

Methods

Create(instance: Instance, tweenInfo: TweenInfo, propertyTable: table): Tween

Creates a new Tween given the object whose properties are to be tweened, a TweenInfo and a dictionary of goal property values.

GetValue(alpha: number, easingStyle: EasingStyle, easingDirection: EasingDirection): number

Calculates a new alpha given an EasingStyle and EasingDirection.

Methods inherited from Instance

Events

Events inherited from Instance

Properties

Properties inherited from Instance

Methods

Create

Tween

The Create function of TweenService creates a new Tween. The function takes three arguments: the object to tween, the TweenInfo to use, and a table containing the properties to tween and the values to tween to.

Tweens are used to interpolate the properties of instances. These can be used to create animations for various Roblox objects. Almost any numeric property can be tweened using TweenService.

The propertyTable parameter that is passed in needs to be a dictionary where the keys are the string names of the property (e.g. "Position", "Transparency", "Color", etc), and the value is the value the property needs to be at the end of the tween. Note that only specific types of properties can be used with TweenService, but multiple properties can be animated in the same tween. The types of properties that can be tweened are:

The Tween created using this function is unique to the object given as the instance parameter. To apply the same tween to another object, call this function again with the new object.

Details on how the interpolation of the tween is to be carried out are given in the TweenInfo parameter, such as reversing, looping and easing.

Parameters

instance: Instance

The Instance whose properties are to be tweened.

tweenInfo: TweenInfo

The TweenInfo to be used.

propertyTable: table

A dictionary of properties, and their target values, to be tweened.

Returns

Tween

Code Samples

Tween Creation

local TweenService = game:GetService("TweenService")

local part = Instance.new("Part")
part.Position = Vector3.new(0, 10, 0)
part.Color = Color3.new(1, 0, 0)
part.Anchored = true
part.Parent = game.Workspace

local goal = {}
goal.Position = Vector3.new(10, 10, 0)
goal.Color = Color3.new(0, 1, 0)

local tweenInfo = TweenInfo.new(5)

local tween = TweenService:Create(part, tweenInfo, goal)

tween:Play()

Looping a Tween

local TweenService = game:GetService("TweenService")

local part = Instance.new("Part")
part.Position = Vector3.new(0, 10, 0)
part.Anchored = true
part.Parent = workspace

local tweenInfo = TweenInfo.new(
	2, -- Time
	Enum.EasingStyle.Linear, -- EasingStyle
	Enum.EasingDirection.Out, -- EasingDirection
	-1, -- RepeatCount (when less than zero the tween will loop indefinitely)
	true, -- Reverses (tween will reverse once reaching it's goal)
	0 -- DelayTime
)

local tween = TweenService:Create(part, tweenInfo, { Position = Vector3.new(0, 30, 0) })

tween:Play()
task.wait(10)
tween:Cancel() -- cancel the animation after 10 seconds

GetValue

number

Returns a new alpha value for interpolating using the given alpha value, EasingStyle, and EasingDirection.

The provided alpha value is clamped between 0 and 1.

Parameters

alpha: number

An interpolation value between 0 and 1.

easingStyle: EasingStyle

The easing style to use.

easingDirection: EasingDirection

The easing direction to use.