发新话题
打印

关于TranstionManager类和Tween类的应用(原创)

关于TranstionManager类和Tween类的应用(原创)

关于tween类和transtionManager类可以在flash安装目录下\zh_cn\First Run\Classes\mx\transtions的文件夹里找到,在没有用这俩类之前大家做一些比较好看的效果要么制作起来很复杂,要么就要编写复杂的代码,其实flash 的这俩个类就可以完成,先看一个例子再说,代码如下,其实就是主场景命名函数,然后按不同的按钮调用不同的函数,
import mx.transitions.*;
import mx.transitions.easing.*;
//先引入这俩个类包
function myBlind(mc){
        TransitionManager.start(mc, {type:Blinds, direction:Transition.IN, duration:2, easing:None.easeNone, numStrips:15, dimension:1});
}
//direction后面的参数可以是IN或者是OUT,其实它的意义从字面上也可以看出,是出和入的意思,duration是该效果持续的时间,numStrip是条的多少,dimension只有俩个参数0和1分别表示横和竖的意思,easing 后面的参数大家可以在easing的包里找到,总共有六个Back,Bounce,Elastic,Strong,None,Regular,这几个大家可以查字典就可以知道它的意思,其实你看了它的效果也可以猜出来,这六个参数又可以有easeIn,easeOUT,easeINOUT,easeNone几个参数它的意思也可以在字面里可以看出,就是在进场时,出场时,进出场时显示这些效果
function myFade(mc){
        TransitionManager.start(mc, {type:Fade, direction:Transition.IN, duration:3, easing:None.easeNone});
}
function myFly(mc){
        TransitionManager.start(mc, {type:Fly, direction:Transition.IN, duration:3, easing:Elastic.easeOut, startPoint:2});
}
//startPoint后面的参数大家可以换10以内不同的数字,图片将以不同的位置飞入场景
function myEris(mc){
        TransitionManager.start(mc, {type:Iris, direction:Transition.IN, duration:2, easing:Strong.easeIn, startPoint:5, shape:Iris.CIRCLE});
}
function myPhoto(mc){
        TransitionManager.start (mc, {type:Photo, direction:Transition.IN, duration:1, easing:None.easeNone});
}
function myPixelDissolove(mc){
        TransitionManager.start(mc, {type:PixelDissolve, direction:Transition.IN, duration:2, easing:None.easeNone, xSections:20, ySections:20});
}
//xSections和ySections后面的参数分别表示x方向和y方向分割的小方块
function myRotate(mc){
        TransitionManager.start(mc, {type:Rotate, direction:Transition.IN, duration:3, easing:Strong.easeInOut, ccw:false, degrees:720});
}
//ccw后面的参数true和false表示顺时针和逆时针
function mySqueeze(mc){
        TransitionManager.start(mc, {type:Squeeze, direction:Transition.IN, duration:2, easing:Elastic.easeOut, dimension:0});
       
}
//dimension的参数也是横着还是竖着挤压
function myWipe(mc){
        TransitionManager.start(mc, {type:Wipe, direction:Transition.IN, duration:2, easing:None.easeNone, startPoint:1});
}
function myZoom(mc){
        TransitionManager.start(mc, {type:Zoom, direction:Transition.IN, duration:1, easing:Elastic.easeOut});
}
       

       
       
                                                       
       


[ 本帖最后由 tiger_0309 于 2006-10-12 14:03 编辑 ]

附件

tween.fla (166 KB)

2006-10-12 14:00, 下载次数: 292

tween.swf (109.62 KB)

2006-10-12 14:00, 下载次数: 289

TOP

上面主要讲的是TranstionManager类的应用并且结合tween类,单独应用tween类也可以做一些很酷的效果,先看一个例子
代码加在主场景第一帧
import mx.transitions.Tween;
import mx.transitions.easing.*;
//输入这俩个类和一个类包
var xScaleT:Tween = new Tween(hello, "_rotation", Elastic.easeInOut, 0, 360, 3, true);
var xPosT:Tween = new Tween(hello, "_x", Bounce.easeOut, 0, Stage.width, 3, true);
//tween后面的参数(object,"property",ease class and method,begin,end,duration,usesecond),object是实例名,property可以是_rotation,_y,_x,_alpha,_xscaxle,_yscxale,ease class and method和上面讲的一样总共有六个Back,Bounce,Elastic,Strong,None,Regular参数,这六个参数又可以有easeIn,easeOUT,easeINOUT三个参数,begin和end分别表示开始和结束的参数,如果是_y,_x那么就是坐标,duration表示持续时间,usesecond是布尔值,true或者false分别表示用秒或者帧来表示时间
xScaleT.onMotionFinished = function() {
this.yoyo();
};
//onMotionFinished的意思就是在第一次动作完成后再干什么,在这里调用了一个yoyo的函数,顾名思意就是咱们玩的哪个玩具yoyo,循环的意思
xPosT.onMotionFinished = function() {
this.continueTo(Stage.width / 2, 3);
};
continueTo函数有俩个参数continueTo(finish:Number, duration:Number)其中finish后面的参数是动作完了以后该动作
保持的参数,如上如果是用_x,那么tage.width / 2就是坐标,以此类推


[ 本帖最后由 tiger_0309 于 2006-10-13 17:33 编辑 ]

附件

example1.fla (23.5 KB)

2006-10-12 14:06, 下载次数: 150

example1.swf (3.62 KB)

2006-10-12 14:06, 下载次数: 171

TOP

再看一个例子,在主场景画一个圆,转化为影片剪辑的元件,实例名为ball,然后在主场景的地一帧加如以下代码;
import mx.transitions.Tween;
import mx.transitions.easing.*;
var w = ball._width;
var ball_tween:Tween = new Tween(ball, "_x", Elastic.easeInOut, 0, (Stage.width-w), 3, true);
ball_tween.onMotionFinished = function() {
        ball_tween.yoyo();
};

附件

example7.fla (22.5 KB)

2006-10-12 14:09, 下载次数: 149

example7.swf (2.68 KB)

2006-10-12 14:09, 下载次数: 165

TOP

应用到组件上。拖一个ComboBox的组件到主场景,实例名为cb,然后在主场景的地一帧加如以下代码;
import mx.transitions.easing.*;
cb.dataProvider = TextField.getFontList(); 文本
//在ComboBox里显示的是字体,你也可以在data里输入你想要的文本
cb.setStyle("openEasing", Elastic.easeOut);
//在打开时用到的Easing类以及参数
cb.setStyle("openDuration", 2000);
//持续时间,单位是毫秒,就是俩秒
cb.setStyle("selectionEasing", Elastic.easeOut);
//选择时用到的Easing类以及参数
cb.setStyle("selectionDuration", 2000);
//持续时间

附件

example3.fla (654 KB)

2006-10-12 14:11, 下载次数: 832

example3.swf (56.19 KB)

2006-10-12 14:11, 下载次数: 134

TOP

结合滤镜的例子,代码如下;
import mx.transitions.Tween;
import mx.transitions.easing.*;
import flash.filters.GlowFilter;
//输入滤镜的包
var gf:GlowFilter = new GlowFilter(0x356D83, 100, 5, 5, 5, 3, false, false);
var gfBX:Tween = new Tween(gf, "blurX", Elastic.flasheaseOut, 5, 5, 1, true);
var gfBY:Tween = new Tween(gf, "blurY", Elastic.easeOut, 5, 5, 1, true);
//至于如何应用滤镜类和如何调整参数,大家可以去看flash的帮助
love.onRollOver = function() {
gfBX.continueTo(20, 2);
gfBY.continueTo(20, 2);
};
love.onRollOut = function() {
gfBX.continueTo(5, 2);
gfBY.continueTo(5, 2);
};
gfBX.onMotionChanged = function() {
love.filters = [gf];
};

附件

example4.fla (44 KB)

2006-10-12 14:13, 下载次数: 145

example4.swf (3.12 KB)

2006-10-12 14:13, 下载次数: 140

TOP

在写这个东西前也不知道有没有人写过,我是看了flash帮助后又结合了我在国外看到的几个例子写的,不管怎么样先写出来再说,希望能做到抛砖引玉,让高手能继续扩展和发挥,写的不好之处还请多多指教

TOP

这个教程有份量!顶!

TOP

美女说了顶我也顶

TOP

顶顶

TOP

顶上去,好教程

TOP

研究了一翻!决定再顶!

TOP

ding  即使看不懂

TOP

美女说顶我也顶
<!----------------我一脚踏进棺材,而你却离我很近!------------------>

TOP

顶上去

TOP

非常酷的效果,那个字体改一下吧,看着比较乱

要就大点,要就不要粗体

TOP

嘿嘿,跟着楼主学了满多多东西了,从3d开始到tween

TOP

顶了.都不错.谢谢楼主.

TOP

good

good,非常好,我喜欢

TOP

very good,

TOP

解說非常詳盡,真是太感謝你囉。

TOP

先顶了

TOP

我说顶,美女也顶了~~

TOP

漂亮,顶一下!!

TOP

强烈支持贵论坛的发展!

TOP

强烈支持贵论坛的发展!

TOP

thank you

TOP

发新话题