MX Iris Effect in Flex4
Posted on: June 28, 2010 at 12:00 AM
Posted on: June 28, 2010 at 12:00 AM
MX Iris Effect in Flex4:
The Iris effect provides the effect to the target by
expanding or contracting a rectangular mask centered on the target. The tag of
Iris effect is <mx:Iris>.
<mx:Iris
id="irisOn"
duration="500"
showTarget="true"
/>
In this example you can see how we can use a Iris effect With components.
Example:
|
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"xmlns:s=" library://ns.adobe.com/flex/spark"xmlns:mx=" library://ns.adobe.com/flex/mx"minWidth=" 955" minHeight="600"> <fx:Style> @namespace s "library://ns.adobe.com/flex/spark"; @namespace mx "library://ns.adobe.com/flex/mx"; s|RadioButton{ font-family: verdana; font-weight:bold; color:#000000;} </fx:Style> <fx:Declarations> <mx:Iris id="irisOn" duration="500" showTarget="true"/> <mx:Iris id="irisOff" duration="500" showTarget="false"/> <s:RadioButtonGroup id="visibility" change="init()"/> </fx:Declarations> <fx:Script><![CDATA[ public function init():void{ if(show.selected== true){roseindiaImage.visible= true;} else{roseindiaImage.visible= false;} } ]]> </fx:Script> <s:Panel title="MX Iris Effect Example"width=" 367" height="235"chromeColor=" #555555" color="#CCCCCC"> <mx:ApplicationControlBar width="364" horizontalAlign="center"> <s:RadioButton groupName="visibility" label="Show" id="show"selected=" true"/> <s:RadioButton groupName="visibility" label="Hide" id="hide"/> </mx:ApplicationControlBar> <mx:Image id="roseindiaImage"source=" @Embed(source='file:/C:/work/bikrant/image/roseindia.gif')"x=" 59" y="62"showEffect=" {irisOn}" hideEffect="{irisOff}"/> </s:Panel></s:Application> |
Output:
Running Application:
To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.
