Animations
Learn how to make animations with Enoria.
There is no official animations implementations in Enoria. However, every Enoria widget is a normal GUI Object (Frame
, TextLabel
, etc.). These can be animated with the TweenPosition
or TweenSize
functions. The simplest way to get a widget as a Roblox GUI object is to give it a name and to get it with the GetElementByName
function of the Context
object.
For instance, we have a menu with a play button that we want to hide (with slide animation):
local e = require(game.ReplicatedStorage.Enoria.Enoria)
local Widget = require(game.ReplicatedStorage.Enoria.Enoria.Parent.Widgets.Widget)
local Menu = {}
Menu.__index = Menu
setmetatable(Menu, Widget)
function Menu.new(context, title)
local self = Widget.new(nil, nil, context)
setmetatable(self, Menu)
self.Visible = true
self.Title = title
return self
end
function Menu:Build()
local tree
if self.Visible then
tree = self:BuildTree(
e.Container({
Name = "menuFrame",
Child = e.Column({
HorizontalAlignment = Enum.HorizontalAlignment.Center,
Children = {
e.VerticalSpacer(16),
e.TextLabel(self.Title, { Class = "title" }),
e.Container({ Size = UDim2.new(0, 0, 0.5, 0), Class = "transp" }),
e.TextButton("Play", {
OnClick = function()
self.Context.GetElementByName("menuFrame"):TweenPosition(
UDim2.new(1, 0, 0, 0),
Enum.EasingDirection.In,
Enum.EasingStyle.Sine,
0.5,
true,
function()
self:SetState(function()
self.Visible = false
end)
end
)
end,
Class = "button"
})
}
})
})
)
else
tree = self:BuildTree(
e.TextButton("Open", {
OnClick = function()
self:SetState(function()
self.Visible = true
end)
end,
Class = "button"
})
)
end
return tree
end
return Menu
At line 23 we give the menu Container a name. Then, at line 32, we can grab it by it's name and animated.
Last updated
Was this helpful?