蜻蜓点水flash制作

一、概述

1.1 简介

多媒体技术初露端倪是X86时代的事情。1988年MPEG（Moving Picture Expert Group，运动图像专家小组）的建立对多媒体技术的发展起到了推波助澜的作用。进入90年代，随着硬件技术的提高，自80486以后，多媒体时代正式到来。

Flash被大量应用于互联网网页的矢量动画设计，因为使用向量运算（Vector Graphic）的方式，产生出来的影片占用存储空间较小。

使用Flash创作出的影片有自己的特殊档案格式（swf）。

1.2 设计题目

蜻蜓点水游戏设计

1.3 设计目的

本课程的设计的目的是通过实践使同学们经历多媒体应用系统开发的全过程和受到一次综合训练，以便能较全面地理解、掌握和综合运用所学的知识。

结合具体的案例，理解并初步掌握常用多媒体软件的使用，利用多媒体计算机等设备进行音频与视频数据的获取和处理、图像处理与图像文件格式转换、超文本超媒体在交互式多媒体软件的应用；通过《多媒体课程设计》实验，使学生能够达到提高多媒体技术的实际开发应用能力，了解系统分析、系统设计、系统实施的主要环节和步骤以及软件文档的制作过程。

1.4 开发环境

Microsoft flash 8.0

1.5 设计要求

1）完成整个程序的设计及组合；

2）经教师检查及答辩；写出规范的课程设计说明书；

3）课程设计结束后交设计说明书等文档，并以班为集体刻录多媒体作品光盘。文档雷同者按不及格处理；

4）课程设计报告采取统一格式。

二、设计过程

新建一个空白的flash文档，按ctrl+F8（或执行【插入】|【新建元件】命令）新建一个名为“蜻蜓”的图形元件。如图1蜻蜓元件所示

图1 蜻蜓元件

在当前的元件场景中导入一张蜻蜓图片，如：。

按ctrl+F8快捷键，在新建一个影片剪辑元件，命名为“蜻蜓飞”，如图2蜻蜓飞所示

图2 蜻蜓飞

在这个元件中，要把蜻蜓的翅膀做成动画，首先按ctrl+L打开库面板，把刚导入的蜻蜓拖到场景中，然后按才ctrl+B分解蜻蜓，然后选点选起蜻蜓的一边翅膀，按F8把它转化为图形元件，再用同样的方法把另一边的翅膀也转成图形元件。

然后，点下一边的翅膀，按ctrl+X剪切，新建一个图层2，在图层2按ctrl+shift+V 粘贴到原来的位置，用同样的方法把另外一边的翅膀也放到一个图层里。

在图层1第5帧插入帧，在分别在图层2和图层3第3帧和5帧插入关键帧，插入后，把图层2和图层3第3帧的蜻蜓翅膀稍微用变形工具往后改下，最后分别在这两个图层的第1帧和第3帧右击创建补间动画就行了，如图3蜻蜓飞图层所示。

图3 蜻蜓飞图层

按快捷键ctrl+F8新建一个按钮元件，如图4按钮元件所示。

图4 按钮元件

在元件中，把笔触颜色设置为无，把填充颜色设置为透明，然后在场景中画一个四方形。最后，把按钮元件后面的三帧都插入关键帧，如图5按钮所示。

图5 按钮

在导入了水滴的声音效果后，后点击最后的“点击”帧，打开属性面板为按钮添加声音效果，如图6所示

图6 添加声音效果

按ctrl+F8新建一个“水波”的影片剪辑元件，如图7水波元件所示

图7 水波元件

在元件中图层1第1帧，把按钮元件从库中拖到场景中。新建一个图层2，在图层2中的第2帧插入关键帧。

选择椭圆工具，把笔触颜色设置为蓝色，填充色味无，然后在这一帧中画一个蓝色小圆圈。在这一层的第7帧插入关键帧，然后用变形工具把椭圆放大一些，再在第10帧插入关键帧，再把椭圆放大一些，然后点下舞台上的椭圆，按快捷键ctrl+F9打开混色器面板，在这里把椭圆的颜色设置为无。最后，分别在第2帧和第7帧创建形状补间动画，如图8所示。

图8 水波制作

接下来，点下图层2第2帧，按住Shift不放，再点下第10帧，把这9帧会部选取起来，右击，复制，然后新建图层3，在图层3第4帧右击粘贴帧，再新建一个图层4，同样，在第7帧右击粘贴帧，这样，一个水波就做好了。

点下图层1（即放按钮的图层）的第1帧，按快捷键F9（或者点击右键|动作）打开动作面板，输入stop();如图9所示。

图9 写代码

然后点下舞台上的按钮，再次按F9打开动作面板，输入以下代码。

on (release) {

gotoAndPlay(2);

}

该代码使单击鼠标时flash跳转到第2帧并播放。

接下来，回到主场景中，在图层1中将背景图片导入舞台，在导入后可执行【修改】|【变形】|【任意变形】命令，将图片的大小改成一样。然后新建图层2，打开库面板后，将水波元件往图片上有水的地方放如图10所示。

图10 放水波元件

最后，再新建一个图层3，把蜻蜓飞元件从库中拖到场景中，点下场景中的蜻蜓，在属性面板中把其实例名改为a。

新建一个图层4，将已导入库（【导入】|【导入库】）中的背景音乐拖入。

点下图层3第1帧，按F9打开动作面板，输入以下代码来实现隐藏鼠标，元件跟随鼠标移动

Mouse.hide();

startDrag(“a”,true);

最后按ctrl+enter快捷键测试该flash。

三、设计结果

当打开flash后，将鼠标移动到图片上时，鼠标会隐藏，只有蜻蜓跟随鼠标移动。在蜻蜓停留在水面点击鼠标时，水面会出现水纹并有点击水面的声音，过一会儿水纹消失。