Animation

Animation is an abstract base element for all the other Zing animation elements.

You cannot create an Animation element directly, but its properties and methods are common across the other animation types.

static async function Animation.tween(ref<Int> property, Int value)

static async function Animation.tween(ref<Float> property, Float value)

static async function Animation.tween(ref<Color> property, Color value)

Tween property to value. You can tween any property of a tweenable type - Int, Float or Color. To adjust the tween parameters, use the optional parameters shown below.

Animation.tween(root.x, 150, duration: 500)

optional Int duration: 250

The duration, in milliseconds, to tween over.

optional Easing easing

The easing curve to use. If not specified, a linear curve is used.

optional Int delay: 0

The delay, in milliseconds, to wait before beginning to tween.

View the Animation Tween Example projectSave

property Bool running: false

If running is set to true, the animation will run immediately when the element is instantiated. By default this is false.

property Int loops: 1

The number of times the animation should loop.

To loop forever (or until the animation is explicitly stopped) set loops to Int.Max.

Animation.Tween {
    loops: .Max // Loop forever
    target: rectangle.x
    from: 0; to: 20
    duration: 1000
}

function start()

start() begins an animation if it is not already running. If it is already running, calling start() has no effect.

function stop()

stop() ends an animation immediately. If it was not already running, calling stop() has no effect.

function restart()

restart() restarts an animation from the beginning, regardless of whether or not it was already running. That is, if it is not running it starts it, and if it is running it restarts the animation from the beginning.