Flash_AS3.0怎样打造出漂亮的水纹动画效果?

数码 2023-03-31 10:21:19 知道百科

  本教程[教程是某一学科的课程,主要是被用来引导用户理解相关知识或者指导用户完成特定的任务。]是向大家介绍利用Flash AS3.0打造漂亮的水纹[水纹,指水的波纹,或水波状的花纹图案。]GIF动画[动画的概念不同于一般意义上的动画片,动画是一种综合艺术,它是集合了绘画、漫画、电影、数字媒体、摄影、音乐、文学等众多艺术门类于一身的艺术表现形式。]效果[效果,英译effect; effectiveness,是由某种动因或原因所产生的结果;后果。],教程很不错,讲解的也很详细,很值得学习,喜欢的朋友可以过来学习一下!

  在这个Flash AS3.0实例教程中,将用到置换[简单的说,就是把您的爱车交给专营店,经过免费评估、双方确定旧车价格后,您只需要补齐新旧车的差价,剩下的工作都由专营店来完成。]图滤镜[滤镜;主要是用来实现图像的各种特殊效果。](DisplacementMapFilter)和BitmapData类的的杂点功能(perlinNoise),这两个家伙常常给我们带一些令人兴奋的效果,它们的合作为大家创造了一个漂亮的的水汶,看看下面的动画,应该还不错吧。

Flash_AS3.0如何打造漂亮的水纹动画效果

  现在来构建这个漂亮的水纹:

  既然是水纹,想首先要找一张含水的图片[图片是指由图形、图像等构成的平面媒体。]吧,河道,湖泊,水池,喜欢就行。

  1、新建一AS3.0文档,将帧频设为30,将图片导入到库中,点右键,在属性面板[明清家具部件名称。]中将“使用JPEG导入品质”前的钩钩去掉,这样做图片的体积就会大大地减小哦。

  2、新建一个影片剪辑元件,将图片拖到舞台[舞台是在剧院中为演员表演提供的空间,它可以使观众的注意力集中于演员的表演并获得理想的观赏效果。]上,设置图片的大小,你想设多大呢?反正我是按默认的550x400。图片在大小与文档大小一样大。点击对齐[对齐,汉语词汇,释义为使两个以上事物配合或接触得整齐。]面板,相对于舞台居中对齐。

  3、回到主场景,将MC拖到舞台上,居中放置,为它设置一个实例名称,我用的是“pic”图层上锁。

  4、新插入一图层,将图片(注意是图片不是MC),拖到舞台上,打开对齐面板,宽高匹配,居中对齐。现在第1,2层的图像是完全重合的,请确认是这样的。选择图片,点击 修改>分离,将水面部分选出,删除。可以将第1层隐藏,看看删除后的效果。

  如下图:  

  5、新建一层用来写代码[代码就是程序员用开发工具所支持的语言写出来的源文件,是一组由字符、符号或信号码元以离散形式表示信息的明确的规则体系。],打开动作面板,输入下列代码:

  复制代码

  代码如下:

  1. var bmp:BitmapData = new BitmapData(550,400);

  2. var zh:DisplacementMapFilter = new DisplacementMapFilter(bmp,new Point(0,0),1,2,10,600);

  3. var p1:Point = new Point();

  4. var p2:Point = new Point();

  5. var zdxg:Array = [p1,p2];

  6. addEventListener(Event.ENTER_FRAME ,ld);

  7. function ld(e:Event):void {

  8. zdxg[0].x += 0.2;

  9. zdxg[1].y += 0.1;

  10. bmp.perlinNoise(168,5,2,4,true,true,2,true,zdxg);

  11. pic.filters = [zh];

  12. }

  OK,测试影片,一个漂亮的水汶效果立即出现在你的眼前。

  代码分析:

  首先声明了一个与图片一样大的BitmapData类实例bmp,用来作为置换图滤镜的参数。

  var bmp:BitmapData = new BitmapData(550,400);

  然后声明一个置换图滤镜zh,将bmp作为参数。

  var zh:DisplacementMapFilter = new DisplacementMapFilter(bmp,new Point(0,0),1,2,10,600);

  接下来声明了两个点,并将这两个点放到到一个叫zdxg的数组中,这个数组将用于bmp产生杂点的参数。

  var p1:Point = new Point();

  var p2:Point = new Point();

  var zdxg:Array = [p1,p2];

  然后,在ENTER_FRAME事件中调用ld函数。

  addEventListener(Event.ENTER_FRAME ,ld);

  ld函数,动态改变两个点的位置,然后使bmp应用杂点功能,在每一帧的间隔产生不同的杂点效果,使置换滤镜效果产生变化,最后让影片剪辑pic,应用滤镜,实现水汶效果。

  function ld(e:Event):void {

  zdxg[0].x += 0.2;

  zdxg[1].y += 0.1;

  bmp.perlinNoise(168,5,2,4,true,true,2,true,zdxg);

  pic.filters = [zh];

  }

  以上就是Flash AS3.0打造漂亮的水纹GIF动画效果教程,希望大家喜欢!

相关推荐

猜你喜欢

大家正在看