Define transitions for this example in MXML using the tag

Define transitions for this example in MXML using the <mx:transitions> tag

         

<?xml version="1.0" ?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="400">
  <mx:states>
    <mx:State name="One">
      <mx:SetProperty target="{p1}" name="x" value="110" />
      <mx:SetProperty target="{p1}" name="y" value="0" />
      <mx:SetProperty target="{p1}" name="width" value="200" />
      <mx:SetProperty target="{p1}" name="height" value="210" />
      <mx:SetProperty target="{p2}" name="x" value="0" />
      <mx:SetProperty target="{p2}" name="y" value="0" />
      <mx:SetProperty target="{p2}" name="width" value="100" />
      <mx:SetProperty target="{p2}" name="height" value="100" />
    </mx:State>
  </mx:states>
  <mx:transitions>
    <mx:Transition id="myTransition" fromState="*" toState="*">
      <mx:Parallel id="t1" targets="{[p1,p2]}">
        <mx:Move duration="400" />
        <mx:Resize duration="400" />
      </mx:Parallel>
    </mx:Transition>
  </mx:transitions>
  <mx:Canvas id="pm" width="100%" height="100%">
    <mx:Panel id="p1" title="One" x="0" y="0" width="100" height="100" click="currentState='One'">
      <mx:Label fontSize="24" text="One" />
    </mx:Panel>
    <mx:Panel id="p2" title="Two" x="0" y="110" width="100" height="100" click="currentState='Two'">
      <mx:Label fontSize="24" text="Two" />
    </mx:Panel>
  </mx:Canvas>
</mx:Application>

1.	Wrap Parallel, fade and move with Transition
2.	Use Transition to add and remove controls dynamically
3.	Set control to invisible during transition
4.	Using a filter in Transition
5.	Advanced Transitions: Move, Rotate, Resize
6.	Transitions with tag
7.	Transition With Blurs
8.	Action Transitions
9.	Custom AnimateTransitionShader Transform
10.	Using a filter
11.	Defining a custom filter
12.	Change button position and fade button

Define transitions for this example in MXML using the tag : Transition « Effects « Flex

Related examples in the same category