Flash制作美丽的蜻蜓飞舞效果动画

  演示效果:

点击这里下载源文件

  制作步骤:

  1.新建立一个Flash文档,修改其属性如下图所示:

  2.在主场景中把图层1改名为back,这是背景层,我们选择矩形工具绘制一个550*300的矩形正好和舞台重合,在这里要使用混色器面板,设置线性填充效果如下图:

  3.之后我们新建一个元件,画一些草,为了让动画效果更好你可以让草也动起来,在这里我制作的是一个静止的图,如下图所示:

  4.接下来我们制作蜻蜓动画,蜻蜓动画其实只是蜻蜓的四个翅膀在动,所以我的方法是先建立翅膀静止的元件,然后建立翅膀动的元件,然后组织成为一个蜻蜓电影剪辑元件.绘制过程如下:

  美化一下翅膀:

  组织成一个蜻蜓,把翅膀旋转一下就可以了!在此不详细叙述.

  继续美化蜻蜓身体:

  美化一下蜻蜓的翅膀:

  组织成一个效果较好的蜻蜓:

  5.这时我们新建立一个电影剪辑元件,命名为trans,绘制一个小的白色矩形,效果如下(注意我已经将显示比例调到了200%):

  6.回到主场景,新添加一个"草"层,然后把我们制作的草拖出来,连续拖出两次,使草看起来错综复杂,效果如下:

  7.新建立一个图层"蜻蜓",然后把蜻蜓电影剪辑从酷中拖出来,依次重复5次,打开属性面板,分别给蜻蜓命名实例名为fly1,fly2,fly3,fly4,fly5,效果如下:

  8.新建立一个图层"trans",然后把蜻蜓电影剪辑从酷中拖出来,依次重复5次,打开属性面板,分别给蜻蜓命名实例名为transp1,transp2,transp3,transp4,transp5,效果如下:

  9.新建立一个图层"action",按F9打开动作面板添加如下指令代码:

probability = 30;
scene_width = 550;
scene_height = 300;
speed = 0.03;
MovieClip.prototype.smoothMove = function (speed, targetx, targety) {
 this._x += speed*(targetx-this._x);
 this._y += speed*(targety-this._y);
};
MovieClip.prototype.rotateTo = function (targetx, targety) {
 var diffX = targetx-this._x;
 var diffY = targety-this._y;
 this._rotation = Math.atan2 (diffY, diffX)*180/Math.PI;
};
_root.transp1.onEnterFrame = function () {
 if (random (probability) == 0) {
  target1X = random (scene_width);
  target1Y = random (scene_height);
 }
 this._visible = 0;
 this.smoothMove (speed, target1X, target1Y);
};
_root.fly1.onEnterFrame = function () {
 this.smoothMove (speed, transp1._x, _root.transp1._y);
 this.rotateTo (_root.transp1._x, _root.transp1._y);
};
_root.transp2.onEnterFrame = function () {
 if (random (probability) == 0) {
  target2X = random (scene_width);
  target2Y = random (scene_height);
 }
 this._visible = 0;
 this.smoothMove (speed, target2X, target2Y);
};
_root.fly2.onEnterFrame = function () {
 this.smoothMove (speed, transp2._x, _root.transp2._y);
 this.rotateTo (_root.transp2._x, _root.transp2._y);
};
_root.transp3.onEnterFrame = function () {
 if (random (probability) == 0) {
  target3X = random (scene_width);
  target3Y = random (scene_height);
 }
 this._visible = 0;
 this.smoothMove (speed, target3X, target3Y);
};
_root.fly3.onEnterFrame = function () {
 this.smoothMove (speed, transp3._x, _root.transp3._y);
 this.rotateTo (_root.transp3._x, _root.transp3._y);
};
_root.transp4.onEnterFrame = function () {
 if (random (probability) == 0) {
  target4X = random (scene_width);
  target4Y = random (scene_height);
 }
 this._visible = 0;
 this.smoothMove (speed, target4X, target4Y);
};
_root.fly4.onEnterFrame = function () {
 this.smoothMove (speed, transp4._x, _root.transp4._y);
 this.rotateTo (_root.transp4._x, _root.transp4._y);
};
_root.transp5.onEnterFrame = function () {
 if (random (probability) == 0) {
  target5X = random (scene_width);
  target5Y = random (scene_height);
 }
 this._visible = 0;
 this.smoothMove (speed, target5X, target5Y);
};
_root.fly5.onEnterFrame = function () {
 this.smoothMove (speed, transp5._x, _root.transp5._y);
 this.rotateTo (_root.transp5._x, _root.transp5._y);
};

  10.时间轴最终效果如下图所示:

  实例讲解完成!祝你好运,有不明白的地方可以与我联系:qq:76312395

时间: 2024-09-10 04:48:05

Flash制作美丽的蜻蜓飞舞效果动画的相关文章

Flash制作的好看的图片效果动画

图片效果 看效果: 代码如下: var old:Number = 1; //记录上张显示的图片 var oldGo:Boolean; var oldpos:Number = 700; var picNum:Number = 9; //anliPath是用于加载外部图片的路径 //var anliPath:String = "works/1-"; for (i=1; i<=picNum; i++) {         btn_mc.attachMovie("btn&quo

Flash制作环绕的立体图片效果动画

立体|图片效果 效果: 点击这里下载源文件 代码如下: var totalPhotoBL:Number = 7; //图片总张数: var angleBL:Number = 2*Math.PI/(totalPhotoBL-1); //角度值,用于平均分配所有图在360度里: var scaleBL:Number = 30; //缩放比例值: var speedBL:Number = Math.PI/180; // 声明一个速度值: for (var i = 0; i<totalPhotoBL;

用flash制作纸飞机滑翔天空的gif动画效果

  这一节我们主要来学习flash动画中的动作补间动画,来制作滑翔的纸飞机动画.大家一起来欣赏学习下吧! 工具/原料 电脑 flash软件 风景图片一张 纸飞机图片一张 说明:小编使用的是flash cs6软件. 滑翔纸飞机动画制作步奏: 1.小编使用的纸飞机素材图片是从网上下载下来的,当然网上下载的纸飞机是有背景的,因此小编用Photoshop将纸飞机的背景删除了,只保留了纸飞机,所以这里可以直接引用哦! 打开flash的软件,新建一个ActionScript 3.0的画布,如下图所示: 2.

Flash技巧之如何掌握遮罩效果动画

技巧 问题1:遮罩层与被遮罩层是什么关系? 解决思路     了解遮罩层和被遮罩层的关系,对于我们掌握遮罩动画是非常关键的.遮罩动画在Flash技术里面起到了重要作用,一些非常优秀的效果就是通过遮罩动画来实现的.例如:著名的"水面涟漪"效果,就是通过遮罩完成的,非常逼真.下面我们就通过不同的制作方法了解遮罩的原理,在实践中领会遮罩的奥妙. 具体步骤      1.运行Flash MX 2004,文档属性默认.     2.单击[文件]|[导入]|[导入到舞台]命令,导入一幅位图图片,并

Flash制作彩色线条动态图案生长动画

动态 今天我们用Flash软件制作一个彩色线条动态生长图案的动画效果,希望大家会喜欢. 首先让我们来看一下最终的效果. 点击这里下载源文件 第一步:打开Flash制作软件,新建一个400*300像素的新文件,背景颜色为黑色,如下图: 第二步:点击菜单栏"插入"→"新建元件"→设置为(名称:元件1,行为:图形),点周确定,如下图: 第三步:在元件1里,用工具栏的"线条工具"画一条粗细为1个像素的小斜线,如下图: 第四步:点击菜单栏"插入&

Flash制作用键盘方向键控制的动画实例

方向|控制 今天为大家用Flash制作一个用键盘方向键控制的动画,动画的效果你可以直接点动画后,然后按键盘上的方向键可以看到效果!希望大家喜欢. 点击这里下载源文件 1.创建Flash文档,大小为250x190.然后把实现准备好的图片素材导入到舞台.然后按Ctrl+F8创建一个新的元件,类型Movie Clip ,然后添加一个层,分别命名为:images和Script,效果如下图所示: 2.然后把该MC放到舞台上,用鼠标单击,然后命名一个实例名square: 3.下面我们给影片剪辑的script

Flash制作有趣的亲嘴猪动画教程

  本教程是使用Flash制作可爱有趣的亲嘴猪动画,讲述如何用简单的绘图工具画出可爱俏皮的小猪以及制作成亲嘴动画.这个Flash实例简单易懂,这个Flash实例制作了两只可爱的小猪亲嘴的动画,用到了Flash的基本绘图工具如椭圆.矩形.直线和任意变形等,操作简单易懂,适合练习. 先看下效果吧: 制作步骤: 1.新建一个Flash文档,Ctrl+F8新建一个元件,命名为"pig".选择椭圆工具,设笔触为黑色,无填充,画出如下椭圆. 图01 2.再用矩形工具在椭圆下部画出如下矩形. 图02

Flash制作非常逼真的下雪视觉动画效果

大家好,今天教大家做一种非常逼真的下雪效果.现在开始制作. 1.打开FLASH文档,背景层为黑色,帧频为20,新建元件为图形,命名为雪花. 2.在图形元件中绘制一个雪花,如果打家自己会绘制雪花的话完全可以按照自己的爱好来绘制,如果不会请看图绘制,我是用线条工具绘制的,图上画的是步骤. 3.绘制好图2最后一步后,打开窗口变形工具栏把旋转改问60度然后点击复制并应用变形. 4.绘制好雪花以后,在图形元件中在建一个图层用椭圆工具换一个圆颜色改为放射状. 5.把圆放在雪花的中心位置. 6.新建元件,影片

Flash制作比较流行的树叶伸展动画效果

比较 最近有人问我一个树叶伸展的效果,网上现在好像也很流行.其实就是逐帧+遮罩.拿一个例子来分析一下吧!(转贴请注明作者:阿刚,谢谢!) 1:先找一个素材,就这一盆花吧.在ps里处理下,把多余的背影删掉. 2:新建层2,画一个长方形,只要能遮住花盆就行了,因为花盆是一直显示的. 3:在图层2按F6插入关键帧,每插一步就用画笔画一步,形成慢慢伸展的逐帧动画.图层1按F5保留. 4:最后右键图层2选择"遮罩"全效果完成. 看一下最终的效果吧,树叶伸展效果: