Flex 效果_蹦蹦跳跳的面板

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">     
  <mx:Style>        
   Application{            backgroundGradientColors: #E2DEDE, #3C2580;         }       
   LinkButton {            rollOverColor: #000000;            selectionColor: #000000;          
    color: #ffffff;            textRollOverColor: #ffffff;            textAlign: center;         }   
  </mx:Style>        
 <mx:Script>       
  <![CDATA[            
   import mx.effects.easing.*;                        
   private function toggleBtn(e:MouseEvent):void{             
    if(e.currentTarget.label== "Open")                    
     panelOut.play();   
    else                     panelIn.play();   
   }         ]]> 
 </mx:Script>        
 <mx:Move id="panelOut" target="{panel}" yTo="0" effectEnd="btn.label='Close'"         duration="1500" easingFunction="Bounce.easeOut"/>       
 <mx:Move id="panelIn" target="{panel}" yTo="-180" effectEnd="btn.label='Open'"         duration="1000" easingFunction="Bounce.easeIn"/>          
 <mx:Canvas id="panel" width="100%" height="200" y="-180" backgroundColor="#000000">     <!--Add the content of your sliding panel here  --> 
  <mx:Label text="PUT YOUR CONTENT HERE" fontSize="30" color="#ffffff" horizontalCenter="0" verticalCenter="0"/>  
  <mx:LinkButton id="btn" width="100%"  height="21"               bottom="0" horizontalCenter="0"             label="Open"               click="toggleBtn(event)"/> 
 </mx:Canvas>          <!--Add the content of your page here  -->  
</mx:Application>

你可能感兴趣的:(function,Flex,layout,application,import,encoding)