<?xml version=”1.0″ encoding=”utf-8″?> <mx:Application xmlns:mx=” http://www.adobe.com/2006/mxml ” layout=”vertical” creationComplete=”creationCompleteHandler()”> <mx:Script> <![CDATA[ // we need to import these modules to be able to create our own effects import mx.effects.Glow; import mx.effects.Fade; import mx.effects.Parallel;
import mx.controls.Button; import mx.containers.Canvas; private var myCanvas:Canvas = new Canvas(); private var myButton:Button = new Button(); private var myParallel:Parallel = new Parallel(myCanvas); private var myVisible:Boolean = true;
// we play the parallel effect when the user clicks the button private function buttonHandler(event:MouseEvent):void { if (myVisible) { // play the effect in reverse, hiding the canvas in the process myParallel.play(null, true); myVisible = false; } else { // play the effect normaly, making the canvas appear with our Fade and Glow effects applied myParallel.play(); myVisible = true; } }
private function creationCompleteHandler():void { // define properties for our Canvas myCanvas.setStyle(”backgroundColor”, 0×000000); myCanvas.width = 250; myCanvas.height = 250; // define properties for our Button and its click event handler myButton.label = “Hide/Show”; myButton.addEventListener(MouseEvent.CLICK, buttonHandler);
// define our Fade effect var myFade:Fade = new Fade(); myFade.alphaFrom = 0; myFade.alphaTo = 1; myFade.duration = 1000;
// define our Glow effect var myGlow:Glow = new Glow(); myGlow.alphaFrom = 1; myGlow.alphaTo = 0; myGlow.blurXFrom = 0; myGlow.blurXTo = 150; myGlow.blurYFrom = 0; myGlow.blurYTo = 150; myGlow.color = 0×000000;
// add our Fade and Glow effects to our Parallel object myParallel.addChild(myFade); myParallel.addChild(myGlow);
// add our Canvas and Button objects to the main application this.addChild(myCanvas); this.addChild(myButton); } ]]> </mx:Script> </mx:Application>
|