[flexcoders] Transitions Explanation

[Neil Middleton]

Can anyone explain transistions to me as I'm currently having trouble
"getting" it.

I have the code below which is working almost exactly as I expect - except
for an issue with the appearing button control in the panel.  I would expect
this button to Fade in as the Resize finishes, but there is obviously
something I'm not quite understanding.

Cheers in advance:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; layout="absolute">

   <mx:transitions>
       <mx:Transition fromState="*" toState="*">
           <mx:Sequence>
               <mx:Resize duration="500" target="{panel1}"/>
               <mx:Fade duration="500" target="{button2}"/>
           </mx:Sequence>
       </mx:Transition>
   </mx:transitions>

   <mx:states>
       <mx:State name="bigger">
           <mx:SetStyle target="{panel1}" name="bottom" value="10"/>
           <mx:SetEventHandler target="{button1}" name="click"
handler="currentState='';"/>
           <mx:AddChild relativeTo="{controlbar1}" position="before">
               <mx:Button x="10" y="10" id="button2"/>
           </mx:AddChild>
       </mx:State>
   </mx:states>

   <mx:Panel layout="absolute" top="10" left="10" bottom="300" right="10"
title="Panel 1" id="panel1">
       <mx:ControlBar id="controlbar1">
           <mx:Button label="Click Me" click="currentState='bigger';"
id="button1"/>
       </mx:ControlBar>
   </mx:Panel>

</mx:Application>

--
Neil Middleton

Visit feed-squirrel.com