MX动画设计与制作

1、180图形图像处理技术图形图像处理技术第第 1 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君第第1313章章 Flash MX动画设计与制作动画设计与制作 13.1 Flash MX简介简介 13.1.4 Flash MX动画形式 13.1.5 Flash MX运行的系统要求 13.1.6 常见动画文件格式0180图形图像处理技术图形图像处理技术第第 1

2、章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君1513.1.4 Flash MX 动画形式 Flash MX 动画有别于以前常用在网络中的 GIF 动画，它采用的是矢量绘图技术，矢量图可以无限放大，而图像质量不损失的一种格式的图像。由于动画是由矢量图构成的，这样就减少了动画文件的存储空间。 在 Flash MX 中，用户只需绘制动画中几个关键动作时的帧图片，

3、而在这些关键帧图片之间的一些过渡图片，则由 Flash MX 来自动生成。这样在进行动画创作时的工作量会大大减少，同时动画的控制会更加容易，动画的效果也会更加生动。 在 Flash 中，最基本的动画形式有 2 种：逐帧动画和补间动画。其中，补间动画又可以根据位置和形状的变化细分为运动补间和形状补间。逐帧动画需要创作者一帧一帧进行绘制， 而补间动画只需要创作者绘制有关的关键帧， 关键帧之间的过渡帧则由 Flash 自动生成。 1.逐帧动画 逐帧动画可以说是一种比较原始的动画形式。 在这种动画中， 如果想完成一个动画动作，那么就需要创作者一帧一帧的绘制。 下面通过一个小球旋转动画的例子来具体认识一

4、下逐帧动画的创作方法。 （1）新建一个新的场景文件。单击“插入”“新建元件”命令，弹出“创建新元件”对话框（如图 13-16 所示） ，选择“图形”单选按钮，单击【确定】按钮，即创建一个名称为“元件 1”的图形元件。 180图形图像处理技术图形图像处理技术第第 1 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君16 图 13-16 创建新元件对话框 （2）使

5、用工具箱中的“椭圆工具”，在“元件 1”的编辑区内绘制一个边线为黑色，内部填充为无色的圆，单击“窗口”“对齐”命令，弹出“对齐”面板。首先单击“对齐”面板中的“相对场景”按钮，使元件的位置相对于场景，然后再单击“垂直对齐”按钮和“水平对齐”按钮，使元件以场景为中心进行对齐。然后再绘制一个小的黑色的实心圆，并调整二者位置，如图 13-17 所示。 图 13-17 绘制图形 （3）单击“场景切换”按钮回到“场景 1” 。单击“窗口”“库”命令调出“库”面板，将“元件 1”拖入到“场景 1”里。再次单击“窗口”“对齐”命令，单击“对齐”面板中的“相对场景”按钮使元件的位置相对于场景，然后单击“垂直对

6、齐”按钮和“水平对齐”按钮将元件以场景为中心进行对齐。 （4）单击时间轴上的第 2 帧，单击鼠标右键，在弹出的快捷菜单中选择“插入关键帧”命令。接下来依次选中第 311 帧，使用同样的方法给第 311 帧插入关键帧，如图 13-18所示。 180图形图像处理技术图形图像处理技术第第 1 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君17 图 13-18 逐帧

7、插入关键帧 （5）小球旋转一圈是 360o，如果用 10 帧来描绘小球的整个旋转过程，那么每一帧之间相差的旋转角度就是 36o。单击时间轴上第 2 帧，单击“窗口”“变形”命令弹出“变形”面板（如图 13-19 所示） ，在其中输入旋转角度为 36 o，然后按Enterqvfp，如图 13-20所示。 图 13-19 “变形”面板 图 13-20 旋转后的图形 （6）使用同样的方法对第 311 帧的图形进行相应的旋转。单击“控制”“测试影片”命令，观看最后的动画效果。 180图形图像处理技术图形图像处理技术第第 1 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章

8、第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君182. 运动补间动画 运动补间动画在 Flash 中常运用于群组对象的移动、缩放、旋转。当两个关键帧的对象位置不同时，Flash 则自动生成两个关键帧之间的过渡位置，从而形成连续的运动。对于上一个例子，如果用运动补间动画的形式来表现，可以这样进行创作。 （1）新建一个新的场景文件。单击“插入”“新建元件”命令，弹出“创建新元件”对话框，选择“图形”单选按钮，单击【确定】按钮，创建一个名称

9、为“元件 1”的图形元件。 （2）使用工具箱中的“椭圆工具”，在“元件 1”的编辑区内绘制一个边线为黑色，内部填充为无色的圆，单击“窗口”“对齐”命令，弹出“对齐”面板。首先单击“对齐”面板中的“相对场景”按钮使元件的位置相对于场景，然后再单击和使元件以场景为中心进行对齐。然后再绘制一个小的黑色的实心圆，并调整二者位置。 （3）单击“场景切换”按钮回到“场景 1” 。单击“窗口”“库”命令调出“库”面板，将“元件 1”拖入到“场景 1”里。再次单击“窗口”“对齐”命令，单击“对齐”面板中的使元件的位置相对于场景，然后单击和将元件以场景为中心进行对齐。 （4） 单击时间轴上的第 10 帧， 单击

10、鼠标右键， 在弹出的快捷菜单中选择 “插入关键帧”命令，如图 13-21 所示。 图 13-21 插入关键帧 180图形图像处理技术图形图像处理技术第第 1 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君19（5）选择时间轴上的第 1 帧，在“属性”面板中设置“补间”下拉列表框为“运动”选项，设置“旋转”方向为“顺时针” ，旋转次数为 1 次，如图 13-2

11、2 所示。 图 13-22 “属性”面板 （6）单击“控制”“测试影片”命令，观看最后的动画效果。 通过这个例子，可以看出补间动画比逐帧动画相比有设计简单、工作量小、修改方便等优点。但是在使用补间动画的时候，要注意每个图层只能有一个运动对象，而且这个运动对象必须是群组对象（或元件） ，绝对不能是打散的轮廓线或填充色块。 再者要着重强调的是运动补间动画间的两个关键帧中必须有相同的对象（元件） 。如果不是相同对象的话，时间轴上将以虚线来显示两个关键帧之间失效的补间动画（如图 13-23所示） ，同时补间动画过渡帧中图形也将消失。 图 13-23 失效的补间动画 180图形图像处理技术图形图像处理技

12、术第第 1 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君203.形状补间动画 形状补间动画可以在两个外形之间产生很平稳的渐变， 也可以完成颜色的渐变。 下面通过一个经典的圆变方例子来深入理解一下形状补间动画的使用。 （1）选择时间轴上的第 1 帧，使用工具箱中的“椭圆工具”，在编辑区内绘制一个边线为无色，内部填充为黑色的圆，单击“窗口”“对齐”命令，弹出“

13、对齐”面板。首先单击“对齐”面板中的使圆的位置相对于场景，然后再单击和使圆以场景为中心进行对齐。 （2）在时间轴上的第 10 帧上单击鼠标右键，在弹出的快捷菜单中选择“插入关键帧”命令。 （3）删除刚才所画的圆形，使用工具箱中的，在编辑区内绘制一个边线为无色，内部填充为红色的正方形，单击“窗口”“对齐”命令，弹出“对齐”面板。首先单击“对齐”面板中的使正方形的位置相对于场景，然后再单击和使正方形以场景为中心进行对齐。 （4）选择时间轴上的第 1 帧，在“属性”面板中设置“补间”下拉列表框为“形状”选项，如图 13-24 所示。 图 13-24 帧”属性”面板 180图形图像处理技术图形图像处理

14、技术第第 1 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君21（5）单击“控制”“测试影片”命令，观看最后的动画效果，如图 13-25 所示。 图 13-25 最终动画效果 与运动补间动画相反，形状补间动画只能处理非群组对象，也就是打散的对象。如果在关键帧中出现了群组对象，那么形状补间动画就会失效，补间之间将以虚线连接。 13.1.5 Flash MX 运

15、行的系统要求 1.对于 Windows 系统 Intel Pentium 200 MHz 或更高的处理器； Windows 98 SE/ME/ NT 4.0/2000/XP；64 MB RAM （建议 128 MB） ； 85 MB 可用磁盘空间； 分辨率可达 1024768 的 16 位彩色显示器；CD-ROM 驱动器。 180图形图像处理技术图形图像处理技术第第 1 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束

16、第第 11 章章第第 12 章章第第 13 章章制作：吴兰君2.对于 Macintosh 系统 运行 Mac OS 9.1（或更高版本）或 Mac OS X 10.1（或更高版本）的 Power Macintosh；64 MB RAM 可用应用程序内存 （建议 128 MB） ， 85 MB 的可用磁盘空间； 分辨率可达 1024768 的 16 位（可显示数千种颜色）彩色显示器；CD-ROM 驱动器。 13.1.6 常见动画文件格式 计算机动画现在应用的非常广泛，由于应用领域不同，其动画文件也存在着不同类型的存储格式。如，3DS 是 DOS 系统平台下 3D Studio 的文件格式。U3D

17、 是 Ulead COOL 3D 文件格式。GIF 和 SWF 则是最常用的动画文件格式。下面介绍目前应用最广泛的几种动画格式和动画输出后的视频格式。 1.GIF GIF 是图形交换格式(Graphics Interchange Format)的英文缩写，是由 CompuServe 公司于 80年代推出的一种高压缩比的彩色图像文件格式。CompuServe 公司是一家著名的美国在线信息服务机构，针对当时网络传输带宽的限制，CompuServe 公司采用无损数据压缩方法中压缩效率较高的 LZW（Lempel Ziv & Welch）算法，推出了 GIF 图像格式，主要用于图像文件的网络传

18、输， 鉴于 GIF 图像文件的尺寸通常比其他图像文件(如 PCX)小好几倍， 这种图像格式迅速得到了广泛的应用。考虑到网络传输中的实际情况，GIF 图像格式除了一般的逐行显 22180图形图像处理技术图形图像处理技术第第 1 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君示方式之外，还增加了渐显方式。也就是说，在图像传输过程中，用户可以先看到图像的大致轮廓，

19、 然后随着传输过程的继续而逐渐看清图像的细节部分， 从而适应了用户的观赏心理，这种方式以后也被其他图像格式所采用，如 JPEG/JPG 等。最初，GIF 只是用来存储单幅静止图像，称 GIF87a。后来，又进一步发展成为 GIF89a，可以同时存储若干幅静止图像并进而形成连续的动画。目前，在 Internet 上大量采用的彩色动画文件多为 GIF 格式。 2. Flic Flic 文件是 Autodesk 公司在其出品的 Autodesk Animator / Animator Pro / 3D Studio 等2D/3D 动画制作软件中采用的彩色动画文件格式。其中，.FLI 是最初的基于 3

20、20200 分辨率的动画文件格式，而.FLC 则是.FLI 的进一步扩展，采用了更高效的数据压缩技术，其分辨率也不再局限于 320200。Flic 文件采用行程编码(RLE)算法和 Delta 算法进行无损的数据压缩， 首先压缩并保存整个动画序列中的第一幅图像， 然后逐帧计算前后两幅相邻图像的差异或改变部分，并对这部分数据进行 RLE 压缩，由于动画序列中前后相邻图像的差别通常不大，因此，采用行程编码可以得到相当高的数据压缩率。 GIF 和 Flic 文件，通常用来表示由计算机生成的动画序列，其图像相对而言比较简单，因此可以得到比较高的无损压缩率，文件尺寸也不大。然而，对于来自外部世界的真实而

21、复杂的影像信息而言，无损压缩便显得无能为力，即使采用了高效的有损压缩算法，影像文件的尺寸也仍然相当庞大。 23180图形图像处理技术图形图像处理技术第第 1 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君3. SWF SWF 是 Micromedia 公司的产品 Flash 的矢量动画格式，它采用曲线方程描述其内容，不是由点阵组成内容， 因此这种格式的动画在

22、缩放时不会失真， 非常适合描述由几何图形组成的动画， 如教学演示等。 由于这种格式的动画可以与 HTML 文件充分结合， 并能添加 MP3音乐，因此被广泛地应用于网页上，成为一种“准”流式媒体文件。 4.AVI AVI 是音频视频交错(Audio Video Interleaved)的英文缩写， 它是 Microsoft 公司开发的一种符合 RIFF 文件规范的数字音频与视频文件格式，原先用于 Microsoft Video for Windows (简称 VFW)环境，现在已被 Windows 95 以上、OS/2 等多数操作系统直接支持。AVI 格式允许视频和音频交错在一起同步播放，支持

23、256 色和 RLE 压缩，但 AVI 文件并未限定压缩标准，因此，AVI 文件格式只是作为控制界面上的标准，不具有兼容性，用不同压缩算法生成的 AVI 文件，必须使用相应的解压缩算法才能播放出来。常用的 AVI 播放驱动程序，主要是 Microsoft Video for Windows 或 Windows 95 以上操作系统中的 Video 1， 以及 Intel 公司的Indeo Video。 AVI 文件目前主要应用在多媒体光盘上， 用来保存电影、 电视等各种影像信息，也出现在 Internet 上，供用户下载、欣赏新影片的精彩片断。 24180图形图像处理技术图形图像处理技术第第 1

24、 章章 第第 2 章章第第 3 章章 第第 4 章章第第 5 章章第第 6 章章第第 7 章章第第 8 章章第第 9 章章第第 10 章章第第 13 13 章章 Flash MXFlash MX动画设计与制动画设计与制作作 结束第第 11 章章第第 12 章章第第 13 章章制作：吴兰君5.MOV/.QT QuickTime 是 Apple 计算机公司开发的一种音频、视频文件格式，用于保存音频和视频信息，具有先进的视频和音频功能，被包括 Apple Mac OS、Microsoft Windows 95 以上的操作系统电脑平台支持。QuickTime 文件格式支持 25 位彩色，支持 RLE、JPEG 等领先的集成压缩技术，提供 150 多种视频效果，并配有提供了 200 多种 MIDI 兼容音响和设备的声音装置。新版的 QuickTime 进一步扩展了原有功能，包含了基于 Internet 应用的关键特性，能够通过 Internet 提供实时的数字化信息流、工作流与文件回放功能。此外，QuickTime 还采用了一种称为 QuickTime VR（简作 QTVR）技术的虚拟现实（VR，Virtual Reality）技术，用户通过鼠标或键盘的交互式控制，可以观察某一地点周围 360o的景像，或者从空