第七模块 多媒体与脚本交互Flash cs5 动画制作案例教程多媒体与脚本交互案例18 月光女神——应用声音与视频案例描述制作如图7
-1所示的动画短片。首先配合莎拉?布莱曼的动画相册播放她的一段歌曲,然后播放她的一段MV视频。 图7-1“月光女神”动画效果案例
分析使用导入的图片,用添加预设动画的方法,制作动画相册。声音并添加到舞台,作为相册的背景音乐。使用Adobe Media Enco
der转换视频格式,然后以“使用回放组件加载外部视频”的方式导入视频,添加到舞台播放。操作步骤1.新建FLASH文档，按【Ctrl
+S】保存文件，命名为“月光女神.fla”。2.设置文档属性的大小为：800×600像素。单击菜单“文件→导入→导入到库”，导入素
材库中的图片“01.jpg”至：“05.jpg”。将“图层1”重命名为“背景”，把库中的“05.jpg”拖放到舞台作为背景。3.在
“背景”层之上新建图层，命名为“文本”。输入文本“Sarah Brightman”，放置在舞台的左上角，设置文本的字符属性为，系列
：Edwardian Script ITC，大小：78，颜色：#FFFFFF。将素材“布莱曼.doc”的内容“复制→粘贴”到舞台，
置于舞台左下角，设置文本的字符属性为，系列：宋体，大小：18，颜色：#FFFFFF。此时的舞台效果如图7-2所示。图7-2 添加背
景与文字后的舞台效果4.新建影片剪辑元件，命名为“相册”。打开“库”面板，将“01.jpg”拖放到舞台，然后设置图片在舞台的位置属
性为，X：-250，Y：-300。选择舞台上的图片，打开“动画预设”面板，选择默认预设下的“从左边模糊飞入”，然后单击“应用”按钮
。在弹出的如图7-3所示“转换为元件”对话框中，单击“确定”按钮，FLASH自动创建一段15帧的补间动画。在第50帧位置插入帧，把
这段动画的长度扩展为50帧。效果如图7-4所示。图7-3将项目转换为元件对话框 图7-4
添加预设动画效果5.在第51帧位置插入空白关键帧，将库中的“02.jpg”拖放到舞台，重复以上的操作，创建一段50帧长度的补间动画
。以此类推，把库中的“03.jpg”、“04.jpg”分别拖放到舞台，添加预设动画。6.在“场景1”的“文本”层之上创建图层，命名
为“动画”。把库中的“相册”拖放到舞台，使用“任意变形工具”调整大小，使用“3D旋转工具”设置Y轴的值为：-8，放置在舞台左侧。效
果如图7-5所示。图7-5 添加“相册”实例到主时间轴的效果7. 单击菜单“文件→导入→导入到库”，导入素材库中的声音文件“斯卡布
洛市集.mp3”。在“动画”层之上创建图层，命名为“声音”。选择“声音”层的第1帧，在属性面板中设置“声音”属性为，名称：斯卡布洛
市集.mp3；效果：淡入；同步：事件，如图7-6所示。图7-6 设置“声音”属性8.单击“效果”右侧的“编辑声音封套”按钮 ，打开
如图7-7所示的“编辑封套”对话框。按下对话框右下角的“帧”按钮 ，然后把下方的水平滚动条滑块拖到最右端。这时，可以看到所选声音的
长度为902帧。单击“确定”关闭对话框。在4个图层的第902帧位置都插入帧，时间轴效果如图7-8所示。图7-7 “编辑封套”对话框
图7-8添加声音的时间轴效果9.新建影片剪辑，命名为“视频”。单击菜单“文件→导入→导入视频”
，打开如图7-9所示的对话框。单击“浏览”按钮，在“打开”对话框中选择视频素材“It''s a beautiful day.wmv”
，然后单击“打开”按钮。这时弹出如图7-10所示的建议转换格式对话框（因FLASH不支持所选视频格式）。图7-9 “导入视频”对话
框 7-10 建议转换格式对话框10. 单击对话框的“确定”按钮关闭它，然后单击“导入视频”
对话框上的“启动Adobe Media Encoder”按钮。在启动的Adobe Media Encoder（AME）窗口中单击“
添加”按钮，在弹出的“打开”对话框中选择要转换的视频素材，然后单击“打开”按钮，素材被添加到待转换窗口，如图7-11所示。图7-1
1 Adobe Media Encoder程序窗口11.单击AME窗口中的“设置”按钮，弹出“导出设置”窗口，在其中设置“格式”为
“FLV︱F4V”。按下窗口左上角的“裁剪输出视频”按钮 ，在预览图中把视频上下的黑色框裁掉。如图7-12所示。图7-12 “导出
设置”对话框12. 记下对话框中标示的视频长度：46秒11帧，作为后续在时间轴插入帧的依据。单击“确定”按钮关闭“导出设置”对话框
，单击AME主界面中的“开始队列”按钮开始转换视频格式，转换完成后关闭AME程序。在如图7-9所示的“导入视频”对话框，再次单击“
浏览”按钮，打开已转换格式的视频“It''s a beautiful day.f4v”，选中“使用回放组件加载外部视频”单选按钮，然
后单击“下一步”按钮，打开导入视频的“外观”对话框，如图7-13所示。图7-13 “外观”对话框13. 使用默认的设置，单击“下一
步”,然后再单击“完成”按钮完成视频导入。返回“场景1”，在“声音”层之上新建图层，命名为“视频”。在“背景”、“文本”、“视频”
3个图层的第2017帧位置插入帧（视频长度×帧频＋已有帧数）。把“视频”层的第903帧转换为空白关键帧并选中该帧，把库中的“视频”
元件拖放到舞台，使用“任意变形工具”调整大小，使用“3D旋转工具”视频实例，在“变形”面板中设置Y轴的值为：-8，放置在舞台左侧。
效果如图7-14所示。图7-14 添加视频效果14. 按【Ctrl+S】保存文件，然后按【Ctrl+Enter】测试影片，播放效果
如图7-1所示。7.1 应用声音Flash CS5提供了多种使用声音的方式，可独立于时间轴连续播放，也可以与动画同步播放。还可以为
按钮添加声音，使按钮具有更强的互动性。可以将ASND、WAV、MP3格式的声音文件导入到 FLASH，如果系统上安装了QuickT
ime 4或更高版本，则可以导入AIFF、只有声音的QuickTime影片、Sun AU格式文件。1．把声音导入FLASH只有把外
部的声音文件导入到FLASH中，才能在FLASH作品中加入声音效果。选择“文件→导入→导入到库”，在“导入”对话框中，定位并打开所
需的声音文件。如图7-15所示。导入声音后，就可以在“库”面板中看到刚导入的声音文件，并像应用其它元件一样使用声音对象，按下波形右
侧的“播放”按钮 可以试听声音，如图7-16所示。图7-15 导入声音 图7-16
库中的声音文件2. 添加声音到时间轴选定图层后，将声音从库面板中拖到舞台，声音就被添加到当前层。添加了声音的图层第一帧会有一条短线
，如图7-17所示。选择后面的某一帧，按【F5】插入帧，就可以看到更多的声音波形，如图7-18所示。图7-17 第1帧上的声音
图7-18 图层上的声音波形3. 设置声音的属性通过设置声音属性，可以丰富声音的效果，更
好地适应动画播放的需要。（1）在时间轴上，选择包含声音文件的第一个帧,打开“属性”面板。如图7-19所示。（2）在“属性”面板中，
从“名称”弹出菜单中选择声音文件。选择一个声音，就可以把它添加到时间轴。选择“无”，不添加声音，或删除所选帧上已经存在声音。如图7
-20所示。图7-19 声音属性面板 图7-20 选择声音（3）从“效果”弹出菜单中选择效果
选项。如图7-21所示。图7-21 设置声音效果（4）从“同步”弹出菜单中选择同步方式，如图7-22所示。各选项含义如下：?事件：
FLASH会将声音和一个事件的发生过程同步起来，例如单击按钮。从声音的起始关键帧开始播放，并独立于时间轴完整播放。即使SWF文件在
声音播放完之前停止，声音也会继续播放到完成。?开始：与“事件”选项的功能相近，但是如果声音已经在播放，则不会播放新声音。?停止：使
指定的声音静音。?数据流：FLASH强制动画和音频流同步。音频流随着SWF文件的停止而停止，而且音频流的播放时间绝对不会比帧的播放
时间长。? 选择“重复”，在右侧输入一个值，可以指定声音循环的次数；选择“循环”可以连续重复播放声音，如图7-23所示。不建
议循环播放数据流，如果将数据流设为循环播放，帧就会添加到文件中，文件的大小就会根据声音循环播放的次数而倍增。图7-22 “同步”选
项 图7-23 “重复”选项4. 为按钮添加声音（1）双击要添加声音效果的按钮，进入按钮编辑状态。
（2）在按钮的时间轴上，添加一个声音层。（3）在声音层中需要添加声音的状态帧上创建一个关键帧。例如，要添加一段单击按钮时播放的声音
，可以在标记为“按下”的帧中创建关键帧。（4）单击已创建的关键帧。从“属性”面板的“声音”弹出菜单中选择一个声音文件；从“同步”弹
出菜单中选择“事件”。为按钮添加声音的编辑效果如图7-24所示。图7-24为按钮添加声音的编辑效果5. 用“编辑封套”自定义声音效
果选择包含声音的帧，然后打开“属性”面板，单击“效果”右侧的“编辑声音封套”按钮 ，或选择“效果”列表中的“自定义”，即可打开如图
7-25所示的“编辑封套”对话框。上下窗格分别对应左、右声道，波形上方的封套线，标示音量大小。图7-25 “编辑封套”对话框若要改
变声音的起始点和终止点，可拖动“编辑封套”中的“开始时间”和“停止时间”控件。如图7-26所示为调整声音的开始时间。若要更改音量，
可拖动封套手柄来改变不同点处的音量级别。封套线显示声音播放时的音量。单击封套线，可创建其它封套手柄。要删除封套手柄，可将其拖出窗口
。如图7-27所示为调整左声道的封套。图7-26 调整声音的开始时间 图7-27 调整左声道
的封套若要改变窗口中显示声音的多少，可单击“放大” 或“缩小” 按钮。要在秒和帧之间切换时间单位，可单击“秒” 或“帧” 按钮。6
. 压缩声音如果声音文件已经在外部编辑过，可单击“更新”按钮更新。可以从“默认、ADPCM、MP3、 原始、 语音”中选择一种压缩
方式。如图7-29所示。图7-28 “声音属性”面板 图7-29 压缩方式选项7.2
应用视频1. 使用Adobe Media Encoder（1）转换视频文件 ① 启动Adobe Media Encoder CS5
。开始屏幕窗口中会列出添加到Adobe Media Encoder中以进行处理的所有当前视频文件，如图7-11所示。② 选择“文件
→添加”或者单击右边的“添加”按钮。③ 在打开的对话框中选择要转换的视频文件，然后单击“打开”按钮。选中的文件被添加到列表中，如果
在2分钟内没进行任何操作，将自动开始编码。④ 单击“格式”下拉列表，选择“FLV︱F4V”，如图7-30所示。图7-30 设置格式
⑤ 单击“预设”下拉列表，选择合适的视频格式，如图7-31所示。图7-31 选择预设格式⑥ 单击“输出文件”下方的文件路径，将弹出
“另存为”对话框，设置文件的保存路径和文件名，然后单击“保存”按钮。⑦ 单击“开始队列”按钮。Adobe Media Encode
r开始编码，同时会显示进度和视频预览。（2）裁剪输出视频单击开始屏幕窗口的“设置”按钮，打开如图7-12所示的“导出设置”对话框。
单击左上角的“裁剪输出视频”工具 ，在视频预览窗口上会出现裁剪方框，可以对视频进行裁剪。向里拖动各条边可以调整裁剪尺寸，方框外面灰
色的部分将被丢弃，如图7-32所示。如果想使裁剪方框保持标准的比例，可以单击“裁剪比例”菜单，选择想要的比例，如图7-33所示。
图7-32 裁切视频 图7-33设置裁切比例单击“输出”选项卡，可以查看
裁剪的效果，如图7-34所示。通过“更改输出尺寸”下拉菜单，可以设置最终输出文件中的裁剪效果，如图7-35所示。 图7-34 查看
裁剪效果 图7-35 设置裁剪的最终输出效果（3）调整视频长度可以通过剪除不需要的视
频片断来调整视频的长度。操作方法如下：将播放头置于要保留部分的开始处，然后单击“设置入点”按钮，如图7-36所示。将播放头置于要结
束的位置，然后单击“设置出点”按钮，如图7-37所示。也可以只拖动“入点”和“出点”按钮来括住想要的视频片断。 图7-36 设置入
点 图7-37 设置出点2. 导入视频的方式“导入视频”对话框提供了三个
视频导入选项，如图7-9所示。（1）使用回放组件加载外部视频：导入视频并创建FLVPlayback组件的实例以控制视频回放。可以将
外部FLV︱F4V文件加载到SWF文件中，并在运行时回放。视频内容独立于其它FLASH内容和视频回放控件，因此更新视频内容相对容易
，可以不必重新发布SWF文件。在播放时，可以边下载边播放，适合导入较长的视频文件。（用法可参考案例18的步骤9-13）。（2）在S
WF中嵌入FLV并在时间轴中播放：将FLV嵌入到FLASH文档中。这样导入视频时，嵌入的视频文件放置于时间轴中，成为FLASH文档
的一部分。由于每个视频帧都由时间轴中的一个帧表示，因此视频剪辑和SWF文件的帧速率必须相同，否则视频回放将不一致。若要播放嵌入在S
WF文件中的视频，必须先下载整个视频文件，然后再开始播放该视频，因此，嵌入视频适合较短的视频文件。对于回放时间少于10秒的视频剪辑
，嵌入的效果最好。（3）作为捆绑在SWF中的移动设备视频导入：与在FLASH文档中嵌入视频类似，将视频绑定到FLASH Lite文
档中以部署到移动设备。3. 在FLASH文件内嵌入视频（1）选择“文件→导入→导入视频”打开“导入视频”对话框。如图7-9所示。（
2）通过“浏览”按钮，选择本地计算机上要导入的视频剪辑。如果视频不是FLASH可以播放的格式，则会提醒用户，可以先使用Adobe
Media Encoder转换视频格式。（3）选择“在SWF中嵌入FLV并在时间轴上播放”，单击“下一步”按钮。（4）选择用于将视
频嵌入到SWF文件的“符号类型”，如图7-38所示。图7-38 选择符号类型（5）单击“下一步”，然后单击“完成”按钮。如果嵌入视
频的源文件后来被重新编辑，可以在库面板中选择视频剪辑，然后选择“属性”并单击“更新”，即会用编辑过的文件更新嵌入的视频剪辑。初次导
入该视频时选择的压缩设置，会重新应用到更新的剪辑。如图7-39所示。图7-39 更新嵌入的视频案例19 星际迷航——脚本交互案例
描述制作如图7-40所示的飞船在太空航行的动画，使用脚本制作文字的淡入效果，通过单击可以隐藏文字，通过键盘方向键控制飞船航向，单击
按钮可以开启飞船的闪光效果。图7-40“星际迷航”动画效果案例分析使用补间动画制作移动的星空，作为动画的背景。使用“代码片断”控制
文字的出现、隐藏以及飞船的航向。通过编辑“代码片断”，实现用按钮控制片剪辑实例播放的交互功能。操作步骤1.新建FLASH文档，按【
Ctrl+S】保存文件，命名为“星际迷航.fla”。设置舞台背景颜色为：#012022。2. 新建影片剪辑元件,命名为“背景”。单
击菜单“文件→导入→导入到舞台”，导入图片“背景.jpg”。将舞台上的图片转换为图形元件，设置其大小属性为，宽：550，高：400
。打开“对齐”面板，选中“与舞台对齐”复选框，然后分别单击“水平中齐” 与“垂直中齐” 按钮。在第480帧位置插入帧，将播放头移至
第480帧，在舞台图片上右击，选择“创建补间动画”命令，设置图片大小为，宽：1600，高：1200。打开“对齐”面板，把它与舞台中
心对齐。3. 新建影片剪辑元件,命名为“飞行器”。单击菜单“文件→导入→导入到舞台”，导入图片“飞行器.png”。用导入的图片创建
补间动画，在第1帧为图片添加“发光”滤镜，设置“模糊”和“强度”属性均为：0，“颜色”为：#FFFFFF。设置第25帧的“发光”滤
镜属性为，模糊X：54，模糊Y：54，强度：230，颜色：#FFFFFF。效果如图7-41所示。图7-41 “发光”补间效果4.
把播放头放在第1帧位置，单击“代码片断”按钮 ，打开“代码片断”面板，单击展开“时间轴导航”分类，如图7-42所示。双击“在此帧处
停止”选项，打开如图7-43所示的“动作”面板。在面板中，新添加的脚本会高亮显示。这时时间轴自动创建了一个新图层：Actions，
包含脚本的帧上出现一个“a”字，如图7-44所示。 图7-42“代码片断”面板 图7-4
3 “动作-帧”面板图7-44 添加了脚本的时间轴5. 单击“场景1”返回主时间轴，重命名“图层1”为“背景”，把库中的“背景”影
片剪辑拖放到舞台。新建图层，命名为“飞行器”，把库中的“飞行器”影片剪辑拖放到舞台，用“任意变形工具”适当缩小“飞行器”。新建TL
F文本,输入如图7-45所示的说明文字，设置文本属性为，系列：宋体，大小：21，颜色：#FFFFFF。舞台布局效果如图7-46所示
。 图7-45 说明文字 图7-46舞台布局效果6. 单击“操作说明”文本，打开
“属性”对话框，在“实例名称”文本框中输入“tip”，如图7-47所示。用相同的方法命名“飞行器”的实例名称为“f01”。选择“操
作说明”文本，打开“代码片断”面板，双击“动画”分类中的“淡入影片剪辑”；再次选择“操作说明”文本，然后双击“动作”分类中的“单击
以隐藏对象”。选择“飞行器”实例，打开“代码片断”面板，双击“动画”分类中的“用键盘箭头移动”。图7-47 为实例命名7. 新建图
层，命名为“按钮”，从公用库中拖放一个按钮到舞台。双击按钮进入按钮编辑界面，新建图层，在“指针经过”帧插入关键帧，使用文本工具创建
文本“开启飞行器闪光”。按钮编辑效果如图7-48所示。图7-48 按钮编辑效果8. 返回“场景1”，选择按钮，设置实例名为“b01
”，打开“代码片断”面板，双击“事件处理函数”分类中的“Mouse Click事件”。选择“飞行器”实例，打开“代码片断”面板，然
后再双击“动作”分类中的“播放影片剪辑”。按【F9】打开“动作”面板，在如图7-49所示的“播放影片剪辑”代码段剪切“f01.pl
ay();”粘贴到如图7-50所示“Mouse Click 事件”代码段，覆盖掉“trace("已单击鼠标");”。编辑后的代码段
如图7-51所示。图7-49 “播放影片剪辑”代码段 图7-50 “Mouse Click事件”代
码段图7-51 编辑后的代码段9. 按【Ctrl+S】保存文件，然后按【Ctrl+Enter】测试影片，播放效果如图8-1所示。8
.1 ActionScript 3.01．“动作”面板“动作”面板是用FLASH提供的专门处理动作脚本的编辑环境。选择菜单“窗口→
动作”或按【F9】，即可打开“动作”面板。通过“动作”面板可以快速访问ActionScript的核心元素，面板还提供了不同的工具，
用于帮助编写、调试、格式化、编辑和查找代码。如图7-52所示。图7-52“动作”面板要添加脚本，既可以直接输入代码，也可以借助面板
上提供的工具。单击动作工具箱中的一个类别，在展开的列表中双击要添加的动作，可以把动作添加到脚本窗格。如图7-53所示，通过双击“f
unction”，脚本窗格自动添加了“function () {}”代码段。图7-53添加脚本2.使用“脚本助手”使用“脚本助手
”模式，可以在不亲自编写代码的情况下将动作脚本添加到FLA文件。单击“动作”面板右上角的“通过从‘动作’工具箱选择项目来编写脚本”
按钮 ，可切换到“脚本助手”模式。单击某个“动作工具箱”项目，面板右上方会显示该项目的描述。 双击某个项目，该项目就会被添加到动作
面板的“脚本”窗格中，如图7-54所示。图7-54 “脚本助手”模式3.使用“代码片断”（1）将代码片段添加到对象或时间轴帧要添加
影响对象或播放头的动作，可执行以下操作：① 选择舞台上的对象或时间轴中的帧。如果选择的对象不是元件实例或TLF文本对象，则当应用该
代码片段时，FLASH会将该对象转换为影片剪辑元件。如果选择的对象还没有实例名称，在应用代码片断时会弹出如图7-55所示的对话框，
单击“确定”按钮FLASH会自动添加一个实例名称。图7-55 要求命名实例对话框② 在“代码片断”面板中，双击要应用的代码片断。如
果选择了舞台上的对象，FLASH将代码片断添加到包含所选对象的帧中的“动作”面板。如果您选择了时间轴帧，Flash 只将代码片断添
加到那个帧。③ 在“动作”面板中，查看新添加的代码并根据片断开头的说明替换任何必要的项。如图7-56所示，片断中的“/——/”
之间的部分为说明。如图7-57所示为修改了参数值后的代码片断。 图7-56 原代码片断
图7-57 修改后的代码片断（2）将新代码片断添加到“代码片断”面板。可以将自定义的代码片断或外部的代码片断添加到“代码
片断”面板，以方便重复使用。可以用两种方法将新代码片断添加到“代码片断”面板：在“新建代码片断”对话框中输入片断。导入代码片断XM
L文件。要使用“新建代码片断”对话框，可执行以下操作：① 在“代码片断”面板中，从面板菜单中选择“新建代码片断”。如图7-58所示
。图7-58 “代码片断”面板菜单② 在对话框中，为新代码片断输入标题、工具提示文本和ActionScript3.0代码。如图7-
59所示。图7-59 创建新代码片断思考与实训一、填空题1.在FLASH中，声音有 、 、
、 4种同步方式，其中可以与时间轴同步播放的是 方式。2.添加到按钮的声音最好采用
同步方式。3.使用 可以自定义编辑声音的效果。4.通过调整声音文件的压缩方式，可以在尽可能减小文件大小的同时
保证声音的质量不受影响。可以从 、 、 、 、 中选择一种压缩方式。5.“采
样率”控制声音保真度和文件大小，较低的采样率会 文件大小，但也会 声音品质。“位”指定声音压
缩的位深度，位深度越高，生成的声音的品质就越 。6.若要将视频导入到FLASH中，必须使用以 或
格式编码的视频。7.使用 方式导入视频，视频内容独立于其它FLASH内容和视频回放控件，更新视频
内容相对容易。8.使用 的导入方式，适合较短的视频文件，对于回放时间少于10秒的视频剪辑，效果最好。9.良好的习
惯是将视频置于 元件中，这样可以获得对内容的最大控制。10.如果嵌入视频的源文件后来被重新编辑，可以在库面板中选
择视频剪辑，然后选择“属性”并单击 ，即会用编辑过的文件更新嵌入的视频剪辑。11. 与旧的 ActionScript代码相比，ActionScript 3.0的执行速度可以快 倍。12. 面板是用FLASH提供的专门处理动作脚本的编辑环境。选择菜单“窗口→动作”或按 ，即可打开该面板。13. ActionScript代码存放在时间轴的关键帧上 ，如果有许多代码分散在不同的时间轴和不同的关键帧中，使用 查找就特别方便。14. 可帮助避免新手用户可能出现的语法和逻辑错误，但必须熟悉ActionScript，知道创建脚本时要使用什么方法、函数和变量。15.ActionScript3.0的脚本只能添加到 上面，添加脚本都要通过 面板来实现。16. FLASH CS5提供了一个 面板，可以帮助不熟悉脚本语言的设计者实现某些脚本功能。二、上机实训1.使用“公用库”中的声音文件，尝试为按钮的不同状态添加声音效果。2.收集同学的照片，制作一个班级电子相册，为照片配上文字说明与背景音乐。3.分别用“嵌入视频”和“加载外部视频”的方式导入视频，制作动画短片（可以结合其它动画制作技巧，使你的作品与众不同）。4.从网上下载不同格式的视频文件，使用Adobe Media Encoder把它们转换为FLV或F4V格式，并且尝试“裁剪输出视频”和设置“源范围”。5.通过在“动作”面板中直接输入脚本，控制动画跳转、停止。6.使用“代码片断”，控制舞台实例的显示、隐藏、旋转、移动等属性。7.使用“代码片断”，通过按钮控制动画的播放流程以及舞台实例的属性。 |
|
