当前位置: 首页 > 图文教程 > Flash动画 > ActionScript > AS 3.0的TransitionManager类制作动画

ActionScript
将FlashVars写在JS函数中,实现变量更新与后台同步
Flash与Flex3结合学习心得体会
Flash AS简单制作画线条动画
Flash教程:如何把库中的元件加载到场景中
Flash AS3运行错误参考文档
Flash AS3制作自由落体运动代码解析
多层级加载相对路径遇到的问题解决方法
加载PNG后其透明区域不响应事件
AS3教程:按顺序播放多个FLV视频
Flash AS与JS的互动
Flash AS实例:智力过河小游戏源代码
Flash as教程:图片模糊运动
Flash AS3实例教程:物体运动速度向量(velocity)
Flash AS3.0教程:学习帧循环的运用
Flash AS3动态改变影片剪辑元件颜色
Flash AS 制作创意的鼠标经过的网页导航
Flash AS实例教程 会眨眼的美女
Flash AS2实例 跳动的小球动画效果
Flash AS3实例:制作好看的七彩小球动画
AS2.0高级滤镜效果如何用在JPG图片上

ActionScript 中的 AS 3.0的TransitionManager类制作动画


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-03-20   浏览: 151 ::
收藏到网摘: n/a

这个教程将学习如何运用 AS 3.0的 TransitionManager类制作动画

演示:


TransitionManager 类让你应用不同的动画效果到影片剪辑。整体来说,有十个不同的动画可以用。这些是:遮帘过渡、淡化过渡、飞行过渡、光圈过渡、相片过渡, 像素溶解过渡,挤压过渡、旋转过渡、划入/划出和缩放过渡。

1、新Flash文件,设置宽、高为:700 × 400 ,背景颜色任意。

2、导入一张 100 × 100的图片到舞台。

3、右键单击图片,转换成影片剪辑。命名为 " box " 设定注册点到中心。图1:
sshot-1.png
4、选中box,按住Ctrl键拖动进行复制操作,复制出10个影片剪辑。图2:
sshot-2.png
5、在属性面板中分别为实例命名 “box1″, “box2″, box3″, … , “box10″。图3:
sshot-3.png
6、新建as层,选中第1帧,打开动作面板,输入代码:


//We need for the animations

import fl.transitions.*;

import fl.transitions.easing.*;



//This array will store all the transitions

var transitions:Array = new Array();



//Add MOUSE_OVER handlers to each box

box1.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);

box2.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);

box3.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);

box4.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);

box5.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);

box6.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);

box7.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);

box8.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);

box9.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);

box10.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);



//Assign a different transition to each box

box1.transition = Blinds;

box2.transition = Fade;

box3.transition = Fly;

box4.transition = Iris;

box5.transition = Photo;

box6.transition = Rotate;

box7.transition = Squeeze;

box8.transition = Wipe;

box9.transition = PixelDissolve;

box10.transition = Zoom;



//This function is called everytime the mouse moves over a box

function mouseOverBox (e:Event):void {



        //Store the selected box in a local variable

        var selectedBox:MovieClip = MovieClip(e.target);



        //Remove the event listener (the user can’t stop the animation once started)

        selectedBox.removeEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);



        /* 

        Start a new transition with the following parametes

        type: We use a transition type that is defined for each box

        direction: The direction of the animation (Transition.OUT is the second option)

        duration: Duration of the animation in seconds

        easing: The type of easing applied to the animation

        shape: A mask shape. Applies only when using the "Iris" transition

        */

        var myTransitionManager:TransitionManager = new TransitionManager(selectedBox);

        myTransitionManager.startTransition ({type:selectedBox.transition, 

         direction:Transition.IN, duration:1, easing:Regular.easeOut, shape:Iris.CIRCLE});



        //Add the transition to an array, so it won’t get garbage collected

        transitions.push(myTransitionManager);



        //Add a listener that calls the function animationComplete, when the animation is finished

        myTransitionManager.addEventListener ("allTransitionsInDone", animationComplete);



}



//This function is called when a box animation is complete

function animationComplete (e:Event):void {



        //Start listening for the MOUSE_OVER again

        e.target.content.addEventListener (MouseEvent.MOUSE_OVER, mouseOverBox);

}
7、好了,测试你的影片吧!

附件下载:TransitionManager类实例.rar