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|
|The layer is about to animate to a new state.|
|The state switch animation stopped. (Is always triggered, either when it was stopped halfway or ran until completion.)|
|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’"
As you can see in the above example, you can lookup a layer’s current state with
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: ‘#’"