topical media & game development

talk show tell print

professional-flex-code-08-AdvancedTransitions.mx

professional-flex-code-08-AdvancedTransitions.mx [swf] flex


  <?xml version="1.0"?>
  <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
          width="400" height="400" layout="absolute"
          verticalScrollPolicy="off" horizontalScrollPolicy="off"
          backgroundColor="#FFFFFF">
          <mx:transitions>
      <mx:Transition fromState="*" toState="*">
        <mx:Sequence targets="{[panel1,panel2,panel3]}">
          <mx:Move duration="400"/>
          <mx:Rotate angleFrom="0" angleTo="360" filter="move" />
          <mx:Resize duration="400"/>
        </mx:Sequence>
      </mx:Transition>
    </mx:transitions>
    <mx:states>
      <mx:State name="s1">
        <mx:SetProperty target="{panel1}" name="x" value="5"/>
        <mx:SetProperty target="{panel1}" name="y" value="60"/>
        <mx:SetProperty target="{panel1}" name="height" value="300"/>
        <mx:SetProperty target="{panel1}" name="width" value="390"/>
        <mx:SetProperty target="{panel2}" name="x" value="135"/>
        <mx:SetProperty target="{panel2}" name="y" value="10"/>
        <mx:SetProperty target="{panel2}" name="height" value="30"/>
        <mx:SetProperty target="{panel2}" name="width" value="125"/>
        <mx:SetProperty target="{panel3}" name="x" value="270"/>
        <mx:SetProperty target="{panel3}" name="y" value="10"/>
        <mx:SetProperty target="{panel3}" name="height" value="30"/>
        <mx:SetProperty target="{panel3}" name="width" value="125"/>
      </mx:State>
      <mx:State name="s2">
        <mx:SetProperty target="{panel1}" name="x" value="5"/>
        <mx:SetProperty target="{panel1}" name="y" value="10"/>
        <mx:SetProperty target="{panel1}" name="height" value="30"/>
        <mx:SetProperty target="{panel1}" name="width" value="125"/>
        <mx:SetProperty target="{panel2}" name="width" value="390"/>
        <mx:SetProperty target="{panel2}" name="height" value="300"/>
        <mx:SetProperty target="{panel2}" name="x" value="5"/>
        <mx:SetProperty target="{panel2}" name="y" value="60"/>
        <mx:SetProperty target="{panel3}" name="x" value="270"/>
        <mx:SetProperty target="{panel3}" name="y" value="10"/>
        <mx:SetProperty target="{panel3}" name="height" value="30"/>
        <mx:SetProperty target="{panel3}" name="width" value="125"/>
      </mx:State>
      <mx:State name="s3">
        <mx:SetProperty target="{panel1}" name="x" value="5"/>
        <mx:SetProperty target="{panel1}" name="y" value="10"/>
        <mx:SetProperty target="{panel1}" name="height" value="30"/>
        <mx:SetProperty target="{panel1}" name="width" value="125"/>
        <mx:SetProperty target="{panel2}" name="x" value="135"/>
        <mx:SetProperty target="{panel2}" name="y" value="10"/>
        <mx:SetProperty target="{panel2}" name="height" value="30"/>
        <mx:SetProperty target="{panel2}" name="width" value="125"/>
        <mx:SetProperty target="{panel3}" name="width" value="390"/>
        <mx:SetProperty target="{panel3}" name="height" value="300"/>
        <mx:SetProperty target="{panel3}" name="x" value="5"/>
        <mx:SetProperty target="{panel3}" name="y" value="60"/>
      </mx:State>
    </mx:states>
    <mx:Panel x="5" y="10" width="125" height="30" layout="absolute" title="Panel 1" id="panel1" click="this.currentState='s1'"/>
    <mx:Panel x="135" y="10" width="125" height="30" layout="absolute" title="Panel 2" id="panel2" click="this.currentState='s2'"/>
    <mx:Panel x="270" y="10" width="125" height="30" layout="absolute" id="panel3" title="Panel 3" click="this.currentState='s3'"/>
    <mx:Button x="167" y="368" label="Reset" click="this.currentState=''"/>
  </mx:Application>
  
  


(C) Æliens 04/09/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.