粉尘螨脱敏治疗有效吗:Flash AS2入门教程第七课:影片剪辑第三节控制时间轴

来源:百度文库 编辑:中财网 时间:2024/04/28 12:36:31
Flash AS2入门教程第七课:影片剪辑第三节控制时间轴
分类:flash入门教程
Flash AS入门教程第七课:影片剪辑第三节控制时间轴
第三节 控制时间轴
MC实际上相当于一个独立的swf文件,它具有它自已的时间轴。反过来说,我们也可以把一个swf文件看成一个MC。所以本节所介绍的控制时间轴的方法同样适用于主时间轴。
在做好一个动画后,如果没有添加任何AS代码,那么动画就会按帧开始播放。本节的题目叫,控制时间轴就是由用户来控制动画的播放。为了实现这个目的,首先应叫动画不要自动播放,所以第一个语句:
stop():时间轴停止播放。
播入停止了,那么肯定就要一个让动画播放的命令:
Play() 时间轴开始播放
下面来做个练习:
新建一个flash文件,在舞台左边上画一个园,在100帧插入关键帧,将园拖到舞台右边。创建补间动画。接下来新建两个按钮,标签分别为:播放,停止。新建一层,将两按钮拖入舞台,打开属性面板,将播放按钮实例命名为:ply_btn,停止按钮实例命名为stop_btn.
新插入一层,命名为:action.打开动作面板,输入:
stop();这样运行时,时间轴将停在第一帧,不播放。
接下来是点击播放按钮的动作:
ply_btn.onRelease = function(){
play();
}
点击停止按钮上的动作:
stop_btn. onRelease = function(){
stop();
}
测试影片,园停在那儿不动,点击播放,园开始运动,点击停止,园停止运动。
这样我们就实现了控制动画播放的功能。
上面是控制主时间轴的播放,那么要控制MC的播放怎做呢?现在新建一个mc,按上面的方法做一个补间动画,在MC的第一帧输入:stop();将MC拖入舞台,在属性面板中实例命名为:mymc_mc.
在主时间轴的第一帧,输入:
ply_btn.onRelease = function(){
mymc_mc.play();
}
stop_btn. onRelease = function(){
mymc_mc.stop();
}
测试影片,那么我们就已能控制MC的播放了。
接下来,进行更进一步的控制。
gotoAndPlay(n):将时间轴转到n所在的帧处,开始始播放。
比如:gotoAndPlay(5); 从第5帧开始播放。
gotoAndStop(n):将时间轴转到n所在的帧处并停止。
比如:gotoAndStop(5);跳到第5帧并停止。
nextFrame()方法:将时间轴移到下一帧并停止。
比如:MC的控制:mymc_mc.nextFrame();
主时间轴的控制:this.nextFrame();
prevFrame()方法:将时间轴移到上一帧并停止。
用法同nextFrame()。
停止与暂停按钮:
stop()命令使时间轴停止播放,但它是停在当前帧处,很显然,这是暂停的效果,当我们再次点击播放按钮时,时间轴从当前开始播放。所以在暂停按钮上的命令是:stop();停止的效果是回到第1帧,所以在停止按钮上的命令是:gotoAndStop(1);
控制影片的播放,应该有快进快退的功能才算完整,要快进快退,那就应该要知道现在时间轴在什么位置,然后,在当前的位置加上或减去一个帧数,比如5帧或10帧来实现。
_currentframe属性:播放头当前在时间轴中的位置。有了这个属性就可实现快进快退的效果了。
练习:在上面的练习中增加两个按钮,标签分别为:快进,快退,将其拖入舞台,实例名称分别为:kj_btn,kt_btn.在actin图层的帧动作面板中,添加如下代码:
kj_btn.onRelease = function(){
gotoAndPlay( _currentframe+5);
}
kt_btn. onRelease = function(){
gotoAndPlay(_currentframe-5);
}
测试影片,现在点快进,则播放头则向前5帧,开始播放。点快退播放头则向后退5帧开始播放。
可能我们还想整得更完美点,在播放时能够有一个播放进度条才好。分析一下,当前帧现在已有了,如果能有一个动画的总帧数,不就行了,是的有总帧数这个属性的。
_totalframes属性:MC的总的帧数。
用当前帧去除以总的帧数,这不就是MC的播放进度吗。然后用一个矩形条来显示进度,采用矩形条有_xscal属性等于当前帧与总帧数的比例来实现。
播放进度条的制作:
练习:接到上面的,插入新的MC,画一细的矩形长条,垂直居中,左对齐。回到主场景,将MC拖入放好,取实例名为bft_mc.打开action层帧动作面板,找到
ply_btn.onRelease = function(){
play();
}
在play()下面插入:
onEnterFrame = function() {
if(_currentframe<_totalframes){
bl = Math.round(_currentframe/_totalframes*100);
bft_mc._xscale=bl;
} else {
delete onEnterFrame //删除每一帧的调用
}
}
测试影片,点击播放按钮时,动画开始播放,同时有一进度条随同展开。
加载进度条的制作:
一些稍大一点的动画,打开比较慢,尤其是在网络上更是如此。有人建议,你的动画如果超过100k,要把它放到网络上,最好做一个加载进度条。加载进度条的制作与播放进度条的制作原理差不多,只是获取的是加载的字节数而不是播放的帧数。先看看MC的两个方法:
getBytesLoaded()方法:返回已加载的字节数。
getBytesTotal()方法:返回动画的总的字节数。注意与上面的_totalframes属性相区别,_totalframes属性是动画的总的帧数,getBytesTotal()方法:返回的是动画的总的字节数。
了解了这两个方法后,制作就与播放进度条一样了。加载进度条常常会放到新的场景中,接上面的练习,点击 窗口>其它面板>场景打开场景面板,点右下角的加号,新增一个场景,并将这个场景拖到原场景1之上。回到场景2,新建一静态文本,内容为:“正在加载请稍候……”,在它下面放一个动态文本,实例名称为:load_txt.新建一影片剪辑元件,画一个细长的矩形,左对齐。回到场景2,将元件拖入放到动态文本下面。实例名称为:load_mc.新插入一层,打开帧动作面板,输入:
load_mc._xscale = 0;
onEnterFrame = function() {
if(getBytesLoaded()loadjd = Math.round(getBytesLoaded()/getBytesTotal()*100);
load_mc._xscale = loadjd;
load_txt.text = loadjd +"%";
} else {
delete onEnterFrame;
}
}
点击舞台上的场景按钮,点场景1,这回到了场景1,在action的第100帧(最后一帧)插入关键帧,打开动作面板,输入:
gotoAndStop(1);
为什么要加这句?因为在场景1的前面,我们放了一个加载条的场景,当场景1 播放完后,播放头将回到加载场景,而这时动画已加载,是不需要再播放加载场景的。所以用这一句将播放头回到场景1的第一帧,从而避开了加载场景。
测试影片,结果直接进入了场景1,没看到加载进度条。为什么呢?这是因为在本地影片加载速度太快,没法显示加载进度。没关系,不要关闭flash player,点 视图>下载设置,因为我们的动画太简单,所以选最上面的速度最慢的那个14.4k.这样这可模似在网上加载动画。点 视图>模似下载,怎么样看到了加载进度条了吧。
作业:制作下面的播放器
Flash AS教程:用动态遮罩实现液化效果
浏览:4 | 发布于:2009.02.11 | 分类:flash入门教程
Flash AS教程:用动态遮罩实现液化效果
先看效果:将鼠标在图片上移动看看效果。
制作方法:
1. 新建flash文档,将帧频调到31.导入一张图片。
2. 新建一影片剪辑,将图片拖入。然后回到主场景,将该MC放到舞台上,居中对齐。打开属性面板实例名称设为:pic_mc.
3. 新建一影片剪辑,用椭园工具画一个无笔触任一填充的园,这个园应该覆盖图片的大部分。
回到主场景,新建一层,将库中的园元件拖上舞台。打开属性面板,实例名称为:mask_mc.将这一层拖到图片层的下面。
4. 新建一层,取名为action,输入下列代码:
this.createEmptyMovieClip("theScene", this.getNextHighestDepth());
var maxImages:Number = 20;
dupeAndPlace = function (image:MovieClip):O**ect {
var arrHolder:O**ect = new O**ect();
arrHolder.pics_arr = new Array(0);
arrHolder.masks_arr = new Array(0);
for (var i = 1; ivar dnm = "image" + i;
var mnm = "mask" + i;
var imgO** = {_x:image._x, _y:image._y, _xscale:100+(i*1.7), _yscale:100+(i*1.7)};
var maskO** = {_xscale:Math.floor(100/i+3), _yscale:Math.floor(100/i+3), _x:this._xmouse, _y:this._ymouse};
var theDupedImage = image.duplicateMovieClip(dnm, theScene.getDepth()+ i, imgO**);
var theDupedMask = mask_mc.duplicateMovieClip(mnm, theScene.getDepth()+(i*50), maskO**);
theDupedImage.setMask(theDupedMask);
arrHolder.pics_arr.push(theDupedImage);
arrHolder.masks_arr.push(theDupedMask);
}
mask_mc._visible = false;
return arrHolder;
};
makeWaves = function (masks_arr:Array) {
for (var i = masks_arr.length; i>0; i--) {
masks_arr[i]._x += (this._xmouse-masks_arr[i]._x)/maxImages*i;
masks_arr[i]._y += (this._ymouse-masks_arr[i]._y)/maxImages*i;
}
};
this.liquefyImage = function(theImage:MovieClip){
var arrHolder:O**ect = dupeAndPlace(theImage);
onEnterFrame = function(){
makeWaves(arrHolder.masks_arr);
}
}
pic_mc.onRollOver = function(){
liquefyImage(pic_mc);
}
OK,大功告成!
测试影片。
Flash翻译教程:打造模糊的照片透明遮罩效果
浏览:4 | 发布于:2009.02.11 | 分类:flash入门教程
Flash翻译教程:打造模糊的照片透明遮罩效果
效果演示:(用鼠标移动观看效果)
译者前言:翻译这篇教程,第一个词就把我弄晕了,Cameron Dias 是什么呢?查了半天没查出结果。好象是一个歌星的名字?卡梅隆迪亚斯你听过吗?我不知道,不过把这个词理解为一个人名,那似乎还通顺,没办法,半灌水的E 文水平你就将就着看吧。下面的制作方法是没问题的哈。
进入这个flash教程,我们将创建一个大的遮罩效果并将它运用于一张卡梅隆迪亚斯照片,如下面的效果所示:
现在开始,导入一张卡梅隆迪亚斯照片到舞台,现在在这一层上新建一层,复制一张象这一层一样的卡梅隆迪亚斯照片。
选择最下面一层,(注:原文为:With the top layer selected,选择最上面一层,这似乎不对,所以我用了选择最下成一层。译者注)。选择卡梅隆迪亚斯照片并将它转换为MC并打开滤镜面板板,如下图所示设置。


现在在我们已经创建的另两层之上,新建一层。在这一层上画一个大的黑色的园并将它转换为MC,为它取一个实例名称,我给它取的名称是:"mouse_mask".
译者注:原教程中似乎漏掉了点什么,下面这一步为译者添加的步骤:
在这一层上,点右键点遮罩层,将这一层设为遮罩层。
现在我们只需要输入几行AS代码,复制并粘帖这些代码到主舞台的动作面板:
Mouse.hide();
addEventListener(Event.ENTER_FRAME, enterFrameHandler);
function enterFrameHandler(event:Event):void {
mouse_mask.x = mouseX;
mouse_mask.y = mouseY;
}