Flex中如何利用setStyle()函数，实现showEffect和hideEffect效果

 
<?xml
version="1.0"
encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

        layout="vertical"

        verticalAlign="middle"

        backgroundColor="white"

        creationComplete="init();">

 
    <mx:Script>

        <![CDATA[

            import mx.effects.easing.*;
 
            private function init():void {

                img.setStyle("showEffect", rotate);

                img.setStyle("hideEffect", fade);

            }
        ]]>
    </mx:Script>

 
    <mx:Fade id="fade"
/>
    <mx:Rotate id="rotate"

            angleFrom="-180"

            angleTo="0"

            easingFunction="Elastic.easeInOut"

            duration="2000" />

 
    <mx:ApplicationControlBar dock="true">

        <mx:Form styleName="plain">

            <mx:FormItem label="visible:">

                <mx:ToggleButtonBar id="toggleButtonBar"

                        itemClick="img.visible = event.item.data;">

                    <mx:dataProvider>

                        <mx:Array>

                            <mx:Object label="Show"
data="true"
/>
                            <mx:Object label="Hide"
data="false"
/>
                        </mx:Array>

                    </mx:dataProvider>

                </mx:ToggleButtonBar>

            </mx:FormItem>

        </mx:Form>

    </mx:ApplicationControlBar>

 
    <mx:Image id="img"

            source="@Embed('assets/flashplayer_icon.jpg')"

            width="100"

            height="100" />

 
</mx:Application>