Flex 4 state syntax example usage
Posted on 05 June 2009
Raise your hand if you were as frustrated as I when it came to Flex 3 and state management.
Simple or basic application states were of no real concern, but as states grew and became more and more complicated, managing and manipulating these states became a tedious and even just plain silly task.
Flex 4 (“Gumbo”) brings about a much more advanced and welcome implementation of states.
This isn’t a blog post comparing Flex 3 and Flex 4’s state architectures, but more a simple example of using the new state syntax in Flex 4. Regardless if you had ever used states in Flex 3 or not is really unimportant, this is the new and ‘correct’ way to implement an application state system. IMHO.
Flex 4 states are defined as follows:
[as3]
<s:states>
<s:State name="State1"/>
<s:State name="State2"/>
</s:states>
[/as3]
Using Flex 4 states on a specific button component would be as follows:
[as3]
<s:Button
label="I’m a button"
x.State1="10" y.State1="10"
x.State2="20" y.State2="20"
click.State1="button_clickHandler(event)"
click.State2="other_clickHandler(event)"
/>
[/as3]
Another obviously excellent set of features in the new Flex 4 state system are the “includeIn” and “excludeFrom” attributes:
[as3]
<mx:Label x="100" y="200" text="My Label 1" includeIn="State1, State2"/>
<mx:Label x="100" y="300" text="My Label 2" excludeFrom="State2"/>
[/as3]
Well done guys!
All the meat on states in Flex 4, with comparisons to Flex 3 and Flex 2 can be found here. This is a good read!
http://opensource.adobe.com/wiki/display/flexsdk/Enhanced+States+Syntax
~moses
Responses are closed for this post.