Programming Flex 3

Using Transitions

Transitions allow you to apply effects to state view changes. Utilizing transitions is very simple. The prerequisite for transitions is that you have two or more states between which you want to apply the transition. Once you have the states defined, you next create the transitions you want to use.

You can create transitions using MXML or ActionScript. First we’ll look at how to create transitions using MXML. Then we’ll look at how to accomplish the same thing using ActionScript.

Creating Transitions with MXML

As shown in Chapter 12, all applications and components have a states property that you can use to define all the states they use. Likewise, all applications and components have a transitions property that is an array of all the transitions you want to use. In MXML, you can define the transitions property value using the following code within an application or component root tag:

<mx:transitions>
  <!-- All transitions appear here. -->
</mx:transitions>

All the elements of the transitions array must be Transition objects. In MXML, you create Transition instances using the Transition tag. All Transition objects must define fromState and toState properties, and these properties should be the names of the states from and to which the transition should apply. For example, the following code creates a transition from a state called A to a state called B:

<mx:Transition fromState="A" toState="B" />

If you want to use a transition for all changes to or from a particular ...