Flex 特效一部分 转

1：glow(发光)

代码：

<mx:Glow id="glow" duration="1000"

        alphaFrom="0.6" alphaTo="0.2"

        blurXFrom="0.0" blurXTo="50.0"

        blurYFrom="0.0" blurYTo="50.0"

        color="0xffffff"/>

 

duratuion 是特效的时间 1000 毫秒

alphaFrom 是透明度从 0.6 开始

alphaTo 是透明度到 0.2

blurXFrom 是X放向的模糊开始位置(相对于控件的)

blurXTo 是X放向的模糊结束位置(相对于控件的)

blurYFrom 是Y放向的模糊开始位置(相对于控件的)

blurYTo 是Y放向的模糊结束位置(相对于控件的)

color 是发光的颜色

 

作用到控件：

<mx:Image source="../assets/zh_cn_msdn_T_20070606.png" rollOverEffect="{glow}" id="back"/>

 

rollOverEffect 是鼠标经过时触发。

 

效果图参看：

 

 

 

2：Blur(模糊)

代码：

<mx:Blur id="blurImage" duration="1000"

        blurXFrom="0.0" blurXTo="10.0"

        blurYFrom="0.0" blurYTo="10.0"/>

duratuion 是特效的时间 1000 毫秒

blurXFrom 是X放向的模糊开始位置(相对于控件的)

blurXTo 是X放向的模糊结束位置(相对于控件的)

blurYFrom 是Y放向的模糊开始位置(相对于控件的)

blurYTo 是Y放向的模糊结束位置(相对于控件的)

 

作用到控件：

<mx:Image source="../assets/zh_cn_virtual_tab1_090803.png"                    mouseDownEffect="{blurImage}"

      mouseUpEffect="{unblurImage}"

toolTip="Welcome"/>

 

mouseDownEffect 是鼠标按下时的特效。

mouseUpEffect 是鼠标松开时的特效

 

效果图参看：

 

 

3：Sequence (顺序) Bounce(弹跳)

代码：

import mx.effects.easing.*;

<mx:Sequence id="movePauseMove">

        <mx:Move yBy="-150" duration="1000" easingFunction="Bounce.easeOut"/>

        <mx:Move yBy="150" duration="1000" easingFunction="Bounce.easeIn"/>

    </mx:Sequence>

yBy 是作用在Y方向。

duratuion 是特效的时间 1000 毫秒

easingFunction 是松开动作

Bounce.easeOut 是跳出的动作

Bounce.easeIn 是跳回的动作

 

作用到控件：

<mx:Image source="../assets/zh_cn_ptn_090722.png" 

mouseDownEffect="{movePauseMove}"

id="image4"/>

 

mouseDownEffect 是鼠标按下时的特效。

 

效果参看：

 

 

4：Zoom(放大)

代码：

<mx:Zoom id="zoomAll"

zoomWidthFrom="1" zoomWidthTo="1.5"

zoomHeightFrom="1"  zoomHeightTo="1.5" />

 

zoomWidthFrom 放大的宽度从 1 倍开始

zoomWidthTo 放大的宽度到 1.5 倍

zoomHeightFrom 放大的高度从 1 倍开始

zoomHeightTo 放大的高度到 1.5 倍

 

<![CDATA[

import flash.events.MouseEvent;

           

public function doZoom(event:MouseEvent):void {

       if (zoomAll.isPlaying) {  //判断动作是否正在进行中

                    zoomAll.reverse();   //如果是就返回(如果是放大就变成缩小)

                }

                else {

   

                    zoomAll.play([event.target], event.type == MouseEvent.ROLL_OUT ? true : false);  //判断事件是否是 鼠标移出事件，如果是就为true否则的话就为false

                }

            }

           

]]>

 

作用到控件：

<mx:Image source="../assets/zh_cn_ptn_090722.png" 

      rollOver="doZoom(event)"

      rollOut="doZoom(event)"

id="image4"/>

 

rollOver：鼠标经过事件。

rollout：鼠标移出事件。

 

参看效果图：