Events » State change events

State change events

If you want something to happen when a layer changes state, you can listen to the following events. They are similar to the animation events.

State change events
`onStateSwitchStart`	The layer is about to animate to a new state.
`onStateSwitchStop`	The state switch animation stopped. (Is always triggered, either when it was stopped halfway or ran until completion.)
`onStateSwitchEnd`	The layer finished animating to a new state.

Here’s an example:

redSquare.onStateSwitchStart ->
    print "Switching from state: ‘#’"
redSquare.onStateSwitchEnd ->
    print "… to state: ‘#’"

When you tap on the square, it will output…

» "Switching from state: ‘default’"

…and then a second later, when the state switch completed:

» "… to state: ‘bigAndBlue’"

Current state

As you can see in the above example, you can lookup a layer’s current state with states.current.name.

Pro tip: By adding (from, to) parameters to your event handler (in this order) you can more easily access the names of both the current and next state.

redSquare.onStateSwitchStart (from, to) ->
    print "Switching from state: ‘#’"
redSquare.onStateSwitchEnd (from, to) ->
    print "… to state: ‘#’"

State change events

Current state

Overview of the state change events