Difference between revisions of "UI.Animation"
From GiderosMobile
(2 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
__NOTOC__ | __NOTOC__ | ||
+ | '''Available since:''' Gideros 2023.1<br/> | ||
+ | '''Class:''' [[UI]]<br/> | ||
=== Description === | === Description === | ||
− | Animates any given UI. | + | Animates any given UI widget. |
<syntaxhighlight lang="lua"> | <syntaxhighlight lang="lua"> | ||
UI.Animation:animate(widget,channel,animation,duration,parameters) | UI.Animation:animate(widget,channel,animation,duration,parameters) | ||
Line 15: | Line 17: | ||
* onStop: a function to call when animation has finished | * onStop: a function to call when animation has finished | ||
* easing: with a ''type'' and a ''way'' | * easing: with a ''type'' and a ''way'' | ||
− | ** '''type''': linear, quad, cubic, quart, quint, expo, sine, circ, back, steps, elastic, bounce, slowmo | + | ** '''type''': "linear", "quad", "cubic", "quart", "quint", "expo", "sine", "circ", "back", steps, elastic, bounce, slowmo |
** '''way''': out, inout, outin | ** '''way''': out, inout, outin | ||
Line 26: | Line 28: | ||
=== Examples === | === Examples === | ||
+ | '''Sliding''' | ||
<syntaxhighlight lang="lua"> | <syntaxhighlight lang="lua"> | ||
+ | -- a Label widget | ||
+ | local gui = UI.Label.new("Gideros UI") | ||
+ | gui:setPosition(64,64) | ||
+ | stage:addChild(gui) | ||
+ | |||
+ | UI.Animation:animate(gui, "anim", UI.Animation.AnchorMove, 2, | ||
+ | { | ||
+ | x=-256, y=-128, | ||
+ | easing={type="circ", way="inout"}, -- out, inout, outin | ||
+ | onStop=function() | ||
+ | print("stopped") | ||
+ | end | ||
+ | } | ||
+ | ) | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | '''Zoom''' | ||
+ | <syntaxhighlight lang="lua"> | ||
+ | -- a Label widget | ||
+ | local gui = UI.Label.new("Gideros UI") | ||
+ | gui:setPosition(64,64) | ||
+ | stage:addChild(gui) | ||
+ | |||
+ | UI.Animation:animate(gui, "scale", UI.Animation.AnchorScale, 2, | ||
+ | { | ||
+ | easing={type="quint", way="in"}, | ||
+ | onStop=function() | ||
+ | print("stopped") | ||
+ | end | ||
+ | } | ||
+ | ) | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | '''Chained animations''' | ||
+ | <syntaxhighlight lang="lua"> | ||
+ | -- two Label widgets | ||
+ | local gui = UI.Label.new("Gideros UI 1") | ||
+ | local gui2 = UI.Label.new("Gideros UI 2") | ||
+ | gui:setPosition(64,64) | ||
+ | gui2:setPosition(64,64) | ||
+ | stage:addChild(gui) | ||
+ | stage:addChild(gui2) | ||
+ | |||
+ | UI.Animation:animate(gui, "move1", UI.Animation.AnchorMove, 2, | ||
+ | { | ||
+ | x=-256, | ||
+ | y=-128, | ||
+ | onStop=function() | ||
+ | print("stopped 1") | ||
+ | UI.Animation:animate(gui2, "move2", UI.Animation.AnchorMove, 1, | ||
+ | { | ||
+ | y=-128, | ||
+ | onStop=function() | ||
+ | print("stopped 2") | ||
+ | end | ||
+ | } | ||
+ | ) | ||
+ | end | ||
+ | } | ||
+ | ) | ||
</syntaxhighlight> | </syntaxhighlight> | ||
− | {{ | + | {{UI}} |
Latest revision as of 07:16, 17 October 2023
Available since: Gideros 2023.1
Class: UI
Description
Animates any given UI widget.
UI.Animation:animate(widget,channel,animation,duration,parameters)
animation can be any of the following:
- UI.Animation.AnchorMove, params: x, y
- UI.Animation.Alpha
- UI.Animation.AnchorScale
parameters can be any of the following:
- onStop: a function to call when animation has finished
- easing: with a type and a way
- type: "linear", "quad", "cubic", "quart", "quint", "expo", "sine", "circ", "back", steps, elastic, bounce, slowmo
- way: out, inout, outin
Parameters
widget: (sprite) the widget to animate
channel: (string) the animation channel
animation: (class) one of the available animation
duration: (number) the animation duration
parameters: (table) additional animation parameters optional
Examples
Sliding
-- a Label widget
local gui = UI.Label.new("Gideros UI")
gui:setPosition(64,64)
stage:addChild(gui)
UI.Animation:animate(gui, "anim", UI.Animation.AnchorMove, 2,
{
x=-256, y=-128,
easing={type="circ", way="inout"}, -- out, inout, outin
onStop=function()
print("stopped")
end
}
)
Zoom
-- a Label widget
local gui = UI.Label.new("Gideros UI")
gui:setPosition(64,64)
stage:addChild(gui)
UI.Animation:animate(gui, "scale", UI.Animation.AnchorScale, 2,
{
easing={type="quint", way="in"},
onStop=function()
print("stopped")
end
}
)
Chained animations
-- two Label widgets
local gui = UI.Label.new("Gideros UI 1")
local gui2 = UI.Label.new("Gideros UI 2")
gui:setPosition(64,64)
gui2:setPosition(64,64)
stage:addChild(gui)
stage:addChild(gui2)
UI.Animation:animate(gui, "move1", UI.Animation.AnchorMove, 2,
{
x=-256,
y=-128,
onStop=function()
print("stopped 1")
UI.Animation:animate(gui2, "move2", UI.Animation.AnchorMove, 1,
{
y=-128,
onStop=function()
print("stopped 2")
end
}
)
end
}
)
- UI.Accordion
- UI.Animation
- UI.Bar
- UI.Behavior
- UI.Border
- UI.BreadCrumbs
- UI.Builder
- UI.Button
- UI.Calendar
- UI.Checkbox
- UI.Combobox
- UI.ImageText
- UI.Keyboard
- UI.Label
- UI.Panel
- UI.Progress
- UI.Slider
- UI.Spinner
- UI.Splitpane
- UI.TabbedPane
- UI.Table
- UI.TextField
- UI.TimePicker
- UI.Toolbox
- UI.Tree
- UI.Viewport
- UI.WeekSchedule