网页制作教程第11章课件

1、第11章 创建Flash交互与动画发布（时间：4次课，8学时）第11章 创建Flash交互与动画发布（时间：4次课，8学教学目标： Action Script是Flash的脚本撰写语言，通过它可以为动画添加交互。当动画制作完之后，可以合成声音，并对其进行优化、输出和发布。 本章将要重点学习如何为动画添加交互、合成声音，在此基础上还将学习动画的优化与发布，通过学习希望读者掌握按钮的制作方法和Action Script行为语言的基本命令，了解动画的优化与发布设置，对Flash制作动画的整个过程有一个全面的认识。本章要点： 1、按钮 2、Action Script 3、动画控制 4、动画声音效果 5

2、、动画的测试与发布第11章 创建Flash交互与动画发布第11章 创建Flash交互与动画发布11.1 创建基本交互动画11.2 创建高级交互动画11.3 合成动画声音效果11.4 动画的发布11.5 上机实训第11章 创建Flash交互与动画发布11.1 创建基本交互动画第11章 创建Flash交互与11.1 创建基本交互动画 使用【按钮元件】按钮 可以创建用于响应鼠标单击、滑过或其他动作的交互式按钮。 可以定义与各种按钮状态关联的图形，然后将动作指定给按钮实例。11.1.1 创建按钮11.1.2 制作图形按钮11.1.3 制作文字按钮11.1.4 设定交互11.1 创建基本交互动画 使用【

3、按钮元件】按 按钮是用来控制动画中的电影片段实现交互的一种特殊的符号，可以改变动画的播放顺序，控制动画的播放时间和速度，并可以随时进行控制。在Flash中，按钮的种类主要分两种，一种是普通按钮，通过鼠标单击来实现交互；另一种是隐形按钮，隐形按钮显示不出来，它只是一个可以被响应交互的区域，可以实现一些特殊的交互效果。11.1.1 创建按钮 按钮是3种元件类型之一，它不同于其他两种类型的元件，按钮实际上是四帧的交互影片剪辑。在菜单栏中选择【插入】【新建元件】命令，在打开的对话框的【类型】选项区中点选【按钮】单选钮，单击【确定】按钮，创建一个【按钮】元件，Flash会创建一个包含四帧的时间轴，如图1

4、1-1所示。前3帧显示按钮的3种可能状态；第4帧定义按钮的活动区域。时间轴实际上并不播放，它只是对指针运动和动作做出反应，跳转到相应的帧。 按钮是用来控制动画中的电影片段实现交互的一种特 要制作一个交互式按钮，可把该按钮元件的一个实例放在舞台上，然后给该实例指定动作。 必须将动作分配给文档中按钮的实例，而不是分配给按钮时间轴中的帧。按钮元件时间轴上的每一帧都有一个特定的功能： 1、第1帧是弹起状态，代表指针没有经过按钮时该按钮的状态； 2、第2帧是指针经过状态，代表指针滑过按钮时该按钮的外观； 3、第3帧是按下状态，代表单击按钮时该按钮的外观； 4、第4帧是单击状态，定义响应鼠标单击的区域。此

5、区域在输出的动画文件中是不可见的，它是制作隐形按钮的关键。 图11-1 按钮的四帧时间轴 11.1.1 创建按钮 要制作一个交互式按钮，可把该按钮元件的一个实 下面通过一个图形按钮的创建来了解按钮的制作方法，立体图形按钮的3种状态如图11-2所示，在弹起时为红色，鼠标经过时变成绿色，按下时变成蓝色。11.1.2 制作图形按钮图11-2 图形按钮的3种状态 下面通过一个图形按钮的创建来了解按钮的制作方法，立体(1) 新建一个按钮元件，进入按钮元件的编辑状态。(2) 单击第1帧，单击工具箱中的【椭圆工具】按钮 ，在【属性】面板中设定边框颜色为“黑色”，大小为“1”，填充为“红色到黑色的放射状渐变”

6、。按键，绘制一个正圆，双击选中，单击工具栏中的【对齐】按钮 ，打开【对齐】面板。依次单击【相对于舞台】按钮 、【水平中齐】按钮 和【垂直中齐】按钮,使圆放置在舞台中央，如图11-3所示。图11-3 在舞台中央绘制一个正圆11.1.2 制作图形按钮(1) 新建一个按钮元件，进入按钮元件的编辑状态。图11-3(3) 单击工具箱中的【渐变变形工具】按钮 ，选中正圆，将渐变的中心移动到右下角，如图11-4所示。(4) 单击时间轴左下角的【插入图层】按钮 ，新建一个图层，将图层1的正圆复制、粘贴到新图层上。单击工具箱中的【任意变形工具】按钮 ，选中正圆，同时按+组合键，将图层2的正圆以中心等比例缩小，选

7、择工具箱中的【填充变形工具】按钮 ，选中小圆，将渐变的中心移动到左上角，如图11-5所示。图11-4 移动渐变中心 11.1.2 制作图形按钮图11-5 移动小圆渐变中心(3) 单击工具箱中的【渐变变形工具】按钮 ，选中正圆，将渐(5) 分别在图层1和图层2的第2帧上按键插入关键帧，分别将大圆和小圆的填充颜色改为“绿色到黑色的放射状渐变”。(6) 分别在图层1和图层2的第3帧和第4帧上按键插入关键帧，分别将第3帧中大圆和小圆的填充颜色改为“蓝色到黑色的放射状渐变”。按键同时选中图层1和图层2的第3帧，单击工具箱中的【任意变形工具】按钮 ，同时按+组合键，将按钮以中心等比例缩小，如图11-6所示

8、。(7) 单击工作区左上角的“场景1”，回到场景中。在菜单栏中选择【窗口】【库】命令，打开【库】面板，将库面板中已创建的按钮元件拖入舞台中，按+组合键即可测试按钮。11.1.2 制作图形按钮图11-6 将按钮等比例缩小图11-6 将按钮等比例缩小(5) 分别在图层1和图层2的第2帧上按键插入关键帧11.1.3 制作文字按钮图11-7 加入文字的按钮 在前面制作的图形按钮上加入文字，如图11-7所示，在鼠标经过时文字变色，再按下时文字改为“GO”。通过本实例，可以使读者在制作中进一步熟悉按钮的修改编辑方法。 11.1.3 制作文字按钮图11-7 加入文字的按钮 (1) 双击【库】面板中的按钮元件

9、，进入按钮元件的编辑状态。(2) 单击时间轴左下角的【插入图层】按钮 ，新建一个图层，单击工具箱中的【文本工具】按钮 ，在【属性】面板中设定文字大小为“16”，字体为“Arial Black”，颜色为“白色”，输入文字“PLAY”。打开 【对齐】面板，依次单击【相对于舞台】按钮 、【水平中齐】按钮 和【垂直中齐】按钮 ，使文字放置在图形元件的中间。(3) 单击新图层的第2帧，按键创建一个关键帧，将文字的颜色改为“黄色”。(4) 单击新图层的第3帧，按键创建一个关键帧，单击【文本工具】按钮 ，单击文字，将文字改为“GO”。(5) 单击工作区左上角的“场景1”，回到场景中，按+组合键即可测试加入文

10、字的图形按钮效果。 11.1.3 制作文字按钮(1) 双击【库】面板中的按钮元件，进入按钮元件的编辑状态。 Action Script作为一种脚本撰写语言，是Flash的重要功能之一，可以通过它给动画添加复杂的交互性、回放控制和数据显示等。Action Script 遵循自身的语法规则和保留关键字，并且允许使用变量存储和检索信息。ActionScript 含有一个很大的内置类库，使用户可以通过创建对象来执行许多有用的任务。用户不需要了解每个ActionScript 元素就可以开始撰写脚本，如果用户有明确的目标，则可通过简单的动作构建脚本。11.1.4 设定交互 Action Script作为一

11、种脚本撰写语言，是F(1) 在菜单栏中选择【文件】【打开】命令，打开方圆形变的动画。(2) 选中第1帧，在菜单栏中选择【窗口】【动作】命令，打开【动作-帧】面板，在面板中的下拉列表框中选择“ActionScript 1.0&2.0”选项，双击【全局函数】【时间轴控制】【stop】选项，这时“停止”行为将添加到第1帧上，如图11-8所示，在右侧的编写视窗中就会显示出标准的脚本语句。11.1.4 设定交互图11-8 【动作-帧】面板(1) 在菜单栏中选择【文件】【打开】命令，打开方圆形变的(3) 单击时间轴左下角的【插入图层】按钮 ，新建一个图层，在【库】面板的下拉列表框中选择按钮的源文件，这时就

12、可以打开按钮的【库】面板，如图11-9所示。将按钮元件拖放到舞台的右下角，这样就可以在现在的动画中使用另一个已打开动画的元件了。(4) 单击按钮，在【属性】面板中将按钮实例命名为“button”，如图11-10所示。图11-9 打开按钮的【库】面板11.1.4 设定交互图11-10 给按钮实例命名(3) 单击时间轴左下角的【插入图层】按钮 ，新建一个图层，(5) 右击带有“a”标示的第1帧，在菜单栏中选择【窗口】【动作】命令，打开【动作-帧】面板，在右侧脚本区中输入如图11-11所示语句。11.1.4 设定交互图11-11 在动作脚本区中输入语句(6) 按+组合键测试动画，动画停在第1帧。当鼠

13、标进入按钮时，按钮变色，单击按钮时播放动画。(5) 右击带有“a”标示的第1帧，在菜单栏中选择【窗口】如果要给按钮加上一个链接网址的交互行为，上述脚本应改为：function GoToURL(event:MouseEvent) var url=new URLRequest(http:/www.*.com/) navigateToURL(url)button.addEventListener(MouseEvent.MOUSE_DOWN,GoToURL)11.1.4 设定交互如果要给按钮加上一个链接网址的交互行为，上述脚本应改为：11 如果不习惯ActionScript3.0的编程方法，可以在菜单

14、栏中选择【文件】【发布设置】命令，弹出【发布设置】对话框。将【Flash】选项卡的ActionScript 版本设定为“ActionScript 2.0”，单击【确定】按钮，这样就可以直接给按钮添加语句了。给按钮添加的语句如图11-12所示。 单击按钮语句的第一行，打开【脚本助手】，如图11-13所示，按钮有8种状态，分别是鼠标按下(Press)、释放鼠标(Release)、在外部释放鼠标(ReleaseOutside)、键盘按键(KeyPress)、鼠标滑过(RollOver)、鼠标滑离(RollOut)、鼠标拖过(DragOver)和鼠标脱离(DragOut)。11.1.4 设定交互图11

15、-13 按钮的8种状态图11-12 给按钮添加的语句 如果不习惯ActionScript3.0的编程方法， 动作脚本中提供了一些诸如动作、运算符以及对象等元素，可将这些元素组织到脚本中，指示影片要执行什么操作，控制影片剪辑、按钮等。大多数动作只需要少量的编程经验，对于初学者而言并不难掌握，而有些动作可能需要对编程语言比较熟悉之后才能达到预期的效果，需要经过长期的学习和摸索才行。为了方便初学者学习，作者在发布设置中选择ActionScript 2.0版本。11.2 创建高级交互动画11.2.1 影片剪辑控制脚本11.2.2 浏览器/网络控制脚本 动作脚本中提供了一些诸如动作、运算符以及对象等元素

16、， 通过影片剪辑控制脚本可以对影片剪辑进行各种操作控制，下面以第10章讲过的“探照灯”蒙版动画为例，通过脚本使蒙版可以随鼠标任意移动，如图11-14所示。11.2.1 影片剪辑控制脚本图11-14 蒙版随鼠标移动效果 通过影片剪辑控制脚本可以对影片剪辑进行各种操作控制，(1) 在菜单栏中选择【文件】【打开】命令，打开“探照灯”动画文件。右击蒙版层，在弹出的右键快捷菜单中取消【遮罩层】选项。单击【锁】按钮 ，进行解锁。分别右击第15帧和第30帧的关键帧，在弹出的右键快捷菜单中选择【清除关键帧】命令，取消两个关键帧。在任一帧上右击，在弹出的右键快捷菜单中选择【删除补间】命令，删除蒙版层的动画，时间

17、轴如图11-15所示。(2)单击椭圆蒙版,在【属性】面板中将元件的类型改为【影片剪辑】，将实例命名为“mask”，如图11-16所示。11.2.1 影片剪辑控制脚本图11-15 删除补间之后的时间轴 图11-16 【属性】面板(1) 在菜单栏中选择【文件】【打开】命令，打开“探照灯”(4) 在图层3的名称上右击，在弹出的右键快捷菜单中选择【遮罩层】命令，使椭圆变成遮罩层。(5) 按下+组合键测试动画，拖动鼠标蒙版随之移动，鼠标始终保持在蒙版椭圆的中央，如图11-14所示。11.2.1 影片剪辑控制脚本 图11-14 蒙版随鼠标移动效果(4) 在图层3的名称上右击，在弹出的右键快捷菜单中选择【遮

18、 通过这个鼠标拖动蒙版的动画实例可以了解影片剪辑控制的基本方法，在这个动画的基础上还可以通过隐藏鼠标，创建个性化光标，如图11-18所示，这里制作一个旋转的图形动画作为光标。11.2.1 影片剪辑控制脚本 图11-18 个性化光标(1) 新建一个Flash动画文档，在工作区右上角的下拉列表框中选择【显示全部】选项。(2) 在菜单栏中选择【插入】【新建元件】命令，弹出【创建新元件】对话框，在【类型】选项区中点选【图形】单选钮，将新元件命名为“光标”，单击【确定】按钮，进入图形元件的编辑状态。使用工具箱中的【线条工具】绘制如图11-18所示的图形。 通过这个鼠标拖动蒙版的动画实例可以了解影片剪辑控

19、制的(3) 在菜单栏中选择【插入】【新建元件】命令，弹出【创建新元件】对话框，在【类型】选项区中点选【影片剪辑】单选钮，将新元件命名为“旋转光标”，单击【确定】按钮，进入影片剪辑的编辑状态。从【库】面板中将“光标”拖入舞台中央，单击第20帧，按键插入关键帧。将图形向下移动一段距离，右击中间任意一帧，在弹出的右键快捷菜单中选择中【创建补间动画】命令，在【属性】面板中设定顺时针旋转“1”次，如图11-19所示。(4) 单击“场景1”回到场景中，从【库】面板中将“旋转光标”拖入到舞台上，在【属性】面板中将实例命名为“icon”，如图11-20所示。图11-19 设定旋转 11.2.1 影片剪辑控制脚

20、本图11-20 给实例命名(3) 在菜单栏中选择【插入】【新建元件】命令，弹出【创建(5) 单击第1帧，在菜单栏中选择【窗口】【动作】，打开【动作-帧】面板，双击【ActionScript2.0类】【影片】【Mouse】【方法】【hide】选项，如图11-21所示。(6) 双击【全局函数】【影片剪辑控制】【startDrag】选项，在【目标】文本框中输入“icon”，勾选【锁定鼠标到中央】复选框，如图11-22所示设置移动光标。(7) 按+组合键测试动画,鼠标光标变成了旋转的图形光标。图11-21 【动作-帧】面板 11.2.1 影片剪辑控制脚本图11-22 设置移动光标(5) 单击第1帧，在

21、菜单栏中选择【窗口】【动作】，打开【 关于影片剪辑控制的语言还有很多，下面再来制作一个如图11-23所示的对象属性连续调整的动画，通过上、下、左、右的按钮来控制影片剪辑对象位置的变化。11.2.1 影片剪辑控制脚本 图11-23 对象属性连续调整动画 关于影片剪辑控制的语言还有很多，下面再来制作一个如图(1) 新建一个Flash动画文档，在工作区右上角的下拉列表框中选择【显示全部】选项。(2) 在工作区内右击，在弹出的右键快捷菜单中选择【网格】【显示网格】命令，如图11-24所示。舞台上就会出现网格，网格的大小可以进行编辑，右击在弹出的右键快捷菜单中选择【网格】【编辑网格】命令，弹出【网格】对

22、话框。在【网格】对话框中可以对网格的颜色横向与纵向网格的大小以及是否贴紧至网格等属性进行设定，本例中将网格横向和纵向的大小都设为“20”像素,如图11-25所示。图11-24 选择【显示网格】命令 11.2.1 影片剪辑控制脚本图11-25 【网格】对话框(1) 新建一个Flash动画文档，在工作区右上角的下拉列表(3) 单击工具箱中的【线条工具】按钮 ，设定线条颜色为灰色，沿网格的横向纵向线条进行绘制，如图11-26所示。图11-26 绘制网格 11.2.1 影片剪辑控制脚本(4) 绘制完网格之后，双击图层1的名称，将其重命名为“网格”，并进行锁定。在舞台上右击，在弹出的右键快捷菜单中选择【

23、网格】【显示网格】命令，将【显示网格】命令前的勾选去掉，将网格隐藏起来。(3) 单击工具箱中的【线条工具】按钮 ，设定线条颜色为灰色(5) 在菜单栏中选择【插入】【新建元件】命令，弹出【创建新元件】对话框。在【类型】选项区中点选【影片剪辑】单选钮，将新元件命名为“飞机”，单击【确定】按钮，进入影片剪辑元件的编辑状态。使用工具箱中的工具绘制如图11-27所示的飞机机身，并进行颜色填充，如图11-28所示。图11-27 绘制飞机机身 11.2.1 影片剪辑控制脚本图11-28 填充颜色(5) 在菜单栏中选择【插入】【新建元件】命令，弹出【创建(6) 在菜单栏中选择【插入】【新建元件】命令，弹出【创

24、建新元件】对话框。在【类型】选项区中点选【图形】单选钮，将新元件命名为“旋转”，单击【确定】按钮，进入图形元件的编辑状态。使用工具箱中的工具绘制“旋转”图形，如图11-29所示。(7)双击【库】面板中的“飞机”影片剪辑,进入“飞机”编辑状态，插入新图层，从【库】面板中将“旋转”图形拖入到飞机前端，如图11-30所示。图11-29 绘制“旋转”图形 11.2.1 影片剪辑控制脚本图11-30 将“旋转”图形拖入飞机前端(6) 在菜单栏中选择【插入】【新建元件】命令，弹出【创建(8) 插入新图层，将前端固定“旋转”的零件复制粘贴到当前位置，使用【橡皮擦工具】擦拭成如图11-31所示的第1帧。(9)

25、 将所有图层的第2帧插入关键帧，将“旋转”图形用【任意变形工具】 缩小旋转成如图11-32所示的第2帧，由此绘制出一个前端旋转的小飞机动画。图11-31 第1帧 11.2.1 影片剪辑控制脚本图11-32 第2帧(8) 插入新图层，将前端固定“旋转”的零件复制粘贴到当前位(10) 在菜单栏中选择【插入】【新建元件】命令，弹出【创建新元件】对话框。在【类型】选项区中点选【按钮】单选钮，将新元件命名为“箭头”，单击【确定】按钮，进入按钮元件的编辑状态。使用工具箱中的【矩形工具】和【选择工具】绘制箭头，分别在“指针经过”和“按下”位置插入关键帧，修改箭头颜色为“红色”和“绿色”，按钮的3个关键帧如图

26、11-33所示。图11-33 按钮的3个关键帧 11.2.1 影片剪辑控制脚本(10) 在菜单栏中选择【插入】【新建元件】命令，弹出【创(11) 单击“场景1”，回到场景中，插入新图层，将“飞机”影片剪辑拖入到舞台中央，在【属性】面板中将影片剪辑实例命名为“plane”，如图11-34所示。(12) 插入新图层，将“箭头”按钮拖入到舞台左下角，再拖入3个箭头进来，分别将其旋转、移动至如图11-35所示位置放置。图11-34 为影片剪辑实例命名 11.2.1 影片剪辑控制脚本图11-35 箭头放置位置(11) 单击“场景1”，回到场景中，插入新图层，将“飞机”(13)右击向上的箭头，在弹出的右键

27、快捷菜单中选择【动作】命令，打开【动作-按钮】面板。双击【全局函数】【影片剪辑控制】【setProperty】选项，打开【脚本助手】，在【属性】下拉列表框中选择“_y”选项，如图11-36所示，在【目标】文本框中输入“plane”，激活【值】文本框。双击左侧【全局函数】【影片剪辑控制】【getProperty】选项，输入脚本语句如图11-37所示，勾选【表达式】复选框。 11.2.1 影片剪辑控制脚本图11-36 影片剪辑的属性选项(13)右击向上的箭头，在弹出的右键快捷菜单中选择【动作】命(13)右击向上的箭头，在弹出的右键快捷菜单中选择【动作】命令，打开【动作-按钮】面板。双击【全局函数】

28、【影片剪辑控制】【setProperty】选项，打开【脚本助手】，在【属性】下拉列表框中选择“_y”选项，如图11-36所示，在【目标】文本框中输入“plane”，激活【值】文本框。双击左侧【全局函数】【影片剪辑控制】【getProperty】选项，输入脚本语句如图11-37所示，勾选【表达式】复选框。 11.2.1 影片剪辑控制脚本图11-36 影片剪辑的属性选项图11-37 输入脚本语句(13)右击向上的箭头，在弹出的右键快捷菜单中选择【动作】命(14) 同理，分别为向下、向左和向右的箭头按钮设定如下影片剪辑控制语句。向下箭头：on (release) setProperty(plane,

29、 _y, getProperty(plane,_y)+5); 向左箭头：on (release) setProperty(plane, _x, getProperty(plane,_x)-5); 向右箭头：on (release) setProperty(plane, _x, getProperty(plane,_x)+5); (15) 按+组合键进行测试，飞机动画循环播放，单击上、下、左、右箭头，飞机影片剪辑随之上、下、左、右移动。 11.2.1 影片剪辑控制脚本(14) 同理，分别为向下、向左和向右的箭头按钮设定如下影片 浏览器/网络控制脚本主要是关于整个影片的载入和导出的控制，其中FSC

30、ommand最常用，它是Flash系统用来支持它的其他应用程序(如Flash播放器或浏览器)互相传达命令的工具。通过FSCommand可以使动画全屏播放。11.2.2 浏览器/网络控制脚本 浏览器/网络控制脚本主要是关于整个影片的载入和导出11.2.2 浏览器/网络控制脚本图11-38 设定全屏播放 (1) 打开或制作完动画后，右击第1帧，在弹出的右键快捷菜单中选择【动作】命令，打开【动作-帧】面板。(2) 双击【全局函数】【浏览器/网络】【FSCommand】选项，打开【脚本助手】，在【独立播放器命令】的下拉列表框中选择“fullscreentrue/false”选项设定全屏播放，如图11-

31、38所示。11.2.2 浏览器/网络控制脚本图11-38 设定全屏11.2.2 浏览器/网络控制脚本 1、fullscreentrue/false：指定true可将Flash Player设置为全屏模式；指定false可将播放器返回到标准菜单视图。 2、allowscaletrue/false：控制影片的缩放，指定false可设置播放器始终按SWF文件的原始大小绘制SWF文件，从不进行缩放；指定true会强制将SWF文件缩放到播放器的100%大小。 3、showmenutrue/false：控制探出菜单条目，指定true可启用整个上下文菜单项集合；指定false将隐藏除【关于Flash Pla

32、yer】和【设置】外的所有上下文菜单项。 4、trapallkeystrue/false：指定true可将所有按键事件(包括快捷键)发送到Flash Player中的onClipEvent(keyDown/keyUp)处理函数。 5、exec：可以在放映文件内执行应用程序，在参数文本框中输入应用程序的路径。 6、quit：关闭播放器。11.2.2 浏览器/网络控制脚本 1、fulls Flash动画突出的特点之一就是可以合成动画的声音，Flash CS3提供了多种使用声音的方式。既可以使声音独立于时间轴连续播放，又可以使用时间轴将动画与音轨保持同步。不仅如此，还可以向按钮添加声音使按钮具有更强

33、的互动性，制作声音淡入淡出等特殊音效。 Flash中有两种声音类型：事件声音和音频流。事件声音必须完全下载后才能开始播放，除非明确停止，否则它将一直连续播放。音频流在前几帧下载了足够的数据后就开始播放，音频流要与时间轴同步以便在网站上播放。11.3 合成动画声音效果11.3.1 导入声音11.3.2 编辑声音11.3.3 压缩声音 Flash动画突出的特点之一就是可以合成动画的声音， 在Flash中是无法创建声音的，只能通过导入的方式添加。Flash支持的声音文件格式有很多，常用的有“*.wav”和“*.mp3”两种格式，导入声音的操作步骤如下。 (1) 在菜单栏中选择【文件】【导入】【导入到

34、舞台】命令，弹出【导入】对话框，如图11-39所示。11.3.1 导入声音图11-39 【导入】对话框 在Flash中是无法创建声音的，只能通过导入的方式添(2) 找到需要导入的声音文件，单击【打开】按钮，声音文件就自动以元件的形式导入到【库】面板中。(3) 从【库】面板中将声音拖放到舞台上，插入适当长度的帧即可，当声音文件被导入并拖放到舞台上之后，会以数字方式显示在时间轴上，如图11-40所示。11.3.1 导入声音图11-40 声音的时间轴 (2) 找到需要导入的声音文件，单击【打开】按钮，声音文件就 当选中声音文件所在图层的任意帧后，在声音【属性】面板中会出现声音文件的相关属性设置，如图

35、11-41所示。11.3.2 编辑声音图11-41 声音【属性】面板 当选中声音文件所在图层的任意帧后，在声音【属性】面板 1. 声音效果 在声音【属性】面板的【效果】下拉列表框中可以对声音的效果进行设置，如图11-42所示。其各选项的意义简单介绍如下。 无：不对声音文件应用效果。选择此选项将删除以前应用的声音效果。左声道/右声道：只在左声道或右声道中播放声音。从左到右淡出/从右到左淡出：会将声音从一个声道切换到另一个声道。淡入：随着声音的播放逐渐增加音量。淡出：随着声音的播放逐渐减小音量。自定义：允许使用“编辑封套”创建 自定义的声音淡入和淡出点。11.3.2 编辑声音 图11-42 声音效

36、果的设置 1. 声音效果11.3.2 编辑声音 图11-42 选择其中的【自定义】选项或单击【编辑】按钮，将会弹出声音【编辑封套】对话框，如图11-43所示。11.3.2 编辑声音图11-43 声音【编辑封套】对话框 选择其中的【自定义】选项或单击【编辑】按钮，将会弹出(1) 上下视窗分别对应的是左、右声道，白色区域为声音播放的有效范围，两个视窗中间有时间标尺，用户可以通过左右拖动时间标尺中的滑块来调整声音的起始点和终止点，如图11-44所示。11.3.2 编辑声音 图11-44 调整声音的起始、终止点(1) 上下视窗分别对应的是左、右声道，白色区域为声音播放的(2) 视窗上方的横线可调节声音

37、幅度，横线上的小方块是【可调节手柄】。鼠标直接拖动【可调节手柄】可以调整声音幅度的大小，还可在横线的任意位置直接单击添加【可调节手柄】，或将【可调节手柄】拖到视窗外进行删除，【可调节手柄】最多可添加8个，如图11-45所示。11.3.2 编辑声音 图11-45 可调节手柄(2) 视窗上方的横线可调节声音幅度，横线上的小方块是【可调2. 声音同步声音【属性】面板的【同步】下拉列表框中各选项的意义简单介绍如下。 事件：指将声音和一个事件的发生过程同步起来。事件声音(例如，用户单击按钮时播放的声音)在显示其起始关键帧时开始播放，并独立于时间轴完整播放，即使SWF文件停止播放也会继续。开始：与【事件】

38、选项的功能相近，但是如果声音已经在播放，则新声音实例就不会播放。停止：使指定的声音静音。流：采用边下载边播放的流媒体技术，声音的信息平均分配在它所需要的帧中。这样可以使动画与音频流同步，以便在网站上播放，与事件声音不同，音频流随着 SWF 文件的停止而停止。而且，音频流的播放时间绝对不会比帧的播放时间长。11.3.2 编辑声音 2. 声音同步11.3.2 编辑声音 3. 声音循环 声音的循环设定既可以声音【属性】面板中【同步】右侧的第2个下拉列表框中选择【重复】选项，并在其后的文本框中输入需要的次数，也可以直接选择其中的【循环】选项，声音将会不断地循环播放。11.3.2 编辑声音 3. 声音循

39、环11.3.2 编辑声音 由于网速的限制，为了使Flash动画更加流畅地运行，就要对声音进行适当地压缩，以减少动画的数据量。双击【库】面板中的声音图标，打开如图11-46所示的【声音属性】对话框。11.3.3 压缩声音 图11-46 【声音属性】对话框 由于网速的限制，为了使Flash动画更加流畅地运行， 在【压缩】下拉列表框中有4个选项，分别简单介绍如下。ADPCM：用于设置8位或16位声音数据的压缩设置，最适合压缩短小、简单的声音文件，比如按钮、打字等声音效果。选择此选项，会出现如图11-47所示的附加选项。其中【预处理】可以将立体声转换为单声道，由此可以减小声音的文件量。【采样率】可以控

40、制声音的保真度和文件大小。较低的采样率可以减小文件大小，但同时也会降低声音品质。默认状态下，系统推荐使用22kHz，此时的采样率是标准CD的一半。【ADPCM位】是指声音文件在导出时的采样位数。位数越小，声音文件损失越严重。默认状态下，系统推荐使用4位。11.3.3 压缩声音 图11-47 ADPCM附加选项 在【压缩】下拉列表框中有4个选项，分别简单介绍如下。 MP3：最适合压缩较长的声音文件，当导出乐曲之类较长的音频流时，一般选择【MP3】选项。选择该选项会出现如图11-48所示的附加选项。【比特率】决定导出的声音文件中每秒播放的位数。Flash支持8kbps到160kbps。当导出音乐时

41、，一般需要设定在16kbps以上，以获得最佳效果。【品质】确定压缩速度和声音质量，品质越高压缩速度越慢，但声音质量越好。11.3.3 压缩声音 图11-48 MP3附加选项 原始：此选项是指在导出声音时不进行压缩，附加选项与上述相似。 语音：此选项比较适合导出特殊的语音效果，只有【采样率】一个选项。 MP3：最适合压缩较长的声音文件，当导出乐曲之类较长的音11.4 动画的发布11.4.1 动画的测试与优化11.4.2 动画的发布与导出 当动画制作好之后，就要将其进行优化与发布，使其成为可以通过相应的浏览工具观看和欣赏的动画作品。11.4 动画的发布11.4.1 动画的测试与优化 11.4.1

42、动画的测试与优化 在菜单栏中选择【控制】【测试影片】命令，或按+组合键，就可以对动画进行测试，以验证应用程序是否按预期工作，查找并修复所遇到的错误。在整个制作过程中应不断测试应用程序。当文件已经保存之后，再进行测试，会自动在同一目录下生成一个“*.swf”文件。这个文件可以直接在Flash的播放器中播放，也可以在IE的浏览器中播放，在互联网中它以数据流的方式进行传输，边浏览边下载，这是互联网中最普及和常见的动画文件格式。 为了在保证动画质量的基础上减少动画的数据量，应尽量优化动画影片，多使用元件，多使用渐变动画，少引入位图。优化线条、声音、文本和颜色等，使整个动画作品更加流畅地在网上进行传输。

43、11.4.1 动画的测试与优化 在菜单栏中选11.4.2 动画的发布与导出 在Flash中，用户可以将后缀名为“.fla”的源文件发布成可以在网上传输和浏览的格式，也可以将其导出成图形图像文件或动画及视频文件。1. 发布Flash网页 发布Flash网页是将Flash动画发布成网页的HTML文件，此方法为不是很熟悉HTML语言的动画设计人员提供了方便，在菜单栏中选择【文件】【发布设置】命令，弹出【发布设置】对话框，在此对话框中有3个选项卡，分别是【格式】、【Flash】和【HTML】选项卡。11.4.2 动画的发布与导出 在Flash11.4.2 动画的发布与导出 (1) 【格式】选项卡如图1

44、1-49所示。在其中可以选择发布的文件格式，文件名称以及文件存放的路径。在【类型】选项区中有以下复选框可供勾选。图11-49 【格式】选项卡 11.4.2 动画的发布与导出 (1) 【格11.4.2 动画的发布与导出 (2) 【Flash】选项卡如图11-50所示，可以进行以下参数的设置。图11-50 【Flash】选项卡11.4.2 动画的发布与导出 (2) 【F11.4.2 动画的发布与导出 (3) 【HTML】选项卡如图11-51所示，可以进行以下参数的设置。图11-51 【HTML】选项卡11.4.2 动画的发布与导出 (3) 【H11.4.2 动画的发布与导出 2. 导出影片 导出影

45、片就是将Flash动画打包导出成FlashPlayer格式(.swf)，在菜单栏中选择【文件】【导出】【导出影片】命令，弹出【导出影片】对话框，如图11-52所示。在此对话框中为动画命名，确定文件格式，选择所存放的位置，设置完毕单击【保存】按钮，将打开【导出Flash Player】对话框。此对话框与【发布设置】中的【Flash】选项卡相似，设置完毕单击【确定】按钮即可。图11-52 【导出影片】对话框11.4.2 动画的发布与导出 2. 导出影11.4.2 动画的发布与导出 3. 导出图像 Flash动画可以输出成为位图图像的文件格式，在菜单栏中选择【文件】【导出】【导出图像】命令，弹出【导

46、出图像】对话框，可以选择导出图像的名称、类型以及存放的路径，保存类型有很多，如图11-53所示为导出图像的【保存】类型下拉列表框。类型中Flash 影片(*.swf)是Flash打包的动画文件格式，Windows AVI(*.avi)和QuickTime(*.mov)是视频文件格式，WAV音频(*.wav)是音频文件格式，其余都是各种图像文件格式。图11-53 导出图像的【保存】类型下拉列表框11.4.2 动画的发布与导出 3. 导出图11.5 上机实训1. 实训目的 通过制作一个鼠标经过时出现“漫天飞雪”的动画效果如图11-54所示，进一步熟悉绘图工具的使用技巧，明确元件的3种类型，掌握动画

47、交互的基本制作方法以及合成输出的设定。 图11-54 “漫天飞雪”动画效果11.5 上机实训1. 实训目的 通过制作一个2. 实训步骤(1) 新建一个Flash动画文档，在工作区右上角的下拉列表框中选择【显示全部】选项。(2) 单击工具箱中的【矩形工具】按钮 ，在【属性】面板中设定边框颜色为【无】，填充为“蓝色到黑色的放射状渐变”。在舞台上绘制一个矩形，单击工具栏中的【对齐】按钮 ，打开【对齐】面板，依次单击【相对于舞台】按钮 、【匹配宽度】 、【匹配高度】按钮 、【水平中齐】按钮 和【垂直中齐】按钮 ，使矩形充满舞台作为背景。(3) 在菜单栏中选择【插入】【新建元件】命令，在弹出的【新建新元件】对话框中命名元件的名称为“雪花”，在【类型】选项区中点选【图形】单选钮，单击【确定】按钮进入到元件的编辑状态。11.5 上机实训2. 实训步骤(1) 新建一个Flash动画文档，在工作区右2. 实训步骤(4) 单击【椭圆工具】按钮 ，在【属性】面板中设定边框颜色为【无】，填充除白色外的任意颜色。按住键，在舞台上绘制一个正圆，再单击【矩形工具】按钮 ，在正圆的下方绘制一个长方形，如图11-55(a)所示。使用【选择工具】 移动光标到图形左侧，当出现弧形标志时向内拖动，右侧与左侧对称拖动，如图11-55(b)所示。选中图