φ Famo.us University Famo.us/Angular Docs Help Blog Download
  • core
  • Context
  • ElementAllocator
  • ElementOutput
  • Engine
  • Entity
  • EventEmitter
  • EventHandler
  • Group
  • Modifier
  • OptionsManager
  • RenderNode
  • Scene
  • SpecParser
  • Surface
  • Transform
  • View
  • ViewSequence
  • events
  • EventArbiter
  • EventFilter
  • EventMapper
  • inputs
  • Accumulator
  • GenericSync
  • MouseSync
  • PinchSync
  • RotateSync
  • ScaleSync
  • ScrollSync
  • TouchSync
  • TouchTracker
  • TwoFingerSync
  • math
  • Matrix
  • Quaternion
  • Random
  • Utilities
  • Vector
  • modifiers
  • Draggable
  • Fader
  • ModifierChain
  • StateModifier
  • physics
  • PhysicsEngine
  • physics/bodies
  • Body
  • Circle
  • Particle
  • Rectangle
  • physics/constraints
  • Collision
  • Constraint
  • Curve
  • Distance
  • Snap
  • Surface
  • Wall
  • Walls
  • physics/forces
  • Drag
  • Force
  • Repulsion
  • RotationalDrag
  • RotationalSpring
  • Spring
  • VectorField
  • physics/integrators
  • SymplecticEuler
  • surfaces
  • CanvasSurface
  • ContainerSurface
  • ImageSurface
  • InputSurface
  • TextareaSurface
  • VideoSurface
  • transitions
  • CachedMap
  • Easing
  • MultipleTransition
  • SnapTransition
  • SpringTransition
  • Transitionable
  • TransitionableTransform
  • TweenTransition
  • WallTransition
  • utilities
  • KeyCodes
  • Timer
  • Utility
  • views
  • ContextualView
  • Deck
  • DrawerLayout
  • EdgeSwapper
  • FlexibleLayout
  • Flipper
  • GridLayout
  • HeaderFooterLayout
  • Lightbox
  • RenderController
  • ScrollContainer
  • Scroller
  • Scrollview
  • SequentialLayout
  • widgets
  • NavigationBar
  • TabBar

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.

Overview

Options
transform
opacity
origin
align
size
propportions
Methods
setTransform
setOpacity
setOrigin
setAlign
setSize
setProportions
halt
getTransform
getFinalTransform
getOpacity
getOrigin
getAlign
getSize
getProportions

StateModifier(options)

Constructor Parameters

options

Object

overrides of default options

transform
Transform
affine transformation matrix
opacity
Number
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

setTransform(transform, transition, callback)

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.

getTransform()

Get the current state of the transform matrix component.

Returns
Object
transform provider object

getFinalTransform()

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
Branding Terms Privacy Jobs © Famous Industries, Inc. 2015