Flash项目案例教程 - 万水书苑-出版资源网

全文

(1)第 1 章制作电子贺卡教学重点与难点     . Flash 基础绘图工具介绍基本元件使用基本动画制作电子贺卡制作. 1.1. 任务布置——新年电子贺卡. 电子贺卡用于联络感情和互致问候，之所以深受人们的喜爱，是因为它具有温馨的祝福语言、浓郁的民俗色彩、传统的东方韵味、古典与现代交融的魅力，既方便又实用，是促进和谐的重要手段。贺卡在传递“含蓄”的表白和祝福的同时，又形成了自己独特的文化内涵，加强了人们之间的相互尊重与体贴。电子贺卡节约了发卡者购卡及邮寄的费用，节省了大量的时间。发卡人发出的只是几句文字和一段网络链接地址。经过数次改进以后，它已经成为人们传递祝福的首选方式了。 1.1.1 分析客户需求满载收获的牛年就要过去了，值此新春佳节来临之际，给兢兢业业工作在一线的教职工以及所有学生送去新春的祝福。祝福他们在新的一年里身体健康、全家幸福、工作顺利、学业有成！对象：教师、学生内容要求：  体现出新春喜气的主题意境，突出节日的喜庆气氛，以娱乐为主。  跟虎年有关，有祝福语。  页面精美，画面图案及颜色搭配合理，具有美感及喜庆感，有新意。  配有动画效果。  伴随合适的音乐。 1.1.2 搜集素材 1．图片素材围绕要突出节日的喜庆气氛，体现出新春喜气的主题意境，根据中国的传统习俗，准备选择体现喜气的红黄色为主的背景图片，表现热闹喜庆的鞭炮、灯笼、中国结以及与虎年相关的大小虎贺岁图。.

(2) Flash 项目案例教程. 根据需要通过搜集处理或用软件制作得到如图 1-1 所示的素材。. 图 1-1. 电子贺卡素材. 然后对这些图片素材进行处理，主要是利用 Photoshop 软件工具把背景去掉，做成透明的背景并另存成 png 格式。 2．音乐素材搜集喜庆热闹的音乐作为背景音乐。寻找一段放鞭炮的音乐和表现节日的喜庆音乐，然后进行相应的处理。 3．自制素材要用灯笼制作动画，所以需要自己绘制灯笼。. 1.2. 知识技能. 1.2.1 Flash CS3 简介 Flash CS3 是 Adobe 公司最新推出的 Flash 动画制作软件，它相比之前的版本在功能上有很多有效的改进及拓展，深受用户青睐。Flash 动画是一种以 Web 应用为主的二维动画形式，采用矢量技术和流式播放技术等手段，生成的文件小、质量高，便于在网上发布和浏览。因此，它得到了网络界的广泛认可，并使它在网页设计中占有一席之地，成为网上最为流行的多媒体软件。 1．Flash CS3 的功能（1）绘图功能。Flash CS3 可以完成图形绘制、特殊字形处理等方面的工作。（2）动画功能。Flash CS3 提供的动画工具可以制作出漂亮的动画。（3）编程功能。制作 Flash 交互式动画。Flash CS3 提供了几百个关键词，可完成复杂的行为制作。这 3 部分功能是相对独立的，在工作中通常分开进行。例如，由美工人员完成绘图及部分多媒体的制作，由编程人员完成互动行为的编写，由制作人员进行最后的加工制作。. 2.

(3) 第 1 章制作电子贺卡. 2．Flash CS3 的特点（1）使用矢量图形。计算机的图形显示方式有矢量图和位图两种。在 Flash 软件上绘制的图形是矢量图。与位图相比，矢量图的最大优点在于，经任意放大或缩小不会影响图形质量。同时，文件所占用的存储空间非常小。（2）支持导入音频、视频。在 Flash 中可以使用 MP3 等多种格式的音频素材，还提供了功能强大的视频导入功能，并支持从外部调用视频文件。（3）采用流式播放技术，拥有强大的网络传播能力。Flash 的影片文件采用流式下载，即它的影片文件可以一边下载一边播放，从而可以节省浏览时间。（4）交互性强，能更好地满足用户的需要。运用 Flash 内置的动作脚本，不仅可以制作眩目的效果，还可以让动画浏览者参与互动。通过其强大的交互功能，不仅为网页设计和动画制作提供了无限的创作空间，从商业的角度来说，还可以制作一流的商业演出动画或广告，使企业的产品发布得到较传统广告模式更好的效果。 3．Flash 动画制作的基本步骤优秀的 Flash 动画需要经过很多的制作环节，每个环节都直接影响到作品的最终品质。其制作过程大致可分为以下几个步骤：（1）动画策划。制作动画之前，应先明确制作动画的目的。明确制作目的之后，就可以为整个动画进行策划，包括动画的剧情、动画分镜头的表现手法和动画片段的衔接等。（2）收集素材。收集素材是完成动画策划之后的一项很重要的工作，素材的好坏决定着作品的优劣。因此在收集时应注意有针对性、有目的性地收集素材，最主要的是应根据动画策划时所拟定好的素材类型进行收集。（3）制作动画。把收集的动画素材按动画策划实现完成动画，是动画制作的关键一步，在制作过程中应该保持严谨的态度，认真对待每一个小的细节，这样才能使整个动画的质量得到统一，得到高质量的动画。（4）调试动画。完成动画制作的初稿之后，要进行调试。调试动画主要是对动画的各个细节、动画片段的衔接、声音与动画之间的协调等进行局部的调整，使整个动画看起来更加流畅，在一定程度上保证动画作品的最终品质。（5）测试动画。Flash 动画制作完成后，常常需要对其进行测试：Flash 动画是否按照设计思路产生了预期的效果；Flash 动画的体积是否处于最小状态，能不能更小一些；在网络环境下，是否能正常地下载和观看动画。（6）发布动画。当 Flash 动画制作完成之后，需要将其发布为独立的作品以供他人欣赏。在发布之前，用户要对动画的生成格式、画面品质和声音效果等进行设置，这将最终影响动画文件的格式、文件大小以及动画在网络中的传输速率等。 4．Flash CS3 的工作界面（1）欢迎界面。第一次打开 Flash CS3 时，会显示欢迎界面，如图 1-2 所示。从图中可以看出，欢迎界面包含 4 个区域： 1）打开最近的项目。在这里，可以打开最近操作过的 Flash 文档。 2）新建。新建文档，在这里列出了许多 Flash 文件的类型。 3.

(4) Flash 项目案例教程. 图 1-2. 欢迎界面. 3）从模板创建。可直接创建模板文档，在这里列出了创建 Flash 文档最常用的模板。 4）扩展。链接到 Flash Exchange 网站，可以在其中下载助手应用程序、扩展功能及相关信息。若要隐藏欢迎界面，可以选中“不再显示”复选框。（2）Flash CS3 的操作界面。在欢迎界面上单击“新建”区域中的“Flash 文件（ActionScript 3.0）”，即可创建最常用的 Flash CS3 文档，并迅速打开 Flash CS3 的操作界面，如图 1-3 所示。 Flash CS3 默认工作界面包括菜单栏、工具箱、时间轴面板、舞台、工作区、属性面板、面板组等部分。菜单栏：提供各种命令集，如“文件”菜单中提供了对文件操作的命令，“修改”菜单中提供了对对象操作的命令。时间轴面板：是控制和描述 Flash 影片播放速度和播放时长的工具，如设置帧和图层的顺序。工具箱：提供绘图工具。舞台：提供当前角色表演的场所。工作区：角色进入舞台时的场所。播放影片时，处在工作区的角色不会显示出来。属性面板：可以显示当前工具、元件、帧等对象的属性和参数，在属性面板中可对当前对象的一些属性和参数进行修改。面板组：Flash CS3 包括多种面板，分别提供不同功能，如颜色面板提供色彩选择等。. 4.

(5) 第 1 章制作电子贺卡菜单栏工具栏时间轴面板. 舞台工作区. 面板组. 属性面板图 1-3. 操作界面. 5．Flash CS3 的文件操作（1）新建 Flash 文件。新建 Flash 文件的操作步骤如下： 1）启动 Flash CS3 后，Flash CS3 会打开如图 1-2 所示的欢迎界面。 2）单击“新建”区域中的“Flash 文件（ActionScript 3.0）”，可以创建扩展名为 fla 的新文件。新建文件自动采用 Flash 的默认文件属性。 3）还可以执行“文件”→“新建”命令，弹出“新建文件”对话框，在其中选择“Flash 文件（ActionScript 3.0）”完成新文件的创建。注意：Flash 文件（ActionScript 3.0）和 Flash 文件（ActionScript 2.0）中的 ActionScript 3.0 和 ActionScript 2.0 是在使用 Flash 文件编程时所使用的脚本语言的版本。Flash CS3 默认采用 ActionScript 3.0 版本的语言。ActionScript 2.0 版是 Flash 8 中普遍采用的脚本语言，在易用性和功能上不如 ActionScript 3.0。两个版本的语言不兼容，需要不同的编辑器进行编译，所以新建文件时，需要根据实际需要选择使用哪种方式新建文件。设置文件属性：新建 Flash 文件后，经常需要对它的尺寸、背景颜色、帧频、标尺单位等属性进行设置。其操作方法如下： 1）执行“修改”→“文档”命令（或按 Ctrl+J 组合键），弹出如图 1-4 所示的“文档属性” 对话框，其中显示了文档的当前属性。 2）在该对话框中设置文档属性。 3）单击“确定”按钮完成设定。（2）保存 Flash 文件。保存 Flash 文件的命令有“保存”、“保存并压缩”、 “另存为” 、“另存为模板”和“全部保存”命令，使用这些命令都可以保存文件。. 5.

(6) Flash 项目案例教程. 图 1-4. “文档属性”对话框. 1）“保存”命令。保存文件的操作步骤如下： ①单击“文件”→“保存”命令。如果是第一次执行“保存”命令，会弹出如图 1-5 所示的“另存为”对话框。. 图 1-5. “另存为”对话框. 注意：当再次单击“保存”命令时会以第一次保存文件所设定的格式自动覆盖原存储内容。 ②在“另存为”对话框中，可以设定文件的保存路径、名称和格式。 ③单击“保存”按钮完成保存。 “另存为”对话框中各选项的含义如下： 6.

(7) 第 1 章制作电子贺卡. 保存在：可以设定当前文件存储位置。单击“保存在”右侧的下拉按钮，在弹出的路径下拉列表框中查找文件的存储位置。单击“另存为”对话框中左侧的图标按钮，如“桌面”、“我的文件”等，可以快速转向这些目标文件夹。单击“另存为”对话框中右上方的“向上”按钮，可以移至上一级目录；单击“新建文件夹”按钮，可以新建文件夹；单击“‘查看’菜单”按钮，可以在弹出的菜单中选择当前文件夹中的文件的排序方式。文件名：在“文件名”文本框中可以输入当前文件的名称。将鼠标指针移至“文件名” 文本框内单击，出现闪烁光标后输入文件名称。保存类型：设定文件的保存类型。单击“保存类型”右侧的下拉按钮，在弹出的下拉列表框中选择目标文件类型。保存类型包括“Flash CS3 文档”和“Flash 8 文档”两种格式。保留“Flash 8 文档”格式是为了能与上一版本保持良好的兼容性，由于 Flash CS3 采用的一些新技术无法被 Flash 8 支持，因此这里保留了“Flash 8 文档”格式。 2）“另存为”命令。当文件需要以新的路径、名称或格式保存时，可以使用“另存为” 命令，操作步骤如下： ①单击“文件”→“另存为”命令，弹出“另存为”对话框。 ②在其中设定文件的名称、格式、路径等，与使用“保存”命令的操作一样。 ③单击“保存”按钮，文件将以新的路径、名称或格式保存。 3）“另存为模板”命令。当需要将文件当作样本多次使用时，可以使用模板形式保存。例如，制作一个按钮，需要在不同功能的按钮上使用不同的说明文字，这时可以先制作一个没有文字的按钮，再将其存为模板。 “另存为模板”的操作步骤如下： ①执行“文件”→“另存为模板”命令，弹出如图 1-6 所示的“另存为模板”对话框。. 图 1-6. “另存为模板”对话框. ②在“名称”文本框中输入模板名称，并在“类别”下拉列表框中输入或选择类别。在 “描述”文本框中输入模板说明（最多 255 个字符）。当在“新文件”对话框中选择该模板时， 7.

(8) Flash 项目案例教程. 该说明就会显示出来。 ③单击“保存”按钮将当前文件保存为模板。使用创建的模板新建文件的操作方法如下： ①启动 Flash CS3，单击如图 1-7 所示的“从模板创建”框中的目标模板按钮，打开“从模板新建”对话框。. 图 1-7. 开始界面. ②在其中选择刚才保存的“按钮”模板。 ③单击“确定”按钮，完成文件建立。注意：在图 1-8 所示的界面中，左边“类别”列表框中为 Flash 自带的各类模板，如广告、手机等，可根据需要选择。. 图 1-8 8. “从模板新建”对话框.

(9) 第 1 章制作电子贺卡. （3）打开 Flash 文件。 1）单击“文件”→“打开”命令，弹出如图 1-9 所示的“打开”对话框。. 图 1-9. “打开”文件对话框. 2）在该对话框中选择目标文件。 3）单击“打开”按钮，打开 Flash 文件。（4）关闭文件。 1）单击时间轴面板右上角的“关闭”按钮即可关闭当前文件。单击“文件”→“关闭” 命令也可以关闭当前文件。 2）若当前文件改动后没有被保存过，会弹出一个保存提示对话框，如图 1-10 所示。. 图 1-10. 保存提示对话框. 3）单击“是”按钮，保存并关闭文件。 1.2.2 基本绘图工具的使用单击“窗口”→“工具”命令，可以打开或关闭如图 1-11 所示的工具箱。Flash CS3 的工具箱中包含一套完整的绘图工具。. 9.

(10) Flash 项目案例教程. 绘图工具. 查看工具. 选择工具. 部分选报工具. 变形工具组. 套索工具. 钢笔工具组. 文本工具. 线条工具. 矩形工具组. 铅笔工具. 刷子工具. 墨水瓶工具. 颜料桶工具. 滴管工具. 橡皮擦工具. 手形工具. 缩放工具. 笔触颜色颜色工具. 填充颜色黑白按钮紧贴至对象. 没有颜色变换颜色. 选项. 图 1-11 工具箱. 工具箱分为绘图工具、查看工具、颜色选择工具和工具选项栏 4 个部分，单击工具箱中的目标工具图标即可激活该工具。工具箱选项栏会显示当前工具的具体可用设置项，例如选择箭头工具，与它相对应的属性选项就会出现在工具箱选项栏中。选择工具：用来选择目标、修改目标形状的轮廓，按住 Ctrl 键可在轮廓线上添加节点并改变轮廓形状。部分选取工具：通过调节节点的位置或句柄改变线条的形状。变形工具组：该工具组中包含了任意变形工具和渐变变形工具。任意变形工具可调整目标对象的大小，进行旋转等变形操作。渐变变形工具可调整渐变填充色的方向、渐变过渡的距离。套索工具：套选目标形状。钢笔工具组：以节点方式建立复杂选区形状。文本工具：用于输入文字。线条工具：用于画出直线段。矩形工具组：矩形工具组包括矩形工具、椭圆工具、基本矩形工具、基本椭圆工具和多角星形工具。矩形工具可以建立矩形，椭圆工具可以建立椭圆形，基本矩形工具可以建立圆角矩形，基本椭圆工具可以建立任意角度的扇形，多边形工具可以建立多边形和星形。铅笔工具：使用线条绘制形状。刷子工具：使用填充色绘制图形。墨水瓶工具：用于填充轮廓线条的颜色。颜料桶工具：用于填充封闭形状的内部颜色。 10.

(11) 第 1 章制作电子贺卡. 滴管工具：提取目标颜色作为填充颜色。橡皮擦工具：用于擦除形状。手形工具：用于移动工作区的视点。缩放工具：用于放大和缩小视图。笔触颜色：显示当前绘制线条所采用的颜色。填充颜色：显示当前用来填充形状内部的颜色。黑白按钮：可以将当前笔触色设为黑色，填充色设为白色。变换颜色：将当前的笔触色与填充色交换。没有颜色：绘制的封闭形状将不会自动以当前填充颜色填充，仅为线条形状。选项：显示当前工具可以设置的选项。 “选择工具” ：用来选择并移动目标，修改目标形状的轮廓，按住 Ctrl 键可在轮廓上添加节点并改变线条的形状。选择对象是最基本的操作，只有在选择了目标对象后才能够对其进行所需要的编辑操作。（1）选择单一目标对象。 1）单击工具箱中的“选择工具”。 2）移动鼠标指针至目标对象上单击，选中目标。注意：当指向的目标对象为元件、图像和组合后的图形时，选择的是一个完整的目标；当指向目标为矢量图形时，Flash 只选择最近两个交点（或端点）间的线段；当指向为填充色彩时，自动以色彩封闭的边缘为限选择色彩范围，如图 1-12 所示。. （a）对象为元件、图像或组合图形. （b）对象为矢量图形图 1-12. （c）选择边缘封闭线. 选择单一对象. （2）选择多个对象。 1）框选法：在目标位置的左上角按住左键拖动鼠标至目标对象的右下角，将目标对象的所有内容框选在矩形区域内。释放鼠标左键，当前图层矩形范围内的所有对象都会被选中。 2）首先选中一个对象，然后按住 Shift 键单击其他对象即可。（3）移动顶点。当目标为矢量图形时，单击“选择工具”，当鼠标指针移动到对象的顶点时，鼠标指针会发生变化，这时按住鼠标左键并拖动，即可改变顶点的位置，如图 1-13 所示。. 图 1-13. 移动顶点. 11.

(12) Flash 项目案例教程. （4）将直线变为曲线。单击“选择工具”，将鼠标放到对象的边缘，鼠标指针会发生变化，这时按住鼠标左键并拖动，如图 1-14 所示。. 图 1-14. 将直线变为曲线. （5）增加顶点。单击“选择工具”，当鼠标指针下方出现一个弧线的标志时，按住 Ctrl 键和鼠标左键进行拖动，到适当位置释放鼠标即可增加一个顶点，如图 1-15 所示。. 图 1-15. 增加顶点. “部分选取工具” ：用于对图形的局部进行选取，通过节点的句柄改变线条的形状。单击“部分选取工具” ，单击图形的边缘，此时系统将显示用于控制图形的节点。单击节点，系统将会显示该节点的控制柄，此时单击节点或调整杆的控制点并拖动即可改变图形形状，如图 1-16 所示。. 单击边缘. 单击节点. 拖动改变形状图 1-16. 取消选取. 部分选取. “任意变形工具” ：是改变图形与元件形状的工具，选中“任意变形工具”，然后单击或框选目标对象，此时所选对象的周围将显示一个有 8 个控制柄的变形框，将光标移至不同位置的控制柄上单击并拖动即可移动变形点、缩放、旋转与倾斜对象，如图 1-17 所示。. 垂直缩放. 水平缩放. 旋转图 1-17. 12. 任意变形. 倾斜.

(13) 第 1 章制作电子贺卡. “渐变变形工具”. ：修改渐变色填充效果。首先绘制图形填充渐变色，渐变类型有. 线性渐变和放射状渐变两种。（1）线性渐变。展开工作界面右边的颜色面板，在“类型”下拉列表框中选择“线性” 选项。设置渐变颜色：在面板下方有一个颜色条，上面默认有两个颜色滑块，双击每个滑块进行颜色选择，在空颜色条上单击空白处即可添加一个颜色滑块；选中某个颜色滑块并按住鼠标左键直接拖出颜色条即可删除颜色滑块。线性渐变颜色面板如图 1-18 所示。. 图 1-18. “颜色”面板. 选择“绘图工具”，在舞台中绘制图形。选中工具箱中的“线性渐变工具” ，然后在填充区域上单击，这时将在图形上出现渐变控制线和渐变控制点，如图 1-19 所示。渐变方向控制，鼠标放上去并按住鼠标左键进行转动渐变控制线渐变范围控制，按住鼠标左键左右拖动渐变中心控制，鼠标放上去，当变成十字箭头时进行拖动. 改变渐变方向. 改变渐变范围图 1-19. 改变渐变中心. 线性渐变. 13.

(14) Flash 项目案例教程. （2）放射状渐变。展开工作界面右边的“颜色”面板，在“类型”下拉列表框中选择“放射状”选项，如图 1-20 所示。渐变中心控制渐变长宽控制渐变圆大小控制渐变圆方向控制改变渐变中心. 改变渐变长宽. 改变渐变圆大小图 1-20. 改变渐变圆方向. 放射状渐变. “套索工具” ：用于选取复杂的图形区域，包含“魔术棒”、“魔术棒属性”和“多边形模式”3 个选项，如图 1-21 所示。当使用“套索工具”时，通过选择其选项区中的相关按钮可切换不同的选项模式。在使用“魔术棒”时要设置魔术棒的属性，利用“阈值”文本框设置颜色的容差，利用“平滑”下拉列表框设置选取边界的平滑方式，如图 1-22 所示。. 魔术棒魔术棒设置多边形模式图 1-21. “套索工具”选项. 图 1-22. “魔术棒设置”对话框. “钢笔工具” ：“钢笔工具”以节点方式建立复杂选区形状，并用于绘制比较复杂、精确的曲线。在 Flash CS3 中有一组钢笔工具，包括“添加锚点工具”、 “删除锚点工具”和“转换锚点工具” ，如图 1-23 所示。. 图 1-23. 14. 钢笔工具组.

(15) 第 1 章制作电子贺卡. 选择“钢笔工具” ，直接在舞台上连续单击左键确定各点的位置，连成一组如图 1-24 所示的直线段。在线条的起点位置按住鼠标左键并拖动，可以拖出方向线，释放鼠标。在下一个节点位置按住鼠标拖动出方向线，可以绘制出曲线，如图 1-25 所示。. 图 1-24. 用钢笔工具画直线. 图 1-25. 用钢笔工具画曲线. 注意：曲线是沿方向线相切的方向绘制的。通过方向线的长度可以控制曲线的弧度；通过方向线的角度可以控制曲线扭曲的方向。当选择“添加锚点工具”时，光标变为形状，在线段中任意单击鼠标左键即可添加一个锚点；选择“删除锚点工具”，光标变为形状，单击路径中的锚点即可删除该锚点；选择“转换锚点工具”，光标变为形状时，单击路径中的锚点，则可进行直线与曲线之间的变换。 “文本工具” 。（1）输入文本。“文本工具”主要用于输入和修改文本。选择工具箱中的“文本工具”，光标变成形状，在舞台上单击产生一个形状的文字输入框，使用键盘直接输入文字或者使用剪贴板将文字粘贴到输入框中。 Flash CS3 中有两种输入状态：默认输入和固定宽度。默认输入：文字输入框的一角用圆形标识，如图 1-26 所示，输入框随文字的输入自动延长，需要换行时按 Enter 键。圆形标识. 图 1-26. 默认输入. 固定宽度输入：如图 1-27 所示，文字框的一角用方形标识。输入框的宽度不会随文字的输入改变，当输入文字达到输入框宽度时会自动换行。方形标识. 图 1-27. 固定宽度输入. 注意：静态文本的输入状态标识位于输入框的左上角，动态文本输入状态标识位于输入框的左下角。改变输入状态的方法如下： 1）默认输入改变为固定宽度输入的操作步骤如下： ①单击工具箱中的“文本工具” 。 ②将鼠标指针移至需要调整的文本处单击，该文本的文字输入框激活。 15.

(16) Flash 项目案例教程. ③将鼠标指针移至输入框角点圆形标识处，鼠标指针变为一个双向箭头，按住鼠标左键并拖动，调整输入框的宽度后释放鼠标，默认的状态变为固定宽度输入。转变为固定宽度输入后，文字会随输入框的宽度自动换行，如图 1-28 所示。. 图 1-28. 默认输入改变为固定宽度输入. 2）固定宽度输入改变为默认输入的操作步骤如下： ①单击工具箱中的“文本工具” 。 ②将鼠标指针移至需要调整的文本处单击，该文本的文字输入框激活。 ③将鼠标指针移至输入框的角点方形标识处，鼠标指针变为一个双向箭头，双击鼠标左键，固定宽度输入变为默认输入。变为默认输入后，文字会自动排为一行。（2）文本属性设置。选择工具箱中的“文本工具”， “属性”面板显示了文本工具的各项属性，通过文本属性面板可以设置文本格式，如图 1-29 所示。文本类型. 字体. 字号颜色斜体粗体. 对齐方式文本方向选项. 字符位置（有一般、上标和下标）. 字母间距图 1-29. 文本“属性”面板. 单击文本类型下拉列表框的下拉按钮，在弹出的下拉列表框中选择文本类型，如图 1-30 所示。. 图 1-30. 16. 文本类型选择.

(17) 第 1 章制作电子贺卡. Flash 中的文本分为“静态文本”、 “动态文本”和“输入文本”。 “静态文本”用来创建不需要改变内容的文本框。 “动态文本”用来创建支持 ActionScript 编程技术的文本。 “输入文本”用来创建可在其中输入文本的文本框。滤镜在文本中的应用：滤镜是可以应用到对象的图形效果。选择要应用滤镜的对象，打开“滤镜”面板，如图 1-31 所示。. 图 1-31. “滤镜”面板. 单击面板中的“+”按钮弹出可选择滤镜项，选择需要的滤镜效果即可，如图 1-32 所示。在本项目中，在电子贺卡中输入了一副虎年的对联，应用了阴影滤镜效果，如图 1-33 所示。. 图 1-32. 滤镜选项. 图 1-33. 阴影滤镜效果. “线条工具” ：“线条工具”用于绘制任何细的线条。选择工具箱中的“线条工具”，会出现线条工具的“属性”面板，如图 1-34 所示。. 图 1-34. 线条“属性”面板. 设置好笔触颜色、笔触样式以及端点与接合样式属性后，将光标移动到舞台，变成十字形状。在直线起点的位置按住鼠标左键并拖动，在直线终点位置释放鼠标左键，完成直线绘制，如图 1-35 所示。 17.

(18) Flash 项目案例教程. 图 1-35. 直线绘制. 注意：在绘制直线时，按住 Shift 键可以画出和舞台成 45°倍数的直线。 “矩形工具” ： “矩形工具”绘制任意大小的矩形或正方形及多角星形。单击该图标打开下拉列表框，可以选择绘制矩形、椭圆及各种多角星形的工具，如图 1-36 所示。. 图 1-36. 矩形工具组. （1）使用矩形工具。 1）绘制矩形。 ①单击“矩形工具组”图标，在打开的下拉列表框中选择“矩形工具” 。 ②在“属性”面板中设置笔触颜色、笔触高度和笔触样式。 ③移动鼠标指针到舞台，鼠标指针变为十字形状。在矩形的一个角点位置按住鼠标左键拖动至矩形的对角点，释放鼠标左键完成绘制。 2）绘制圆角矩形。在“属性”面板中设置圆角半径的值。如果为 0，则为直角；为其他值则为圆角，如图 1-37 所示。. 图 1-37. 矩形工具属性面板. 按照绘制矩形的方法绘制圆角矩形，如图 1-38 所示。. 矩形. 圆角矩形图 1-38. （2）使用椭圆工具。 1）绘制椭圆。 ①单击工具箱的“矩形工具组”图标 18. 矩形. ，在打开的下拉列表框中选择“椭圆工具”. 。.

(19) 第 1 章制作电子贺卡. ②在“属性”面板中设置笔触颜色、笔触高度和笔触样式。 ③移动鼠标指针到舞台中，鼠标指针变为十字形状。在椭圆外切矩形的角点位置按住鼠标左键拖动至椭圆的外切矩形的对角点，释放鼠标左键完成绘制。注意：在绘制时按住 Shift 键拖动鼠标，可以绘制出正圆形。 2）绘制扇形。选择“椭圆工具”，在“属性”面板中设置“起始角度”和“结束角度” 的值，如图 1-39 所示。. 图 1-39. 椭圆工具属性面板. 使用绘制椭圆工具的方法绘制一个扇形，如图 1-40 所示。. 椭圆. 正圆图 1-40. 扇形. 用椭圆工具绘制扇形. （3）使用基本矩形工具。建立圆角矩形还可以使用基本矩形工具，具体方法如下： 1）单击工具箱中的“矩形工具组”图标，在打开的列表框中选择“基本矩形工具” 。 2）在“属性”面板中设置笔触颜色、笔触高度和笔触样式等项。 3）如图 1-41 所示，在“属性”面板中设置矩形边角半径的值。. 图 1-41. 基本矩形工具属性面板. 注意：当边角半径设为负值时，建立边角内凹的矩形；当边角半径设为正值时，建立边角外凸的矩形。 4）移动鼠标指针到舞台中，绘制出一个矩形，结果如图 1-42 所示。. 19.

(20) Flash 项目案例教程. 图 1-42. 边角半径为负值. （4）使用基本椭圆工具。 1）单击工具箱中的“矩形工具组”图标，在打开的列表框中选择基本椭圆工具。 2）在“属性”面板中设置笔触颜色、笔触高度和笔触样式等。 3）如图 1-43 所示，在“属性”面板中设置“起始角度”和“结束角度”。. 图 1-43. 基本椭圆工具属性面板. 注意：起始角度即开始绘制的角度；结束角度即沿顺时针方向椭圆半径旋转的角度值。 4）移动鼠标指针到舞台中，绘制出一个扇形。（5）使用多角星形工具。使用“多角星形工具”可以绘制多边形。绘制多边形的方法如下： 1）单击“矩形工具”图标，在打开的列表框中选择多角星形工具。 2）在“属性”面板中设置笔触颜色、笔触高度和笔触样式等。 3）单击“属性”面板的“选项”按钮，弹出如图 1-44 所示的“工具设置”对话框。. 图 1-44. 多角星形工具属性面板. 4）如图 1-45 所示，单击“样式”栏的下拉按钮，在弹出的下拉列表框中可以选择建立多边形的样式，有“多边形”和“星形”两种选择。 5）在“边数”文本框中输入多边形的边数。 6）移动鼠标指针到舞台中，按住鼠标左键并拖动可以绘制出正多边形或星形。注意：多边形“工具设置”对话框中的“星形顶点大小”文本框中可以设定起点的大小，范围为 0～1。 “铅笔工具” ：“铅笔工具”可以绘制任意形状的线条。（1）选择工具箱中的“铅笔工具”。 20.

(21) 第 1 章制作电子贺卡. （2）在“属性”面板中设置铅笔工具的笔触颜色和笔触高度。（3）如图 1-46 所示，单击工具箱下部的“铅笔模式”按钮，在打开的铅笔模式列表中选择目标模式。. 图 1-45. “工具设置”对话框. 图 1-46. 铅笔模式. （4）移动鼠标指针至舞台，按住鼠标左键并拖动，沿鼠标移动的路径产生线条。注意：在使用“铅笔工具”绘制曲线时，如果对当前绘制的曲线不满意，可以按 Ctrl+Z 组合键撤消当前操作，然后再重新绘制，直到得到满意的线条为止。在绘制时按住 Shift 键，此时无论选项栏中选项为何，所画线均为直线。图 1-46 所示的各项铅笔模式含义如下：直线化：绘制的曲线相邻节点间以直线段连接。平滑：绘制的曲线相邻两个节点间以平滑的弧线连接。墨水：绘制的曲线反映了鼠标经过的路线，节点的连接根据鼠标的运动路线可以是直线也可以是弧线。 “刷子工具” ：“刷子工具”用于绘制任意形状的矢量色块。选中“刷子工具”，工具箱下边会出现它的选项，如图 1-47 所示，“属性”面板会出现刷子工具的属性设置，如图 1-48 所示。. 锁定填充刷子模式刷子大小刷子形状图 1-47. 图 1-48. 刷子工具选项. 刷子工具“属性”面板. 21.

(22) Flash 项目案例教程. “锁定填充” ：单击“锁定填充”按钮，可以设置对渐变填充色的锁定。如果在舞台中绘制第一笔，然后单击“锁定填充”按钮，继续在编辑区绘制其他笔画时，填充颜色会根据第一笔的效果固定填充渐变色，这样每一笔都会有相同的渐变分布，而在没有锁定填充前会将填充渐变色平均分布到线条上，如图 1-49 所示。. 没有锁定填充. 锁定填充图 1-49. “锁定填充”前后效果对比. “标准绘画” ：选择该项，新画的线条将覆盖在同一图层中的原有图形上。 “颜料填充” ：选择该项，画笔填充不会覆盖线条，只覆盖没有线条的区域。 “后面绘画” ：选择该项，画笔填充只覆盖没有填充色和线条的地方。 “颜料选择” ：选择该项，画笔只对当前被选中的矢量图起作用。 “内部绘画”：选择该项，画笔填充色只对每次绘制时，鼠标按下的第一点所处区域起作用。各选项效果如图 1-50 所示。. 图 1-50. 刷子模式选项效果. 1.2.3 元件库的基本使用元件是 Flash 中一个非常重要的概念，在动画制作过程中，经常需要重复使用一些特定的动画元素，用户可以将这些元素转换为元件，这样就可以在动画中多次调用了，可以有效减小动画的文件大小，提高动画的制作效率。元件是存放在库中可被重复使用的图形、按钮或者动画。在 Flash CS3 中，元件是构成动画的基础，凡是使用 Flash 创建的一切功能，都可以通过某个或多个元件来实现。用户可以通 22.

(23) 第 1 章制作电子贺卡. 过舞台上选定的对象来创建一个元件，也可以创建一个空元件，然后在元件编辑模式下制作或导入内容。 “库”面板是放置和组织元件的地方，在编辑 Flash 文档时，常常需要在“库”面板中调用元件。“库”面板默认位于 Flash 界面的右下角，如果在界面中没有“库”面板，可通过选择“窗口”→“库”命令，或按 Ctrl+L 组合键，打开“库”面板。要使用元件时，直接把元件从库中拖入到舞台上，此时舞台上的这个对象称为该元件的一个实例。实例是指在舞台上或者嵌套在另一个元件内部的元件副本，用户可以修改它的颜色、大小和功能而不会影响元件本身。 1．元件类型在 Flash CS3 中，每个元件都具有唯一的时间轴、舞台及图层。用户在创建元件时必须首先选择元件的类型，因为元件类型将决定元件的使用方法。选择“插入”→“新建元件”命令，弹出“创建新元件”对话框，元件类型有 3 种，如图 1-51 所示。. 图 1-51. “创建新元件”对话框. （1）影片剪辑。影片剪辑是指一段完整的动画，有着相对于主时间轴独立的坐标系，能够独立播放。它可以包含一切的素材在里面，这些素材可以是交互控制按钮、声音、图符和其他影片剪辑等，还可以添加动作脚本来实现交互或制作一些特殊效果。（2）按钮。按钮用于实现交互，有时也用来制造些特殊效果，按钮元件共有 4 种状态： “弹起”、“指针经过” 、“按下”和“点击”，如图 1-52 所示。. 图 1-52. 按钮元件. （3）图形。图形与影片剪辑类似，可以作为一段动画，也可以只是创建可反复使用的图形。它拥有自己的时间轴，也可以加入其他的元件和素材，但是图形元件不具有交互性，也不能添加滤镜和声音。图形元件的时间轴和影片场景的时间轴同步运行。 2．创建元件在 Flash 动画的制作过程中要使用某个元件，首先要在库中创建该元件，创建元件主要有两种方法：一种是直接创建，即先建立一个空的图形元件，再向其中添加元素；另一种是选中当前舞台中的对象，将其转换为元件。（1）直接创建。 1）单击“插入”→“新建元件”命令，或按 Ctrl+F8 组合键，弹出“创建新元件”对话框。 23.

(24) Flash 项目案例教程. 2）在“名称”文本框中输入元件名称，在“类型”选项组中选择元件类型。 3）单击“确定”按钮，这时 Flash 会将该元件添加到库中，并切换至该元件编辑界面。在元件编辑界面中，将出现元件的名称在场景的旁边，在工作区中将出现一个“十”字形，代表该元件的中心点，如图 1-53 所示。. 图 1-53. 元件编辑界面. 1）创建元件内容，可使用绘画工具绘制、导入外部素材或拖入其他元件的实例等方法。完成元件的制作后，单击按钮，退出元件的编辑模式，返回场景 1 中。 2）要使用该元件，则直接从“库”面板中把元件拖入到舞台，形成该元件的一个实例。 3）如果要对已创建的元件进行编辑，可以在舞台上双击该实例，或在“库”面板中双击该元件，即可进入该元件的编辑界面，对元件进行编辑了。（2）将已有对象转换为元件。 1）在舞台上选择一个或多个对象，如图 1-54 所示。. 图 1-54. 选择对象. 2）选择“修改”→“转换为元件”命令，或按 F8 键或右击并选择快捷菜单中的“转换为元件”命令，弹出“转换为元件”对话框，如图 1-55 所示。. 图 1-55 24. “转换为元件”对话框.

(25) 第 1 章制作电子贺卡. 3）在“名称”文本框中输入元件名称，在“类型”选项组中选择元件类型，在“注册” 中单击选择元件的注册点（中心点）。 4）单击“确定”按钮，完成转换。这时 Flash 会将该元件添加到库中，舞台上待定的对象此时变成了该元件的一个实例。（3）将已有动画转换为元件。如果想把舞台上一段制作好的动画用到其他地方，就要将该动画转换为元件。将舞台上的动画转换为影片剪辑或图形元件，操作步骤如下： 1）按住 Shift 键不放，在时间轴的层窗口中单击要复制的所有层，即可选择这些层的所有帧。被选择的帧呈黑色显示，如图 1-56 所示。. 图 1-56. 选择所有要复制的帧. 2）在时间轴上右击，在弹出的快捷菜单中选择“复制帧”命令，复制刚才选择的这些帧。 3）选择“插入”→“新建元件”命令，在弹出的“新建元件”对话框中输入元件名称，并选择好元件类型。 4）单击“确定”按钮，这时 Flash 会将该元件添加到库中，并切换至该元件编辑界面。在图层 1 的第 1 帧上右击，从弹出的快捷菜单中选择“粘贴帧”命令。这样就将刚才复制的所有帧粘贴到该元件中了，如图 1-57 所示。. 图 1-57. 元件中粘贴所有帧 25.

(26) Flash 项目案例教程. 3．库库中除了可以放置与管理元件外，还可以把其他素材直接导入到库中进行重复使用。 1）选择“文件”→“导入”→“导入到库”命令，弹出“导入到库”对话框，从中选择需要导入的素材，如图 1-58 所示。. 图 1-58. 导入到库对话框. 2）单击“打开”按钮，素材将会直接导入到当前动画的元件库中。 3）选择库中的素材，使用鼠标直接拖入舞台中的相应位置即可使用。（1）调用其他动画的库。在制作 Flash CS3 的动画时，可以调用其他影片“库”面板中的元件，这样就不需要重复制作相同的素材，可以大大提高动画制作的效率。方法如下： 1）选择“文件”→“导入”→“打开外部库”命令，弹出“作为库打开”对话框，从中选择其他 Flash 动画影片原文件。 2）单击“打开”按钮，将打开影片的库，如图 1-59 所示。. 图 1-59 26. 其他动画的库面板.

(27) 第 1 章制作电子贺卡. （2）公用库。Flash CS3 在公用库中储存了很多元件，分别存放于“学习交互”、 “类”和 “按钮”3 个不同的库中，用户可以直接使用。选择“窗口”→“公用库”中的 3 项中的一项，可打开或关闭相应的公用库，如图 1-60 所示。. 图 1-60. 3 个公用库面板. 1.2.4 简单动画制作 1．基本概念（1）动画原理。Flash 动画，通常由几个场景组成，而一个场景则由几个图层组成，每个图层又由许多帧组成。一个帧就有一幅图片，几幅略有变化的图片连续播放，就成了一个简单动画。（2）时间轴。时间轴面板由图层面板、帧面板、播放头 3 部分组成。时间轴面板是制作动画的重要部位，用于组织文档中的资源以及控制文档内容随时间而变化，播放时间轴上的内容从而形成动画效果，如图 1-61 所示。. 图 1-61. 时间轴. （3）图层。图层分为普通图层、引导图层等。普通图层就像没有厚度的透明纸，上图层的图形可以覆盖下图层的图形。单击时间轴面板左下方的“插入图层”按钮，即可播放一. 27.

(28) Flash 项目案例教程. 个普通图层。欲调整图层的上下关系，只需要将光标置于要调整的层上，按住左键，将其拉到想要放置的位置后松开鼠标即可。（4）帧。帧是组成 Flash 动画最基本的单位，一帧即一幅画面。帧分为普通帧、关键帧和空白关键帧。 1）普通帧。在时间轴上能显示实例对象，但不能对实例对象进行编辑操作的帧。插入普通帧，可以延长图形存在的时间。普通帧在时间轴上显示为灰色填充的小方格，如图 1-62 所示。. 图 1-62. 时间轴上的帧. 2）关键帧。有关键内容的帧。用来定义动画变化、更改状态的帧，即编辑舞台上存在实例对象并可对其进行编辑的帧。关键帧是制作动画的基本元素。任何一段动画，都是在两个关键帧之间进行的。关键帧是实心的小圆点。 3）空白关键帧：空白关键帧是一张白纸，是没有包含舞台上的实例内容的关键帧，当画上新的图形或插入新的元件实例，它就变成“关键帧”了，又可以创建新的动画了。空白关键帧是空心的小圆点。插入关键帧，可以复制前一关键帧上的所有内容并进行必要的编辑；插入空白关键帧，可以编辑任何对象。用“选择工具”选中某一帧并右击，在弹出的快捷菜单中选择“插入帧” 、“插入关键帧” 或“插入空白关键帧”命令，即可分别插入一个普通帧、关键帧或空白关键帧。（5）场景。初始状态的场景只有一个，默认名是“场景 1”，通常称它为主场景。单击 “插入”→“场景”命令，即可插入一个新场景。（6）舞台。舞台，即动画播放的区域。打开 Flash 后，选择“新建”下的一种 Flash 文档进行单击，桌面上就会显示一个宽 550 像素、高 400 像素的白色舞台。如果要改变舞台的属性，单击“修改”→“文档”命令，可以在弹出的文档“属性”面板上重新设置其大小和背景色等，如图 1-63 所示。. 图 1-63. 文档“属性”面板. 2．洋葱皮工具在时间轴控制区域下方的就是“洋葱皮工具”，该工具在动画的制作和编辑过程中非常有用，利用它可同时看到多个帧的动画状态，如图 1-64 所示。 28.

(29) 第 1 章制作电子贺卡. 图 1-64. 洋葱皮工具. “洋葱皮工具”的各按钮作用如下：（1） “绘图纸外观”按钮：单击该按钮可显示游标内各帧的原始图形，如图 1-65 所示。通过拖动时间轴上的游标，还可以增加或减少同时显示的帧数量。时间轴上显示如图 1-66 所示。. 图 1-65. “绘图纸外观”效果. 图 1-66. 时间轴上的“绘图纸外观”. （2） “绘图纸边框”按钮：单击该按钮后可同时显示游标内除当前帧外的所有帧的轮廓图，如图 1-67 所示。（3） “编辑多帧”按钮：单击该按钮后可同时编辑游标范围内的所有关键帧的画面，如图 1-68 所示。. 图 1-67. “绘图纸边框”效果. 图 1-68. “编辑多帧”效果. （4）“修改标记”按钮：单击该按钮将打开如图 1-69 所示的下拉列表，在该列表单中可设置洋葱皮工具的显示范围、显示标记和固定绘图纸等。 29.

(30) Flash 项目案例教程. 图 1-69. “修改标记”菜单. 该列表中各选项的功能及含义如下：  总是显示标记：选中该选项后，无论是否使用洋葱皮工具，时间轴中都将显示游标。  锚定绘图纸：选中该选项后，时间轴上的游标将固定在当前位置，不再随播放指针的位置移动。  绘图纸 2：选中该选项后，在主场景中将只显示当前帧左右两边相邻两帧的内容。  绘图纸 5：选中该选项后，在主场景中将只显示当前帧左右两边相邻 5 帧的内容。  绘制全部：选中该选项后，在主场景中将显示整个动画中的所有内容。 3．简单动画制作简单动画主要包括逐帧动画与补间动画。（1）逐帧动画。逐帧动画又称为“帧帧动画”，它是一种简单而常见的动画形式，其原理是通过“连续的关键帧”分解动画动作，也就是说连续播放含有不同内容的帧来形成动画。 1）创建逐帧动画的几种方法。 ①用导入的静态图片建立逐帧动画。用 jpg、png 等格式的静态图片连续导入 Flash 中，就会建立一段逐帧动画。 ②绘制矢量逐帧动画。用鼠标或压感笔在场景中一帧帧地画出帧内容。 ③文字逐帧动画。用文字作帧中的元件，实现文字跳跃、旋转等特效。 ④导入序列图像。可以导入 gif 序列图像、swf 动画文件或者利用第 3 方软件（如 swish、 swift 3D 等）产生的动画序列。 2）逐帧动画实例——马走。 ①单击“文件”→“新建”命令，在弹出的对话框中选择“常规”中的“Flash 文件 ActionScript 3.0”选项后，单击“确定”按钮新建一个影片文档，在“属性”面板上默认文件大小为 550×400 像素，背景色为白色，帧频设为 12fps，如图 1-70 所示。. 图 1-70. 创建新文档. ②单击“文件”→“导入到库”命令，将需要的 10 张素材图片依次导入到库中，如图 1-71 所示。 ③双击图层 1 的名称，改为“马走”，分别在第 1、3、5、7、9、11、13、15、17、19 处插入关键帧，并在各帧处依次把库中的 10 张马走的图片拖入到舞台。时间轴效果如图 1-72 所示。 30.

(31) 第 1 章制作电子贺卡. 图 1-71. 马逐帧素材图片. 图 1-72. 逐帧动画时间轴. ④调整对象位置。选择各帧的马对象，通过调整“属性”面板上的位置坐标把其调到同一位置，如图 1-73 所示。. 图 1-73. 位图“属性”面板. ⑤单击“控制”→“测试影片”命令或按 Ctrl+Enter 组合键，观察本例 swf 文件生成的动画有无问题，如果满意，单击“文件”→“保存”命令，将文件保存成“马走.fla”并存盘。如果要导出 Flash 的播放文件，单击“文件”→“导出”→“导出影片”命令保存成“马走.swf” 文件。（2）补间动画。补间动画是在 Flash 动画中应用最多的一种动画制作模式，只需要绘制出关键帧，就能自动生成中间的补间过程，插入补间动画后两个关键帧之间的插补帧是由计算机自动运算而得到的。Flash CS3 提供了运动补间和形状补间两种补间动画。 1）运动补间动画。运动补间动画是实例属性变化过渡的一种动画，是根据两个关键帧中大小、位置、旋转、倾斜和透明度等属性的差别由 Flash 计算并自动生成的一种动画类型，通常用于表现同一图形对象的移动、放大、缩小及旋转等变化。运动补间动画首尾两帧上的对象，必须是元件实例，且必须是同一个元件的实例。除了元件，组合体或文本也可作为制作动作补间动画的对象。下面利用一个简单的实例来了解创建运动补间动画的方法和过程，操作步骤如下： ①新建一个 Flash CS3 文档，单击舞台任何地方，在下方的文档属性面板中将舞台“背景 31.

(32) Flash 项目案例教程. 颜色”设为黑色，其他选项保持默认。 ②在“颜色”面板的“类型”下拉列表框中选择“线性”渐变，渐变颜色设置为红色(255,0,0) 到白色(255,255,255)渐变，如图 1-74 所示。. 图 1-74. “颜色”设置面板. ③把工具箱中的笔触颜色设为红色。 ④绘制一个桃心。在工具箱中选择“椭圆工具” ，按住 Shift 键画出一个正圆。 ⑤选择工具箱中的“选择工具”，把鼠标光标放到圆的顶部边缘，当鼠标光标变成弧状时按住 Ctrl 键向下拖动，形成一个凹状。 ⑥选择工具箱中的“选择工具”，把鼠标光标放到圆的底部边缘，当鼠标光标变成弧状时按住 Ctrl 键向下拖动，形成一个尖底。 ⑦根据需要进行调整，绘制出一个渐变色的桃心，如图 1-75 所示。. 图 1-75. 桃心. ⑧单击工具箱中的“选择工具”，用框选法选中整个桃心，单击“修改”→“转换为元件” 命令，或右击并在弹出的快捷菜单中选择“转换为元件”命令，弹出“转换为元件”对话框，如图 1-76 所示。. 图 1-76 32. “转换为元件”对话框.

(33) 第 1 章制作电子贺卡. ⑨选择“图形”单选按钮，单击“确定”按钮，把矢量图形转换为元件，并直接放入到库中。 ⑩分别在图层上的第 10 帧和第 15 帧处添加关键帧。方法为分别右击第 10 帧与第 15 帧处，并在弹出的快捷菜单中选择“插入关键帧”命令。 ⑪单击第 10 帧，选择工具箱中的“任意变形工具”，按住 Shift 键对桃心进行等比放大。 ⑫右击 1～10 帧中的任意帧，并在弹出的快捷菜单中选择“创建补间动画”命令，或把 “属性”面板中“补间”输入框设为“动画”，如图 1-77 所示。在 1～10 帧间将产生运动补间帧，制作出运动补间动画。. 图 1-77. 补间动画属性面板. ⑬用同样的方法制作 10～15 帧的运动补间动画。制作完成后，关键帧之间会出现一个长箭头，帧的背景色变为浅紫色，如图 1-78 所示。. 图 1-78. 运动补间动画时间轴. ⑭按 Ctrl+Enter 组合键预览动画效果，如图 1-79 所示。. 图 1-79. 运动补间动画效果. ⑮单击“文件”→“保存”命令，将文件保存成“运动补间动画.fla”文件并存盘。 33.

(34) Flash 项目案例教程. 2）形状补间动画。形状动画也称形变动画，通常用于表现不同图形对象之间的自然过渡。在一个时间点（关键帧）绘制一个形状，然后在另一个时间点（关键帧）更改该形状或绘制另一个形状，Flash 根据二者之间的帧值或形状来创建中间帧。在制作形状补间动画时，需要注意其与动作补间动画正好相反，制作形变的起止对象要求一定都是形状，不能是元件、成组对象、文字对象和位图对象，所以对于在各关键帧中创建的对象，除了直接在舞台中绘制的图形外，其他的如果是使用别的元件在舞台中创建形变动画，一定要先将其打散。注意：判定形状的方法是用鼠标单击对象，若对象被点所覆盖则说明其是形状；如果该对象不是形状，则必须先选取该对象，选择“修改”→“分离”命令对其进行打散处理。制作形状渐变动画的操作步骤与运动渐变动画基本相同，只是在创建补间时选择“创建补间形状”。下面利用一个简单的实例来了解创建形状补间动画的方法和过程，操作步骤如下： ①新建一个 Flash CS3 文档，单击舞台任何地方，在下方的文档属性面板中将舞台“背景颜色”设为黑色，其他选项保持默认。 ②单击“文件”→“导入”→“打开外部库”命令，弹出“作为库打开”对话框，选择上例的“运动补间动画”，如图 1-80 所示。. 图 1-80. “作为库打开”对话框. ③单击“打开”按钮，打开“运动补间动画”文件的库，如图 1-81 所示。 ④把打开库中的元件 1 拖入舞台，放到合适的位置。 ⑤在第 20 帧处右击，在弹出的快捷菜单中选择“插入关键帧”命令。 ⑥选择第 20 帧，选择工具箱中的“文字工具” ，输入一个“爱”字，调整此字与桃心中心对齐，如图 1-82 所示。 34.

(35) 第 1 章制作电子贺卡. 图 1-81. 打开的外部库面板. 图 1-82. “爱”与“桃心”. ⑦删除 20 帧处的桃心，只剩下“爱”字。 ⑧为了让“爱”字能暂停一段时间，在第 30 帧处右击，在弹出的快捷菜单中选择“插入关键帧”命令。 ⑨在第 50 帧处右击，在弹出的快捷菜单中选择“插入空白关键帧”命令。 ⑩右击第一帧，在弹出的快捷菜单中选择“复制帧”命令，右击第 50 帧处，在弹出的快捷菜单中选择“粘贴帧”命令。 ⑪为了让桃心暂停一段时间，在第 60 帧处右键单击，在弹出的快捷菜单中选择“插入帧” 命令。 ⑫选中第一帧，单击“修改”→“分离”命令或按 Ctrl+B 组合键，打散桃心。 ⑬用同样的方法，把第 20、30 帧处的“爱”字和第 50 帧的桃心打散，如图 1-83 所示。. 图 1-83. 打散“桃心”与“爱”. ⑭右击 1～20 帧间的任意一帧，在弹出的快捷菜单中选择“创建补间形状”命令，或把属性面板中“补间”设为“形状” ，如图 1-84 所示。这样将在 1～20 帧间产生形状补间帧，制作出形状补间动画。. 图 1-84. 补间动画属性面板 35.

(36) Flash 项目案例教程. ⑮用同样的方法制作 30～50 帧间的形状补间动画。制作完成后，关键帧之间会出现一个长箭头，帧的背景色变为浅绿色，如图 1-85 所示。. 图 1-85. 形状补间动画时间轴. ⑯按 Ctrl+Enter 组合键预览动画效果，如图 1-86 所示。. 图 1-86. 形状补间动画效果. ⑰单击“文件”→“保存”命令，将文件保存成形状补间动画.fla”文件并存盘。  使用形状提示：形状补间动画看似简单，实则不然，Flash 在“计算”2 个关键帧中图形的差异时，远不如想象中的“聪明” ，尤其前后图形差异较大时，变形结果会显得乱七八糟，这时 “形状提示”功能会大大改善这一情况。  形状提示的作用：在“起始形状”和“结束形状”中添加相对应的“参考点” ，使 Flash 在计算变形过渡时依一定的规则进行，从而较有效地控制变形过程。  添加形状提示的方法：先在形状补间动画的开始帧上单击，再单击“修改”→“形状”→“添加形状提示”命令，该帧的形状就会增加一个带字母的红色圆圈，相应地，在结束帧形状中也会出现一个“提示圆圈” ，用鼠标左键单击并分别按住这两个 “提示圆圈” ，在适当位置安放，安放成功后开始帧上的“提示圆圈”变为黄色，结束帧上的“提示圆圈”变为绿色，安放不成功或不在一条曲线上时，“提示圆圈”颜色不变，如图 1-87 所示。  运动补间动画与形状补间动画的区别：运动补间动画和形状补间动画都属于补间动画。前后都各有一个起始帧和结束帧，二者之间的区别如表 1-1 所示。 36.

(37) 第 1 章制作电子贺卡. 没加形状提示. 添加形状提示后未调整位置时. 调整位置后开始帧处变黄色. 调整位置后末帧处变绿色. 图 1-87. 形状提示使用. 表 1-1 运动补间动画与形状补间动画的区别区别之处在时间轴上的表现组成元素完成的作用. 运动补间动画. 形状补间动画. 淡紫色背景加长箭头. 淡绿色背景加长箭头. 影片剪辑、图形元件、按钮. 形状，如果使用图形元件、按钮、文字，则必先打散再变形. 实现一个元件的大小、位置、颜色、实现两个形状之间的变化，或一个透明等的变化. 形状的大小、位置、颜色等的变化. 1.2.5 文字特效制作制作 Flash 动画中，不可避免地要接触到文字的编辑。在 Flash CS3 中制作文字特效的方法有许多种，其中比较常用的有空心字、彩色字和立体字等。 1．空心字（1）新建一个 Flash 文档，文档大小设置为 400×100，背景颜色设置为“黑色”，其他值保留默认，如图 1-88 所示。. 图 1-88. “文档属性”对话框设置 37.

(38) Flash 项目案例教程. （2）在工具箱中选择“文本工具”，在舞台上输入 Flash，字体属性设置如图 1-89 所示，字体选择得粗些，颜色为白色。. 图 1-89. 文本属性设置. （3）按两次 Ctrl+B 组合键将字打散成图形，如图 1-90 所示。. 按一次 Ctrl+B 后. 按两次 Ctrl+B 后图 1-90. 打散文本. （4）选择“墨水瓶工具”，打开“属性”面板，设置笔触颜色为“红色”（#FF0000），笔触高度为 3，笔触样式为“实线”，如图 1-91 所示。. 图 1-91. 墨水瓶工具属性面板. （5）逐个单击每个文字进行描边，如图 1-92 所示。（6）选择“选择工具”，按住 Shift 键，逐个单击字的填充部分，全部选中后按 Delete 键删除即可，如图 1-93 所示。. 图 1-92. 文本描边效果. 图 1-93. 空心字效果. 2．彩色字在欣赏动画时，可以发现有许多动画中的文字是绚丽多彩的。下面介绍彩色字的制作方法，操作步骤如下：（1）新建一个 Flash 文档，文档大小设置为 400×100，背景颜色设置为“黑色”，其他值保留默认。（2）在工具箱中选择“文本工具”，在舞台上输入“恭喜发财”，字体属性设置如图 1-94 所示，字体选择得粗些。（3）按两次 Ctrl+B 组合键将字打散成图形。（4）打开“颜色”面板，在“类型”下拉列表框中选择“线性”选项，并设置颜色依次为红（#FF0000）、黄（#FFFF00）、绿（#00FF00）、紫（#FF00FF），如图 1-95 所示。（5）设置好颜色后，舞台中的文字就变成设置的颜色，如图 1-96 所示。 38.

(39) 第 1 章制作电子贺卡. 图 1-94. 图 1-95. 文本及其属性设置. 颜色设置. 图 1-96. 彩色字. 3．立体字在制作 Flash 动画时，为了让动画的画面效果更具立体感，在编辑文字时也要考虑为文字添加立体效果。下面介绍立体字制作方法，操作步骤如下：（1）新建一个 Flash 文档，文档大小设置为 400×100，背景颜色设置为“黑色”，其他值保留默认。（2）在工具箱中选择“文本工具” ，在舞台上输入“春天来了” ，字体设置为“方正隶书简体”，大小为 80，颜色为绿色（#00FF00），如图 1-97 所示。（3）单击图层中的关键帧将文字选中，按住 Alt 或 Ctrl 键拖动文字将文字复制，如图 1-98 所示。. 图 1-97. 文本输入. 图 1-98. 文本复制. （4）选择原文字，在“属性”面板上的“颜色”列表框中选择紫色（#FF00FF），原文字将变成紫色。（5）使用“选择工具”将复制的文字移动到原文字的下方，完成立体字的制作，如图 1-99 所示。. 图 1-99. 立体字 39.

(40) Flash 项目案例教程. 1.3. 操作步骤. 1.3.1 贺卡主体设计新年是喜庆的，为了体现出喜庆的氛围，贺卡主体色设计为以红黄为主。贺卡由两部分组成，即开场画面和贺卡主画面，当运行电子贺卡时，首先进入开场画面，单击开场画面上的一个按钮进入贺卡主画面，并给贺卡配上了喜庆的音乐，让人看了、听了能感受到新年到来的喜悦之情。 1．开场（1）导入一幅处理好的喜庆的图片素材作为背景。（2）做一个 Happy New Year 的文字动画。（3）导入一幅处理好的小女孩放鞭炮的画面放在背景上的合适位置。（4）下方放置一个按钮，放上文字 go，当单击 go 按钮时进入贺卡主体画面。在单击 go 按钮前“Happy New Year”的文字动画循环播放。 2．贺卡主体（1）导入一幅处理好的喜庆的图片素材作为背景。（2）在顶部放置 4 个灯笼，制作 4 个灯笼到“新年快乐”4 个字的变形动画，反复播放。（3）导入处理好的一串鞭炮图片放置在左边，制作从左边画外进入的动画效果。（4）导入处理好的中国结图片放置在正中，并制作从下边画外进入的动画效果。（5）使用“文字工具”在中国结上输入一个“福”字，并制作渐入的动画效果。（6）使用“文字工具”在另一边输入一副竖放的对联“虎啸青山千里锦、风拂绿柳万家春”，使用了阴影滤镜效果，并制作从右边画外进入的动画效果。（7）导入处理好的老虎图片放置在右下边，并制作从右边画外进入的动画效果。（8）导入处理好的小老虎图片放置在左下边，并制作从左边画外进入的动画效果。在进入贺卡主体时，4 个灯笼到“新年快乐”4 个字的变形动画，反复播放。从（3）到（8）的动画依次进行播放，并且只播放一次。 3．音乐合成为了获得更好的效果，给贺卡配上喜庆的音乐。把音乐放到贺卡中进行合成，并设置为循环播放。 1.3.2 动画设计 New Year 中的每个字母都由缩放做成由大到小，由透明到不透明的淡入动画效果，然后按顺序一个一个地显示出来，最后 Happy 作为一个整体做成相同的动画效果显示出来，当动画播完后，整个文字都停留一会儿再重复播放。文字动画做好后作为影片剪辑元件放在背景图片上。 1．灯笼与文字互变动画 4 个灯笼在一定时间内同时变化为“新年快乐”4 个字，停留一会儿，又由“新年快乐” 4 个字变化为 4 个灯笼，再停留一会儿，继续变成 4 个字，就这样反复播放。 40.

(41) 第 1 章制作电子贺卡. 2．贺卡主体中的其他动画贺卡中的其他动画都是运动动画，主要通过改变素材的位置而形成的。几幅素材图片按顺序由不同的方向进入主体画面。鞭炮由左边进入，中国结由下边进入，“福”字渐入，对联从右边进入，大老虎从右边进入，小老虎从左边进入。 1.3.3 素材准备——绘制灯笼（1）新建一个文档，文件大小默认为 550×400，其他属性为默认。（2）单击“插入”→“新建元件”命令，弹出“创建新元件”对话框，选择“图形”单选按钮，并命名为“灯笼”，如图 1-100 所示，单击“确定”按钮进入“灯笼”元件编辑窗口。. 图 1-100 灯笼元件. （3）进入“颜色”面板，选择“类型”为“放射状”，设置各项颜色参数，渐变的颜色为白色到红色，如图 1-101 所示。选择工具箱中的“椭圆工具” ，设置“笔触颜色”为无，在场景中绘制出一个椭圆作为灯笼的主体，大小为 65×40 像素。（4）画灯笼上下的边，打开“颜色”面板，按照图 1-102 所示设置深黄色到浅黄色的线性渐变填充。从左到右 3 个填充色标的颜色值分别为#FF9900、#FFFF00、#FFCC00。. 图 1-101 “颜色”面板设置之一. 图 1-102 “颜色”面板设置之二. （5）选择工具箱中的“矩形工具” ，设置“笔触颜色”为无，绘制出一个矩形，大小为 30×10 像素，复制这个矩形，分别放在灯笼的上下方，再画一个小的矩形，长宽为 7×10 像素，作为灯笼上面的提手。最后用“线条工具” 在灯笼的下面画几条黄色线条作为灯笼穗，一个漂亮的灯笼就画好了，如图 1-103 所示。 41.

(42) Flash 项目案例教程. 图 1-103 画好的灯笼. 1.3.4 动画制作 1．Happy New Year 的文字动画制作 1）单击“插入”→“新建元件”命令，弹出“创建新元件”对话框，选择“影片剪辑” 单选按钮，并命名为“开场文字动画”，如图 1-104 所示，单击“确定”按钮，进入“开场文字动画”元件编辑窗口。. 图 1-104 开场文字动画元件. 2）选择“文本工具” ，文本颜色为紫红色（#330000），其他属性如图 1-105 所示。. 图 1-105 文本属性设置. 3）输入文本 New Year，如图 1-106 所示。 4）选择工具箱中的“选择工具”，右击该文本，并在弹出的快捷菜单中选择“分离”命令，或者单击“修改”→“分离”命令，打散文本，如图 1-107 所示。. 图 1-106 文本输入. 图 1-107 打散文本. 5）再次右击，在弹出的快捷菜单中选择“分散到图层”命令，如图 1-108 所示，把各字母分散到不同的层，以方便单独制作动画。 42.

(43) 第 1 章制作电子贺卡. （a）图层调整前. （b）图层调整后图 1-108 文本分散到各图层. 6）调整图层，顺序调整为从下往上“N”、“e”、“w”、 “Y”、“e”、“a”、“r”。各字母动画设计制作：每个字母从放大状态到缩小到合适大小，淡入的一个效果。各字母按顺序依次进入，每个字母动画共由 3 帧完成，第 1、3 为关键帧，中间添加补间动画；每个字母动画间间隔一帧。最后 Happy 单词作为整体制作相同的动画。（1）N 字母动画制作。 1）单击“N”层中的第一帧，选中“N”字母并右击，在弹出的快捷菜单中选择“转换为元件”命令，或单击“修改”→“转换为元件”命令，均可弹出“转换为元件”对话框，如图 1-109 所示，“名称”设为 N，选择“类型”为“图形”单选按钮。. 图 1-109 “N”转换为元件. 2）右击 N 图层中的第 3 帧，在弹出的快捷菜单中选择“插入关键帧”命令。 3）单击第一帧，选择工具箱中的“任意变形工具”，按住 Shift 键的同时对 N 字母进行等比放大，如图 1-110 所示。 4）在如图 1-112 所示的“属性”面板上的“颜色”下拉列表框中选择 Alpha，把透明度设为 0，效果如图 1-111 所示。. 图 1-110 任意变形. 图 1-111 等比放大，透明度为 0. 43.

(44) Flash 项目案例教程. 图 1-112 设置透明度. 5）右击 N 层中的第二帧，在弹出的快捷菜单中选择“创建补间动画”命令，完成 N 字母动画。（2）e 字母动画制作。选择 e 图层的第一帧，按住鼠标左键把该帧移动到第 5 帧处，然后按制作 N 字母动画的方法一样重复步骤，完成 e 字母动画的制作。 e 字母动画后间隔一帧用同样的方法制作 w 字母的动画。依此方法制作完“New Year”中各字母的动画。时间轴如图 1-113 所示。. 图 1-113 New Year 字母动画时间轴效果. （3）Happy 动画制作。 1）右击图层 1 中的 29 帧，在弹出的快捷菜单中选择“插入关键帧”命令。 2）选择“文本工具” ，设置文本大小为 66，字体为 Comic Sans MS，颜色为黄色（#FFFF00），然后在舞台上输入 Happy，如图 1-114 所示。. 图 1-114 输入文本. 3）单击工具箱中的“选择工具”，单击图层中的第 29 帧，选中 Happy 并右击，在弹出的快捷菜单中选择“转换为元件”命令，或单击“修改”→“转换为元件”命令，均可弹出“转换为元件”对话框，“名称”设为 Happy，选择“图形”单选按钮。 4）右击图一层中的第 32 帧，在弹出的快捷菜单中选择“插入关键帧”命令。 5）单击第 29 帧，选择工具箱中的“任意变形工具” ，按住 Shift 键的同时对 Happy 进行等比放大。 6）在“属性”面板上的“颜色”下拉列表框中选择 Alpha，把透明度设为 0。 7）右击图层 1 中的第 30 帧，在弹出的快捷菜单中选择“创建补间动画”命令，完成 Happy 单词动画。 44.

(45) 第 1 章制作电子贺卡. 为了让文字动画停止一会儿时间再重复播放，于是在各层的第 45 帧处插入帧延长播放时间。方法为在各层的第 45 帧处右击，在弹出的快捷菜单中选择“插入帧”命令。最后时间轴如图 1-115 所示。. 图 1-115 Happy New Year 字母动画时间轴. 2．灯笼与文字互变动画（1）新建元件，选择“影片剪辑”，命名为“新”，单击“确定”按钮，进入编辑窗口。（2）在第一帧处把制作好的灯笼元件拖入舞台中心。（3）右击第 40 帧，在弹出的快捷菜单中选择“插入关键帧”命令，使用“文字工具” 输入文字“新”，调整好其属性，把文字的中心与灯笼的中心对齐，如图 1-116 所示。. 图 1-116 调入灯笼元件与输入文本. （4）选中灯笼，按 Del 键删除，只剩下“新”字。（5）选中第一帧的灯笼，单击“修改”→“分离”命令进行打散。（6）选中 40 帧的文字，单击“修改”→“分离”命令进行打散，如图 1-117 所示。. 图 1-117 打散灯笼与文字. （7）右击两关键帧之间的任意一帧，在弹出的快捷菜单中选择“创建补间形状”命令。（8）为了让文字显示一会儿再转化为灯笼，在第 50 帧处右击，在弹出的快捷菜单中选择 “插入关键帧”命令，然后在第 90 帧处右击，在弹出的快捷菜单中选择“插入关键帧”命令。（9）选中 90 帧，按 Del 键删除文字。. 45.

(46) Flash 项目案例教程. （10）右击第一帧，在弹出的快捷菜单中选择“复制帧”命令，右击第 90 帧，在弹出的快捷菜单中选择“粘贴帧”命令，把灯笼复制到此。（11）右击 50～90 两关键帧之间的任意一帧，在弹出的快捷菜单中选择“创建补间形状” 命令。（12）为了让灯笼显示一会儿再转化为文字，在 100 帧处右击，在弹出的快捷菜单中选择“插入帧”命令。时间轴如图 1-118 所示。. 图 1-118 形状补间动画时间轴. （13）重复步骤 1）～11），用同样的方法制作“年” 、“快”、“乐”各文字与灯笼的互变动画的影片剪辑元件。 3．贺卡总体制作（1）导入处理好的贺卡所需的图片素材。单吉“文件”→“导入”→“导入到库”命令，依次导入处理好的各素材，包括开场画面背景图、小女孩放鞭炮图、贺卡主体背景图、鞭炮图、中国结、大老虎图、小老虎贺岁图到库中，并导入两首音乐，如图 1-119 所示。. 图 1-119 导入素材到库. （2）开场画面制作。 1）回到场景 1，双击图层 1，更名为“开场画面”。 2）把“开场画面背景”文件拖入到舞台中，然后把“小女孩放鞭炮”图拖入到舞台放到右下角合适位置。 3）把“开场文字动画”从库中拖入到舞台放于开场背景右上方空白处，调整好其大小。 4）插入新图层，命名为“按钮”。单击“窗口”→“公用库”→“按钮”命令，打开按 46.