Flash8动画设计案例教程.ppt

第5章 Flash 8.0按钮制作按钮制作制作者:伍福军 张家瑞知识点：知识点： 1. 简单按钮2. 动画按钮3.“别碰我”文字制作4. 跟随光标的提示5. 调节音量6. 控制图片变化7. 左右声道均衡调节8. 用组件控制声音按钮9. 选择乐曲播放10. 使用按钮载入图片 说明：说明： 本章主要介绍Flash 8.0按钮的制作，通过10个案例全面讲解了按钮的制作方法与技巧，学生对本章内容一定要掌握，它是制作交互动画的基础 教学建议课时数：教学建议课时数： 一般情况下需18课时：理论6课时，实际操作12课时(可根据特殊情况做相应调整) 5.1 按钮基础知识按钮基础知识 5.1.1 按钮的介绍1. 按钮简介 按钮是人机进行信息交互的基础，它对鼠标单击事件进行响应按钮可对按钮静止、将鼠标指针移到按钮上、按下鼠标左键3种事件作出响应这3种事件对应着按钮的4种状态：弹起(按钮静止)、指针经过(将鼠标指针移动到按钮上)、按下(按下按钮)、点击(定义按钮响应区域)这4种状态定义了按钮的4个关键帧下面详细介绍按钮的这4种关键帧。

1)【弹起】帧：在【弹起】帧中定义按钮的正常显示效果，也就是按钮未被鼠标单击时所显示的效果2)【指针经过】帧：定义当鼠标指针移到按钮上但不单击它时按钮的效果一般该帧相对于【弹起】帧应有所改变比如：可以定义当鼠标指针移到按钮上时按钮变色或放大、缩小等，对于文字按钮，可以定义当鼠标指针移到按钮上时文字变色或改变文字的字体等3)【按下】帧：定义按钮时按下所出现的效果对于图形按钮来说，按钮被按下时一般会定义得比未被按下时要小一些，这样，当按下按钮时，按钮会自动缩小，出现动态效果4)【点击】帧：定义按钮的响应区域在响应区域按下按钮时，系统才能响应按钮按下的事件该区域在工作区中是不可见的如要定义该帧，必须保证此区域包括按钮的弹起、指针经过和按下3种状态的区域；如不定义该帧，则系统会默认【弹起】帧状态为按钮的区域响应 5.1 按钮基础知识按钮基础知识 注意：按钮虽然有4种状态，但可根据需要定义这4种帧状态，也可只定义一部分，但一些基本的帧必须定义，一般而言，【弹起】帧和【指针经过】帧必须定义2. 按钮的创建(1) 创建图形按钮的步骤如下 ① 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，按如图5.1所示设置。

图5.1 ② 单击[确定]按钮进入按钮编辑区，时间轴中将出现按钮的4个状态帧，如图5.2所示 图5.25.1 按钮基础知识按钮基础知识 ③ 定义按钮的4个帧在按钮中可以使用影片剪辑元件、图形元件或素材库中的组件对象在这里我们利用绘图工具绘制按钮的4个帧 定义【弹起】帧：利用前面所学知识在工作区域中绘制如图5.3所示的图形 定义【指针经过】帧：用鼠标在【指针经过】帧处插入一个关键帧，此时【弹起】帧的图形被复制到【指针经过】帧的工作区确保图形被选中，在混色器面板中进行色彩调整，得到如图5.4所示的图形 定义【按下】帧：用鼠标在【按下】帧处插入一个关键帧，此时【指针经过】帧帧的图形被复制到“按下”的工作区确保图形被选中，在混色器面板中进行色彩调整，得到如图5.5所示的图形 定义【点击】帧：用鼠标在【点击】帧处插入一个关键帧，并进行大小的调整，得到如图5.6所示的图形该帧主要是定义按钮的有效单击范围，在有效范围里按下按钮时，系统才认为该事件已经发生如果不定义该帧，则系统默认“弹起”帧为响应区域 图5.3 图5.4 图5.5 图5.6 5.1 按钮基础知识按钮基础知识 ④ 单击图层左上角的[场景1]按钮，返回场景，按钮制作完毕。

2) 创建文字按钮的步骤如下 ① 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.7所示 图5.7 ② 单击[确定]按钮进入按钮编辑区，时间轴中将出现按钮的4个状态帧，如图5.8 所示 图5.85.1 按钮基础知识按钮基础知识 ③ 定义按钮的4个帧在按钮中可以使用影片剪辑元件、图形元件或素材库中的组件对象在这里我们利用绘图工具绘制按钮的4个帧 定义【弹起】帧：利用文字工具和前面所学知识在工作区域中输入如图5.9所示的图形 定义【指针经过】帧：用鼠标在“指针经过”帧处插入一个关键帧，此时【弹起】帧的文字被复制到【指针经过】帧的工作区确保文字被选中，在文字属性面板中进行色彩调整，得到如图5.10所示的文字 定义【按下】帧：用鼠标在【按下】帧处插入一个关键帧，此时【指针经过帧】帧的文字被复制到“按下”的工作区确保文字被选中，在文字属性面板中进行色彩调整，得到如图5.11所示的文字 定义【点击】帧：用鼠标在【点击】帧处插入一个关键帧，并进行大小的调整，得到如图5.12所示的文字该帧主要是定义按钮的有效单击范围，在有效范围里按下按钮时，系统才认为该事件已经发生。

如果不定义该帧，则系统默认【弹起】帧为响应区域 图5.9 图5.10 图5.11 图5.125.1 按钮基础知识按钮基础知识 ④ 单击图层左上角的[场景1]按钮，返回场景，按钮制作完毕3) 将按钮加入到场景中的方法：打开【库】面板，在场景中选中要插入的层中的关键帧，将“库”中的按钮拖到场景中的舞台中即可4) 预览按钮的两种方法：第一种，选择[控制]→[测试影片]命令；第二种，在场景中浏览按钮效果，选择[控制]→[启动简单按钮]命令5.1.2 基本按钮的制作1. 为图形按钮添加文字 通过给前面制作的图形按钮添加“瞬间艺术”文字，来讲解怎样为图形按钮添加文字，方法如下1) 在场景中双击“图形按钮”，进入按钮编辑状态，如图5.13所示2) 单击图层左下角的【插入图层】按钮，添加一个新的图层，如图5.14所示 图5.13 图5.14 5.1 按钮基础知识按钮基础知识 (3) 单击“图层2”的【弹起】帧，此时选中【弹起】帧，利用文字工具和前面所学的知识在图形上面输入如图5.15所示的文字。

4) 在“图层2”的【指针经过】帧上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[插入关键帧]命令，插入一个关键帧此时，该帧将复制【弹起】帧的文字，将文字修改成如图5.16所示的效果 图5.15 图5.16 5.1 按钮基础知识按钮基础知识 (5) 在“图层2”的【按下】帧上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[插入关键帧]命令，插入一个关键帧，此时，它将复制【指针经过】帧的文字，将该文字修改成如图5.17所示的效果 图5.17 (6) 单击图层左上角的[场景1]按钮，返回场景，按钮修改完毕 5.1 按钮基础知识按钮基础知识2. 使用按钮加载外部影片 可以通过按钮将所做的其他影片加载到当前影片中进行播放，此功能在课件制作中使用频率非常高在这里，我们来讲解怎样加载外部影片的方法1) 选中场景中的按钮，打开【动作】面板，输入“on(press){}”语句，将闪动的光标移到“{}”中间2) 选择【动作】面板中的“loadMovie”语句，如图5.18所示 图5.185.1 按钮基础知识按钮基础知识(3) 在“loadMovie()”的“()”中输入参数，如图5.19所示。

图5.19 “donghua”：是要加载的影片名称，注意要加载的影片名称一定要是英文或数字，不 能用中文命名，影片名字要用双引号 “1”：表示加载的动画所处的层的位置代码、函数、参数将在后面做详细介绍 (4) 关闭【动作】面板，制作完毕3. 为按钮添加电子邮件 在工作和学习中，电子邮件的使用非常频繁，在按钮中加入电子邮件对我们取用网上信息更为方便其方法与按钮加载方法相同，只是要在URL框中输入E-mail地址，在添加地址前应先加入“mailto”在【动作】面板中输入的语句如图5.20所示 图5.20 5.2 简单控制按钮的制作简单控制按钮的制作 5.2.1 案例一：简单按钮 制作一个简单按钮 本案例主要用到的工具或命令有：选择工具、椭圆工具、元件、柔化填充边缘、文字工具、填充浮动面板的设置等 5.2 简单控制按钮的制作简单控制按钮的制作 (1) 运行Flash 8.0，新建一个名为“简单按钮”文件2) 单击[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.21所示单击 按钮，【图层】面板如图5.22所示 图5.21 图5.22 说明： [弹起]是指鼠标指针没有移到按钮上时显示的状态。

[指针经过]是指鼠标指针移到按钮上时显示的状态 [按下]是指在按钮上按下鼠标左键时显示的状态 [点击]是指鼠标指针触发按钮的范围5.2 简单控制按钮的制作简单控制按钮的制作 (3) 单击并选中图层的[弹起]帧4) 单击工具箱中的[椭圆]工具将笔触颜色设置为 ，椭圆渐变填充浮动面板的设置如图5.23所示在工作区绘制一个圆，如图5.24所示 图5.23 图5.24 (5) 选择刚绘制的椭圆，选择[修改]→[形状]→[柔化填充边缘]命令，弹出【柔化填充边缘】 对话框，设置如图5.25所示单击按钮，得到如图5.26所示的椭圆 图5.25 图5.26 5.2 简单控制按钮的制作简单控制按钮的制作 (6) 单击[文字]工具在工作区中输入文字，大小、位置如图5.27所示7) 在[指针经过]帧上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[插入关键帧]命令，此时，在[指针经过]帧处插入一个关键帧8) 单击[选择]工具，选中如图5.28所示的部分，设置填充浮动面板如图5.29所示。

此时，图形效果如图5.30所示 图5.27 图5.28 图5.29 图5.30(9) 单击【文字】工具，将文字改为如图5.31所示将文字改为红色，如图5.32所示10) 在[按下]帧上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[插入关键帧]命令，此 时，在[按下]帧处插入一个关键帧11) 单击[选择]工具，选中如图5.33所示的部分，设置填充浮动面板如图5.34所示此时， 图形效果如图5.35所示 5.2 简单控制按钮的制作简单控制按钮的制作 图5.31 图5.32 图5.33 图5.34 图5.35(12) 单击[文字]工具，将文字改为如图5.36所示将文字改为深红色，如图 5.37所示13) 在[点击]帧上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[插入关键帧]命令，此 时，在[点击]帧处插入一个关键帧14) 单击时间轴左上角的[场景1]按钮，返回场景15) 将“库”中的“简单按钮”拖到舞台中并测试效果，如图5.38所示将鼠标指针移到按 钮上时的效果如图5.39所示。

16) 按下鼠标指针时的效果如图5.40所示 图5.36 图5.37 图5.38 图5.39 图5.405.2 简单控制按钮的制作简单控制按钮的制作 本案例制作了一简单的按钮，主要讲解了按钮的制作原理，基本流程及各帧的作用 利用前面所学知识制作如下效果的按钮5.2 简单控制按钮的制作简单控制按钮的制作 5.2.2 案例二：动画按钮 弹起 指针经过 按下 制作一个动画按钮 本案例主要用到的工具与功能有：椭圆工具、文字工具、填充浮动面板的设置、创建补间动画、Alpha值的设置、柔化填充边缘等5.2 简单控制按钮的制作简单控制按钮的制作 (1) 运行Flash 8.0，新建一个名为“简单按钮”的文件2) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.41所示，单击[ 确定]按钮 图5.41 (3) 单击[椭圆]填充工具，将笔触颜色设置为 ，设置填充浮动面板，如图 5.42所示 在工作区绘制一个圆，如图5.43所示 图5.42 图5.43 5.2 简单控制按钮的制作简单控制按钮的制作 (4) 选中该椭圆，选择单击[修改]→[形状]→[柔化填充边缘]命令，弹出【柔化填充边缘】对话框，设置如图5.44所示，效果如图5.45所示。

图5.44 图5.45 (5) 单击时间轴左上角的[场景1]按钮，返回场景6) 方法同第(3)、(4)步，制作一个“黄白渐变球”的图形元件，如图5.46所示7) 方法同第(3)、(4)步，制作一个“绿白渐变球”的图形元件，如图5.47所示8) 方法同第(3)、(4)步，制作一个“粉红色白渐变球”的图形元件，如图5.48所示9) 选中如图5.47所示的球，选择[修改]→[形状]→[柔化填充边缘]命令，弹出【柔化填充边 缘】对话框，设置如图5.49所示，效果如图5.50所示 图5.46 图5.4 图5. 图5.49 图5.50 5.2 简单控制按钮的制作简单控制按钮的制作 (10) 将图5.50中不要的部分删除，如图5.51所示11) 单击时间轴左上角的[场景1]按钮，返回场景12) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.52所示单击[确定]按钮13) 将“粉红色白渐变球”拖到工作区中，调整其大小及位置，如图5.33所示 图5.51 图5.52 图5.53 (14) 在图层的第15帧处插入一个关键帧并调整大小，如图5.54所示。

15) 创建补间动画，如图5.55所示16)“图层1”第一帧的元件属性面板设置如图5.56所示17) 单击时间轴左上角的[场景1]按钮，返回场景 5.2 简单控制按钮的制作简单控制按钮的制作 图5.54 图5.5 图5.56 (18) 选择[插入]→[新建元件]命令，弹出“创建新元件”对话框，设置如图5.57所示19) 将“红白渐变球”图形元件放到[弹起]帧上，位置大小如图5.58所示20) 在[指针经过]帧上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[插入关键帧] 命令，此时，将插入一个关键帧删除[指针经过]帧中的所有元件，将“黄白渐变 球”图形元件放到[指针经过]帧上，位置大小如图5.59所示21) 在[按下]帧上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[插入关键帧]命 令，此时将插入一个关键帧删除[按下]帧中的所有元件，将“绿白渐变球”图形 元件放到[按下]帧上，位置、大小如图5.60所示 图5.57 图5.58 图5. 图5.60 5.2 简单控制按钮的制作简单控制按钮的制作(22) 在[点击]帧上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择命令将此时，插入一个关键帧。

23) 单击[弹起]帧，选中该帧，将“库”中的“动画”影片剪辑元件拖到工作区中，位置如图5.61所示输入文字，如图5.62所示24) 单击[指针经过]帧，选中该帧，将“库”中的“动画”影片剪辑元件拖4次到工作区，位置如图5.63所示输入文字，如图5.64所示25) 单击[按下]帧，选中该帧，将“库”中的“动画”影片剪辑元件拖4次到工作区，位置如图5.65所示输入文字，如图5.66所示 图5.61 图5.62 图5.63 图5.64 图5.65 图5.66(26) 单击时间轴左上角的[场景1]按钮，返回场景27) 将“库”中的“动画按钮”拖到舞台中，测试效果，如图5.67～图5.69所示28) 完整演示动画请观看从本书提供的网页下载的素材第 5 章的“简单按钮”Flash文件 5.2 简单控制按钮的制作简单控制按钮的制作 图5.67 图5.68 图5.69 本案例主要制作了一个动态按钮，主要讲解了动态按钮制作的方法和流程，在制作过程中，可以像前面制作动画一样，创建新图层、引导线和输入脚本。

5.2 简单控制按钮的制作简单控制按钮的制作 根据前面所学知识制作如下效果的按钮提示：在制作如下效果的按钮时，要特别注意在对绘制的矩形进行“柔化填充边缘”时，要进行两次，第一次选择【插入】单选按钮，第二次选择【扩展】单选按钮完整的演示动画请观看从本书提供的网页下载的素材第5章的“简单按钮1”Flash文件 弹起 指针经过 5.2 简单控制按钮的制作简单控制按钮的制作 5.2.3 案例三：“别碰我”文字制作 弹起 指针经过 制作一个当鼠标指针移到按钮上时会弹出“别碰我哦！”文字的按钮 本案例主要用到的工具或命令有：矩形工具、文字工具、元件的创建、Alpha值的设置、帧动画的创建等 5.2 简单控制按钮的制作简单控制按钮的制作 (1) 运行Flash 8.0，新建一个名为“别碰我”文件2) 设置背景色为“纯黑色”3) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.70所示单击 [确定]按钮4) 单击工具箱中的[矩形]工具，填充浮动面板的设置如图5.71所示。

在工作区绘制一个矩 形，如图5.72所示再绘制一个矩形，如图5.73所示 图5.70 图5.71 图5.72 图5.73 (5) 单击工具箱中的颜料桶工具，对图5.73进行填充，效果如图5.74所示6) 单击时间轴左上角的[场景1]按钮，返回场景 5.2 简单控制按钮的制作简单控制按钮的制作 图5.74(7) 选择[文件]→[导入]→[导入到库]命令，弹出【导入到库】对话框，在对话框中选择图片单 击[打开]按钮，导入图片8) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.75所示单击[确定] 按钮9) 将刚导入的图片拖到工作区中，在图片上单击鼠标右键，弹出快捷菜单，选择[分离]命令，将 图片分离，如图5.76所示 图5.75 图5.765.2 简单控制按钮的制作简单控制按钮的制作 (10) 单击工具箱中的[套索]工具，在选项中选择 项，将猫的白色部分选中，并删除，效果如图5.77所示11) 单击时间轴左上角的[场景1]按钮，返回场景。

图5.775.2 简单控制按钮的制作简单控制按钮的制作(12) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.78所示单击[确定]按钮13) 将“库”中的“图片元件”拖到工作区，并设置“图片元件”的属性如图5.79所示工作区图像的效果如图5.80所示 图5.78 图5.79 图5.80 (14) 在“图层1”的第10帧处单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[插入关键帧] 命令，此时就在第10帧处插入了关键帧用同样的方法在第20帧处插入普通帧15) 将第10帧处的“图片元件”水平翻转，效果如图5.81所示 图5.81 5.2 简单控制按钮的制作简单控制按钮的制作(16) 单击时间轴左上角的[场景1]按钮，返回场景17) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.82所示单击[确定]按钮 图5.82 (18) 将“库”中的“按钮模型”图形元件拖到工作区的中央位置，再将“库”中的“动画” 影片剪辑元件拖到工作区的中央位置，如图5.83所示。

19) 分别在[指针经过]、[按下]、[点击]帧处单击鼠标右键，弹出快捷菜单，选择命令，此 时即分别在、、帧处插入关键帧20) 在[指针经过]帧上单击，将该帧中的所有元件移到适当的位置单击文字工具，在工作 区中输入文字，文字的大小、颜色、位置如图5.84所示 图5.83 图5.84 5.2 简单控制按钮的制作简单控制按钮的制作(21) 单击时间轴左上角的[场景1]按钮，返回场景22) 将“库”中的“按钮”拖到舞台中进行测试，效果如图5.83和图5.84所示 本案例通过讲解制作按钮的基本流程，制作了一个动态按钮在制作过程中要明白一个道理，即在按钮中可以导入动画、声音等 根据前面所学知识制作如下效果的按钮 弹起 指针经过 5.2 简单控制按钮的制作简单控制按钮的制作5.2.4 案例四：跟随光标的提示 当鼠标指针移动到图片上时，出现文字提示 本案例主要用到的工具或命令有：矩形工具、图片的导入、动作脚本、文字工具、属性面板的设置、元件的创建等 5.2 简单控制按钮的制作简单控制按钮的制作(1) 运行Flash 8.0，新建一个名为“跟随光标的提示”的文件。

2) 选择[文件]→[导入]→[导入到库]命令，弹出【导入到库】对话框，在对话框中选择图选 择片单击[打开]按钮导入图片，如图5.85所示 图5.85(3) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.86所示单 击[确定]按钮4) 将“库”中的“鸡.jpg”图片拖到工作区，调整位置、大小如图5.87所示 5.2 简单控制按钮的制作简单控制按钮的制作 图5.86 图5.87 (5) 单击工具箱中的[矩形]工具，并设置填充浮动面板如图5.88所示设置笔触颜色 为 ，在工作区中绘制一个矩形，如图5.89所示 图5.88 图5.89 5.2 简单控制按钮的制作简单控制按钮的制作(6) 选中绘制的“矩形”，将“矩形”转换为“图形”元件，设置属性面板如图5.90所示，效果如图5.91所示 图5.90 图5.91 (7) 方法同第(3)～第(6)步，分别制作如图5.92所示的影片剪辑8) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.93所示。

单击 [确定]按钮9) 单击工具箱中的[文字]工具，在工作区中拖出一文字框，属性面板的设置如图5.94所示 图5.925.2 简单控制按钮的制作简单控制按钮的制作图5.93图5.94 (10) 单击时间轴左上角的[场景1]按钮，返回场景11) 将“库”中的所有影片剪辑拖到舞台中，并输入如图5.95所示的文字 图5.95 5.2 简单控制按钮的制作简单控制按钮的制作(12) 将“库”中的“信息框”拖到舞台中，设置【属性】面板如图5.96所示13) 在舞台中的第一个影片剪辑元件上单击鼠标右键，选择[动作]命令，弹出“动作”脚本对话框，在对话框中输入如图5.97所示的脚本代码 图5.96图5.975.2 简单控制按钮的制作简单控制按钮的制作(14) 方法同第(13)步，语法相同，只要将如图5.97所示的用红色矩形框框出来的文字改成相应的提示文字即可15) 最终效果如图5.98所示，演示效果请观看网上下载的素材第5章的“跟随光标的提示”Flash文件 图5.985.2 简单控制按钮的制作简单控制按钮的制作 本案例主要制作了一个跟随光标提示的效果，在输入语言时要特别细心，只要有一点输入不对，效果就无法实现。

根据前面所学知识制作如下效果，完整的动画演示请观看从网上下载的素材第5章的“跟随光标的提示1”Flash文件 5.2 简单控制按钮的制作简单控制按钮的制作5.2.5 案例五：调节音量 制作一个利用Flash 8.0自带按钮来控制音乐音量的调节器 本案例主要用到的工具或命令有：文字工具、线条工具、颜料桶工具、动作脚本、矩形工具，声音的处理等 5.2 简单控制按钮的制作简单控制按钮的制作(1) 运行Flash 8.0，新建一个名为“调节音量”的文件2) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.99所示单击[确定]按钮3) 单击工具箱中的【线条】工具，在工作区绘制如图5.100所示的图形 图5.99 图5.100 (4) 单击工具箱中的[颜料桶]工具，设置填充浮动面板如图5.101所示并对绘制的图形进行 填充，如图5.102所示5) 单击时间轴左上角的[场景1]按钮，返回场景 5.2 简单控制按钮的制作简单控制按钮的制作图5.101 图5.102 (6) 选择[文件]→[导入]→[导入到库]命令，弹出【导入到库】对话框，在对话框中选 择要导入的音乐和图片。

单击[打开]按钮，导入的音乐和图片如图5.103所示7) 在“库”中的“音乐”文件上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择 [属性]命令，弹出【声音属性】对话框，设置如图5.104所示单击[确定]按钮 5.2 简单控制按钮的制作简单控制按钮的制作图5.103 图5.104 5.2 简单控制按钮的制作简单控制按钮的制作(8) 在“库”中的“音乐”文件上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[链接]命令，弹出“链接属性”对话框，设置如图5.105所示单击[确定]按钮 图5.105(9) 将“库”中的“底板”图形元件拖到舞台中，并调整好位置，如图5.106所示10) 单击工具箱中的[文字]工具，在舞台中输入文字，并设置颜色，如图5.107所示 图5.106 图5.107 5.2 简单控制按钮的制作简单控制按钮的制作(11) 在“图层1”的第1帧处单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[动作]命令，弹出“动作-帧”脚本输入框，在脚本框中输入如图5.108所示的代码。

输入完代码后，单击对话框右上角的 关闭按钮 图5.108(12) 将“库”中的“地球2.jpg”文件拖到舞台中，并进行调整，如图5.109所示 图5.1095.2 简单控制按钮的制作简单控制按钮的制作(13) 选择[窗口]→[公用库]→[按钮]命令，此时将弹出“公用库”对话框，如图5.110所示 图5.110(14) 在公用库中选中如图5.111所示的元件，将其拖到舞台中，位置、大小如图5.112所示 图5.111 图5.112 5.2 简单控制按钮的制作简单控制按钮的制作(15) 在刚拖入的舞台中的按钮元件上双击，进入影片剪辑编辑状态，在“Layer 4”图层的第1帧处单击鼠标右键，在弹出的快捷菜单中选择[动作]命令，弹出“动作-帧”脚本对话框，将脚本中最后一句修改成如图5.113所示红色框框住的语句，然后单击 按钮关闭对话框 图5.113 5.2 简单控制按钮的制作简单控制按钮的制作(16) 将按钮上的“GIN”改为“音量调节”17) 单击时间轴左上角的[场景1]按钮，返回场景18) 最终效果如图5.114所示完整演示效果请观看从网上下载的素材第5章的“调节音量”Flash文件。

图5.114 例主要利用Flash 8.0自带的按钮，通过修改来制作音量调节按钮在制作过程中要特别注意脚本的修改原理 5.2 简单控制按钮的制作简单控制按钮的制作 根据前面所学知识制作如下效果，完整演示请观看从网上下载的素材第5章的“音量调节1”Flash文件5.3 复杂控制按钮的制作复杂控制按钮的制作 5.3.1 案例六：控制图片变化 制作一个通过按钮来控制图片的缩放、移动、旋转的动画本案例主要用到的工具或命令有：椭圆工具、文字工具、图片的导入、动作脚本等 5.3 复杂控制按钮的制作复杂控制按钮的制作 (1) 运行Flash 8.0，新建一个名为“控制图片变化”文件2) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.115所示单击[确定]按钮 图5.115(3) 单击工具箱中的[线条]工具，在工作区绘制如图5.116所示图形4) 单击工具箱中的[颜料桶]工具，通过设置填充浮动面板，填充出如图5.117所示的图形 图5.116 图5.117 5.3 复杂控制按钮的制作复杂控制按钮的制作 (5) 单击工具箱中的[线条]工具，在工作区绘制如图5.118所示的图形。

6) 单击工具箱中的[颜料桶]工具，填充出如图5.119所示的图形7) 单击时间轴左上角的[场景1]按钮，返回场景 图5.118 图5.119 (8) 根据前面所学知识制作一个如图5.120所示的按钮图5.120 5.3 复杂控制按钮的制作复杂控制按钮的制作 (9) 选择[文件]→[导入]→[导入到库]命令，弹出【导入到库】对话框，在对话框中选择图片单击[打开]按钮，导入图片10) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.121所示单击[确定]按钮11) 将导入的图片拖到工作区，并将图片分离，将白色部分删除，如图5.122所示12) 单击时间轴左上角的[场景1]按钮，返回场景 图5.121 图5.122(13) 将“库”中的“底板”图形元件拖到舞台中，再将“库”中的“按钮”拖到舞台中，调整 好大小和形状，并复制5个，调整它们之间的位置，如图5.123所示14) 将“库”中的“mao_mc”拖到舞台中，位置、大小如图5.124所示15)“mao_mc”的属性面板设置如图5.125所示。

5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.123 图5.124 图5.125 (16) 单击工具箱中的文字工具，输入文字如图5.126所示图5.126 5.3 复杂控制按钮的制作复杂控制按钮的制作 (17) 在“图片放大”按钮上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[动作]命令，弹出“动作-帧”对话框在对话框中输入如图5.127所示的代码18) 方法同上，分别在“图片缩小”、“逆时旋转”、“顺时旋转”、“向上移动”、“向下移动”按钮的脚本对话框中输入如图5.128～图5.132所示的代码 图5.127 图5.128 图5.129 图5.130 图5.131 图5.132 5.3 复杂控制按钮的制作复杂控制按钮的制作 (19) 最终效果如图5.133所示图5.133(20) 完整动画请观看从网上下载的素材第5章的“控制图片变化”Flash文件 本案例主要介绍了动作脚本的编辑过程，通过本案例的学习，读者应该能够举一反三制作出不同的动画效果。

每行脚本的具体含义要慢慢体会、理解 5.3 复杂控制按钮的制作复杂控制按钮的制作 根据前面所学知识制作如下效果，完整动画演示请观看从网上下载的素材第 5 章的“控制图片变化2”Flash文件5.3 复杂控制按钮的制作复杂控制按钮的制作 5.3.2 案例七：左右声道均衡调节制作一个能控制左右声道的按钮 本案例主要用到的工具或命令有：矩形工具、椭圆工具、线条工具、文字工具、颜料桶工具，动作脚本、图片处理等 5.3 复杂控制按钮的制作复杂控制按钮的制作 (1) 运行Flash 8.0，新建一个名为“调节音量”的文件2) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.134所示单击[确定]按钮3) 利用工具箱中的[线条]工具、[矩形]工具、[椭圆]工具，绘制如图 5.135 所示的图形 图5.134 图5.135(4) 单击工具箱中的[颜料桶]工具，填充浮动面板设置如图5.136所示5) 对图形进行填充，效果如图5.137所示6) 单击时间轴左上角的[场景1]按钮，返回场景 5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.136 图5.137(7) 选择[文件]→[导入]→[导入库]命令，弹出【导入到库】对话框，在对话框中选择要导 入的音乐和图片。

单击[打开]按钮，导入的音乐和图片如图5.138所示8) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.139所示单击 [确定]按钮 图5.138 图5.139 5.3 复杂控制按钮的制作复杂控制按钮的制作 (9) 利用前面所学知识，制作一个图片渐变的效果，将导入到库中的3张图片分别放在“图层1”的第1、第5、第10帧处此时，创建一个帧动画，图层效果如图5.140所示，最终效果如图5.141所示10) 单击时间轴左上角的[场景1]按钮，返回场景 图5.140 图5.141(11) 在库中的“音乐”文件上单 击鼠标右键，弹出快捷菜单， 在快捷菜单中选择[属性]命 【声音属性】对话框，设置如 图5.142所示单击[确定]按 钮 图5.142 5.3 复杂控制按钮的制作复杂控制按钮的制作 12) 在库中的“音乐”文件上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[属性]命令，弹出【链接属性】对话框，设置如图5.143所示单击[确定]按钮 图5.143(13) 将库中的“底板”元件和“图片影片”影片剪辑拖到舞台中，并调整好大小、位置，如图 5.144所示。

14) 单击工具箱中的文字工具，在舞台中输入文字，并设置其颜色、大小、位置，如图5.145 所示 图5.144 图5.145 5.3 复杂控制按钮的制作复杂控制按钮的制作 (15) 在“图层1”的第1帧处单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[动作]命令，弹出动作脚本输入框，在脚本框中输入如图5.146所示的代码输入完代码后，单击对话框右上角的 关闭按钮 图5.146(16) 选择[窗口]→[公用库]→[按钮]命令，此时将弹出【库】面板，如图5.147所示17) 在公用库中选中如图5.148所示的元件，将其拖到舞台中，位置、大小如图5.149所示 5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.147 图5.148 图5.149 (18) 在刚拖入到舞台中的按钮元件上双击，进入影片剪辑编辑状态，在“Layer 4”图层的第 1帧处单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[动作]命令，弹出“动作-帧” 脚本对话框，将脚本中最后一句修改成如图5.150所示的红色框框住的语句单击对话框 右上角的 关闭按钮。

5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.150(19) 单击时间轴左上角的[场景1]按钮，返回场景20) 最终效果如图5.151所示完整演示效果请观看从网上下载的素材第5章的“左右声道均衡 调节”Flash文件 图5.1515.3 复杂控制按钮的制作复杂控制按钮的制作 本案例制作了一个“左右声道均衡调节”的按钮，在制作过程中输入动作代码时要特别小心 根据案例六与案例七所学知识，制作如下控制按钮效果完整的演示效果请观看从网上下载的素材第5章的“左右声道均衡调节1”Flash文件 5.3 复杂控制按钮的制作复杂控制按钮的制作 5.3.3 案例八：用组件控制声音按钮 制作一个通过选择不同的按钮，分别播放不同歌曲的Flash动画 本案例主要用到的工具或命令有：线条工具、文字工具、矩形工具、动作脚本、组件检查器、图片处理、元件制作等 5.3 复杂控制按钮的制作复杂控制按钮的制作 (1) 运行Flash 8.0，新建一个名为“用组件控制声音按钮”的文件2) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.152所示单击按钮3) 利用工具箱中的[线条]工具、[矩形]工具、[椭圆]工具，绘制如图5.153所示的图形。

图5.152 图5.153(4) 单击工具箱中的[颜料桶]工具，并设置填充浮动面板为如图5.154所示5) 对图形进行填充，效果如图5.155所示 5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.154 图5.155 (6) 单击时间轴左上角的[场景1]按钮，返回场景7) 选择[文件]→[导入]→[导入到库]命令，弹出【导入到库】对话框，在对话框中选择要 导入的图片单击[打开]按钮，导入图片，如图5.156所示8) 利用前面所学的知识制作如图5.157所示的按钮 图5.156 图5.157 5.3 复杂控制按钮的制作复杂控制按钮的制作 (9) 将库中的“底板”图形元件、图片、按钮依次拖到舞台中，并调整它们的大小和位置，如图5.158所示10) 选择[窗口]→[组件]命令，弹出组件浮动面板，将选中的组件拖到舞台中，如图5.159所示11) 组件在舞台中的位置、大小如图5.160所示 图5.158 图5.159 图5.160 (12) 选中拖到舞台中的组件，选择[窗口]→[组件检查器]命令，弹出组件检查器浮动面板。

浮动面板的设置如图5.161所示；属性面板的设置如图5.162所示13) 在舞台中的“春之声圆舞曲”按钮上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择 [动作]命令，随后将弹出“动作-帧”脚本对话框，在对话框中输入如图5.163所示的代码14) 其他按钮代码的输入同图5.163一样，只要将红色框框住的部分改为相应的歌曲名称即可15) 最终效果如图5.164所示，完整演示效果请观看从网上下载素材第5章的“用组件控制声 音按钮”Flash文件 5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.161 图5.162 图5.163图5.1645.3 复杂控制按钮的制作复杂控制按钮的制作 本案例主要使用Flash 8.0自带的组件来制作选择音乐和控制音量效果的Flash动画在制作过程中要特别注意，将播放组件拖到舞台中后，一定要设置组件的属性面板，否则就无法播放声音 根据前面所学知识制作如下效果，完整动画演示请观看从网上下载的素材第5章的“用组件控制声音按钮1”Flash文件5.3 复杂控制按钮的制作复杂控制按钮的制作 5.3.4 案例九：选择乐曲播放 制作一个可以选择音乐播放的效果。

本案例主要用到的工具或命令有：文字工具、组件的使用、矩形工具、分离、动作脚本、声音的处理、图片的处理5.3 复杂控制按钮的制作复杂控制按钮的制作 (1) 运行Flash 8.0，新建一个名为“选择乐曲播放”的文件2) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.165所示单击 [确定]按钮3) 利用工具箱中的[线条]工具、[矩形]工具、[椭圆]工具，绘制如图5.166所示的图形4) 利用工具箱中的[颜料桶]工具和通过设置填充浮动面板，对所绘制的图形进行填充，填充 好的效果如图5.167所示 图5.165 图5.166 图5.167 (5) 选择[文件]→[导入]→[导入库]命令，弹出【导入到库】对话框，在对话框中选择要导入 的音乐和图片单击按钮，导入的音乐和图片如图5.168所示 5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.168(6) 将导入的图片拖到工作区，调整大 小，位置效果如图5.169所示7) 单击时间轴左上角的[场景1]按钮，返 回场景8) 将库中的“底板”图形元件拖到舞台 中，并输入文字，然后放到适当的位 置，如图5.170所示。

图5.169 图5.170 5.3 复杂控制按钮的制作复杂控制按钮的制作 (9) 选择[窗口]→[公用库]→[按钮]命令，此时将弹出【库】面板，如图5.171所示10) 在库中选中如图5.172所示的元件，将其拖到舞台中，位置、大小如图5.173所示 图5.171 图5.172 图5.173 (11) 在库中的“音乐”文件上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[属性] 命令，弹出【声音属性】对话框，设置如图5.174所示单击[确定]按钮12) 在“库”中的“音乐”文件上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择 [链接]命令，弹出【链接属性】对话框，设置如图5.175所示单击[确定]按钮 5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.174 图5.175 (13) 在“图层1”的第1帧处单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[动作]命令， 弹出“动作-帧”脚本输入框，在脚本框中输入如图5.176所示的代码。

输入完代码后，单 击对话框右上角的 关闭按钮 5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.176(14) 双击舞台中的如图5.177所示的组件，进入组件编辑状态，在“Layer 4”层的第1帧处， 单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[动作]命令，弹出“动作-帧”脚本对 话框，将最后一句改为如图5.178所示的红色框框住的语句15) 单击时间轴左上角的[场景1]按钮，返回场景16) 双击舞台中的如图5.179所示的组件，进入组件编辑状态，在“Layer 4”层的第1帧处， 单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[动作]命令，弹出“动作-帧”脚本对 话框，将最后一句改为如图5.180所示的红色框框住的语句5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.177 图5.178 图5.179 图5.180 5.3 复杂控制按钮的制作复杂控制按钮的制作 (17) 在“图层1”的第2帧处单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[插入关键帧]命令，此时，插入一个关键帧在关键帧上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[动作]命令，弹出“动作-帧”脚本对话框，在“动作-帧”脚本对话框中输入如图5.181所示的语句。

图5.181(18) 单击“动作”脚本对话框右上角的 ，关闭对话框19) 单击时间轴左下角的插入图层按钮，此时将插入一个新的图层20) 单击工具箱中的文字工具，在舞台中拖出一个框来，大小、位置如图5.182所示21) 文字属性面板的设置如图5.183所示 5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.182 图5.183 (22) 利用前面所学的知识制作如图5.184所示的按钮23) 在“图层 1”的第 3 帧处单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[插入关键 帧]命令，此时将插入一个关键帧，将舞台中第3帧不需要的元件删除，再输入需要的文 字，如图5.185所示24) 将库中的音乐按钮拖到舞台中，并调整好大小、位置，如图5.186所示 图5.184 图5.185 图5.186 5.3 复杂控制按钮的制作复杂控制按钮的制作 (25) 在舞台中的“春之声圆舞曲”按钮上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[动作]命令，随后将弹出“动作-按钮”脚本对话框，输入如图5.187所示的语句。

图5.187 (26) 其他歌曲按钮的代码输入方法与此相同，只要将如图5.187所示的用红色框框住的文字改成 相应的歌曲名字即可27) 利用前面所学的知识，制作一个“选择乐曲按钮”28) 单击“图层2”将库中的“选择乐曲按钮”拖到舞台中，位置如图5.188所示29) 在选择乐曲按钮上单击鼠标右键，弹出快捷菜单，在快捷菜单中选择[动作]命令，弹出 “动作-按钮”脚本对话框，在“脚本”对话框中输入如图5.189所示的代码，单击“动作- 按钮”脚本对话框右上角的 ，关闭对话框 5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.188 图5.189 (30) 进行测试，效果如图5.190所示，单击选择乐曲按钮，效果如图5.191所示 图5.190 图5.191 5.3 复杂控制按钮的制作复杂控制按钮的制作 本案例主要制作了一个乐曲选择播放按钮的效果，制作过程中，在输入动作脚本时要特别细心，因为很容易出错 根据前面所学的知识制作如下效果，完整演示动画请观看从网上下载的素材第5章的“选择乐曲播放”Flash文件。

5.3 复杂控制按钮的制作复杂控制按钮的制作 5.3.5 案例十：使用按钮载入图片制作一个使用按钮载入图片的Flash动画 本案例主要用到的工具或命令有：矩形工具、线条工具、椭圆工具、动作脚本、浮动面板的设置、元件符号的创建等 5.3 复杂控制按钮的制作复杂控制按钮的制作 (1) 运行Flash 8.0，新建一个名为“使用按钮载入图片”的文件2) 选择[插入]→[新建元件]命令，弹出【创建新元件】对话框，设置如图5.192所示 单击[确定]按钮3) 利用工具箱中的[线条]工具、[矩形]工具、[椭圆]工具，绘制如图 5.193 所示的图形 图5.192 图5.193 (4) 利用工具箱中的[颜料桶]工具，并设置填充浮动面板，对所绘制的图形进行填充， 填充好后的效果如图5.194所示5) 单击时间轴左上角的[场景1]按钮，返回场景6) 利用前面所学的知识制作如图5.195所示的两个按钮 5.3 复杂控制按钮的制作复杂控制按钮的制作 图5.194 图5.195(7) 将库中的“底板”图形元件和两个按钮拖到舞台中，调整好位置，如图5.196所示。

图5.196(8)“下一张”按钮的属性面板设置如图5.197所示，“上一张”按钮的属性面板设置如图5.198所示 图5.197 图5.1985.3 复杂控制按钮的制作复杂控制按钮的制作 (9) 单击工具箱中的文字工具，在舞台中拖出一个框，文字属性面板的设置如图5.199所示 图5.199 (10) 利用前面所学的知识，插入一个“图 层2”，在“图层2”的第1帧处单击 鼠标右键，弹出快捷菜单，在快捷 菜单中选择[动作]命令，弹出“动 作”脚本对话框，在该对话框中输 入如图5.200所示的代码 图5.2005.3 复杂控制按钮的制作复杂控制按钮的制作 (11) 最终效果如图5.201所示完整动画演示效果请观看从网上下载的素材第5章的“使用按钮载入图片”Flash文件 图5.201 本案例主要制作了一个使用按钮控制图片载入的效果，在制作过程中，要特别注意文件和图片应保存在同一个文件夹中，否则在运行时就会找不到图片 5.3 复杂控制按钮的制作复杂控制按钮的制作 根据前面所学知识制作如下效果。

完整动画演示效果请观看从网上下载的素材第5章的“使用按钮载入图片1”Flash文件。