Iris effect : Iris Effect « Effects « Flex

1. Flex
2. Effects
3. Iris Effect

Iris effect

    
<?xml version="1.0" ?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  verticalAlign="middle" layout="vertical">
  <mx:states>
    <mx:State name="OneOnly">
      <mx:SetProperty target="{p2}" name="visible" value="false" />
      <mx:SetProperty target="{p2}" name="includeInLayout" value="false" />
    </mx:State>
  </mx:states>
  <mx:transitions>
    <mx:Transition id="toOneOnly" fromState="*" toState="OneOnly">
      <mx:Sequence id="t1" targets="{[p2]}">
        <mx:Iris showTarget="false" duration="500" />
        <mx:SetPropertyAction name="visible" />
        <mx:SetPropertyAction target="{p2}" name="includeInLayout" />
      </mx:Sequence>
    </mx:Transition>
  </mx:transitions>
  <mx:Panel id="p1" title="One" width="100" height="100">
    <mx:Label text="One" />
  </mx:Panel>
  <mx:Panel id="p2" title="Two" width="100" height="100">
    <mx:Label text="Two" />
  </mx:Panel>
  <mx:Button id="b1" label="Change state" click="currentState = currentState == 'OneOnly' ? '' : 'OneOnly';" />
</mx:Application>

   
    
    
    
  

Related examples in the same category

1.	Using the Iris effect on the button
2.	Iris And Zoom