学院首页 软件应用 编程开发 创意设计 认证培训 软件论坛
Flash Fireworks Dreamweaver Photoshop CorelDraw Illustrator FreeHand 3DsMAX AutoCAD

您的位置:学院 >> 创意设计 >> Flash >> Flash动画实例:美丽蜻蜓飞舞


Flash动画实例:美丽蜻蜓飞舞


本文中我们用Flash来制作一幅蜻蜓飞舞的美丽动画。

  演示效果如下:

  制作步骤:

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

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

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

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

  美化一下翅膀:

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

  继续美化蜻蜓身体:

  美化一下蜻蜓的翅膀:

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

  • 第1页:蜻蜓绘制
  • 第2页:对象细化
  • 第3页:AS代码
  •   5.这时我们新建立一个电影剪辑元件,命名为trans,绘制一个小的白色矩形,效果如下(注意我已经将显示比例调到了200%):

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

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

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

  • 第1页:蜻蜓绘制
  • 第2页:对象细化
  • 第3页:AS代码


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

    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.时间轴最终效果如下图所示:

      实例讲解完成!原文链接

    技术文章快速查找

    栏目导航
    软件应用
    ·操作系统 ·杀毒防黑 ·应用软件
    ·聊天软件 ·网络软件  
    Web开发
    ·ASP ·JavaScript ·CGI
    ·JSP ·VbScript ·Web服务器
    ·PHP ·XML  
    开发语言
    ·VB ·VC ·ASP.NET
    ·Java ·C/C++ ·Delphi
    数据库开发
    ·MySQL ·SQL/Access ·PowerBuilder
    ·Oracle ·DB2  
    网站设计
    ·Flash ·Dreamweaver ·HTML/CSS
    ·Fireworks ·FrontPage  
    平面设计
    ·Photoshop ·CorelDraw ·AutoCAD
    ·FreeHand ·Illustrator ·3DsMAX
    媒体动画
    ·Director ·Authorware ·Maya
    ·视频处理    


    相关软件 产品库推荐
    ·笔记本 ·台式机 ·服务器
    ·数码相机 ·手机 ·GPS
    ·DV摄像机 ·MP3 ·MP4
    ·CPU ·硬盘 ·内存
    ·主板 ·显卡 ·显示器
    ·打印机 ·投影机 ·路由器

    还没人留言,抢个先,哈哈!
    对"Flash动画实例:美丽蜻蜓飞舞"的评论 - 快速回贴
    内容:
      [完成后可按Ctrl+Enter发布]

    百度中 Flash动画实例:美丽蜻蜓飞舞 相关内容
    Google搜索中 Flash动画实例:美丽蜻蜓飞舞 相关内容
    雅虎中 Flash动画实例:美丽蜻蜓飞舞 相关内容
    Sogou搜索中 Flash动画实例:美丽蜻蜓飞舞 相关内容

    相关软件 最新回复帖子:

    ·没有mysql支持时的替代方案
    ·一个可以发送附件及HTML格式邮件的PHP类
    ·AutoCAD打造精致三维鸟笼实例详解
    ·Photoshop自定义水晶字特效样式
    ·AutoCAD三维基础实例教程
    ·PS为黑背景长发美女照片抠图换背
    ·用Photoshop自制个性摩托车贴花小经验
    ·轻松几步将美女照片处理为手工素描
    ·巧用Photoshop画笔轻松绘制创意特效
    ·用Photoshop通道将模糊肖像照片清晰化


      相关软件 Flash动画实例:美丽蜻蜓飞舞相关文章
    Flash打造窗纱随风飘动的音乐动画 Flash AS动画实例:风吹云飘草动
    Flash 动画人物角色行走的几种实现方式 Flash AS代码制作鼠标触发图片缓冲放缩
    精简Flash文件体积的几个小技巧 编写Flash AS代码实现按钮触发全屏动画
    Flash片头加载loading与V2组件讨论 Flash中定点移动的解决方案分析
    Flash加载外部文件的各种方法与技巧 Flash动画制作过程概述及时间控制技巧
    Flash动画技巧:动画人物走路的动作规律 Flash电子杂志常用滚动区域控制代码
    在Mozilla和Firefox中实现Flash透明背景 Flash的动态文本如何调用外部文本文件
    让Flash调用符合web标准 消除浏览器影响 Flash AS代码实例:仿贝塞尔曲线控制
    用Flash AS3制作统计饼图动画效果 用Flash AS代码制作按钮弹出窗口
    Flash绘画实例:卡通女孩头像 让Flash动画适应任何分辨率的网页