StateModifier
A collection of visual changes to be applied to another renderable component, strongly coupled with the state that defines those changes. This collection includes a transform matrix, an opacity constant, a size, an origin specifier, and an alignment specifier. StateModifier objects can be added to any RenderNode or object capable of displaying renderables. The StateModifier's children and descendants are transformed by the amounts specified in the modifier's properties.
StateModifier(options)
Constructor Parameters
options
Object
overrides of default options
origin
Array.Number
origin adjustment
align
Array.Number
align adjustment
size
Array.Number
size to apply to descendants
propportions
Array.Number
proportions to apply to descendants
Methods
Show Private Methods
Set the transform matrix of this modifier, either statically or through a provided Transitionable.
Parameters
transform
Transform
Transform to transition to.
transition
Transitionable
object of type {duration: number, curve: f[0,1] -> [0,1] or name}. If transition is omitted, change will be instantaneous.
callback
Function
callback to call after transition completes
Returns
StateModifier
this
setOpacity(opacity, transition, callback)
Set the opacity of this modifier, either statically or through a provided Transitionable.
Parameters
opacity
Number
Opacity value to transition to.
transition
Transitionable
object of type {duration: number, curve: f[0,1] -> [0,1] or name}. If transition is omitted, change will be instantaneous.
callback
Function
callback to call after transition completes
Returns
StateModifier
this
setOrigin(origin, transition, callback)
Set the origin of this modifier, either statically or through a provided Transitionable.
Parameters
origin
Array.Number
two element array with values between 0 and 1.
transition
Transitionable
object of type {duration: number, curve: f[0,1] -> [0,1] or name}. If transition is omitted, change will be instantaneous.
callback
Function
callback to call after transition completes
Returns
StateModifier
this
setAlign(align, transition, callback)
Set the alignment of this modifier, either statically or through a provided Transitionable.
Parameters
align
Array.Number
two element array with values between 0 and 1.
transition
Transitionable
object of type {duration: number, curve: f[0,1] -> [0,1] or name}. If transition is omitted, change will be instantaneous.
callback
Function
callback to call after transition completes
Returns
StateModifier
this
setSize(size, transition, callback)
Set the size of this modifier, either statically or through a provided Transitionable.
Parameters
size
Array.Number
two element array of [width, height]
transition
Transitionable
object of type {duration: number, curve: f[0,1] -> [0,1] or name}. If transition is omitted, change will be instantaneous.
callback
Function
callback to call after transition completes
Returns
StateModifier
this
setProportions(proportions, transition, callback)
Set the proportions of this modifier, either statically or through a provided Transitionable.
Parameters
proportions
Array.Number
two element array with values between 0 and 1.
transition
Transitionable
Valid transitionable object
callback
Function
callback to call after transition completes
Returns
StateModifier
this
halt()
Stop the transition.
Get the current state of the transform matrix component.
Returns
Object
transform provider object
Get the destination state of the transform component.
Returns
Transform
transform matrix
getOpacity()
Get the current state of the opacity component.
Returns
Object
opacity provider object
getOrigin()
Get the current state of the origin component.
Returns
Object
origin provider object
getAlign()
Get the current state of the align component.
Returns
Object
align provider object
getSize()
Get the current state of the size component.
Returns
Object
size provider object
getProportions()
Get the current state of the propportions component.
Returns
Object
size provider object
modify(target)Private
Return render spec for this StateModifier, applying to the provided target component. This is similar to render() for Surfaces.
Parameters
target
Object
(already rendered) render spec to which to apply the transform.
Returns
Object
render spec for this StateModifier, including the provided target