LGUI2:Animation Types

From Lavish Software Wiki
Jump to: navigation, search

An Animation is an algorithm applied to an element, which can alter the element over time. This is in contrast to a Style, which alters the element instantly.

Each Animation is a parameterized instance of a particular Animation Type, which provides the algorithm. For example, a slide Animation Type can be added to move an element smoothly over time.

Defining an Animation Type

LavishGUI 2 Animation Types are defined by a JSON Object enclosed by {}

Animation Types can use LavishScript embedded in JSON (as with a "code" Event Handler), or access a Method of a specified Object (as with a "method" Event Handler)

Animation Type properties
name The name of the new Animation Type
Embedded LavishScript
code The embedded LavishScript code. Note that the embedded LavishScript code must be escaped to fit within JSON string syntax.
LavishScript Object Method call
object The LavishScript object (globally accessible) with the method to execute
method The method on the object to execute
methodArgs A JSON Array of parameters to pass directly to the method

Example

A continuous "spin" animation that operates on radialpanel elements (Object Method version)
{
  "name":"spin",
  "object":"MyController",
  "method":"Spin"
} 
Registering an Animation Type via LavishScript
LGUI2:RegisterAnimationType["{\"name\":\"spin\",\"object\":\"RadialController\",\"method\":\"Spin\"}"]
LavishScript portion for the "spin" animation
objectdef myController
{
	method Spin()
	{
		; echo myController:Spin ${Context(type)} ${Context.Element(type)} ${Context.Animation.Type} ${Context.Args} ${Context.Timestamp} ${Context.FrameState}
		; can be stopped here with Context.Animation:Stop
		variable float diffTime=${Context.Animation.FrameElapsed}
		if ${diffTime.Equal[0]}
			return

		variable float newOrigin
               ; rotating clockwise at spinRate degrees per second (e.g. 60 degrees/second, per the "Activating" example below)
		newOrigin:Set[${Context.Element.Origin}+(${Context.Args[spinRate]}*${diffTime})]
		Context.Element:SetOrigin[${newOrigin}]
	}
}
variable(global) myController MyController

Activating the "spin" animation via LavishScript
LGUI2.Element[elementName]:Animate["{\"type\":\"spin\",\"name\":\"spin\",\"spinRate\":60}"]

LavishGUI 2 Animation Types

Basic Animations
fade - slide - value
Utilities
chain - composite - delay - random - repeat

LavishGUI 2 Topics