第6章-在元件中添加动作脚本和ActionScript基本语法

在元件中添加动作脚本和ActionScript基

本语法

本章学习目标：

元件在Macromedia Flash Professional 8中分为图形、按钮和影片剪辑三种类型。其中按钮元件和影片剪辑元件可以实现交互，并能通过添加动作脚本制作出一些特殊效果。与Flash对话，就像与外国人对话一样，必须掌握外国人语言才能与之交流，而Flash的自然语言是ActionScript，只有学会ActionScript语言才能与之沟通。

本章重点和难点：

●掌握对元件添加ActionScript代码的操作

●掌握ActionScript基本语法和对元件事件的处理

6.1【案例17 】链接按钮

案例效果：

“链接按钮.swf”播放画面如图6-1-1所示。窗口中一个圆形按钮，鼠标移动到圆形按钮之上，出现手形，单击按钮并释放后，会弹出google的网站。通过本节内容的学习，将进一步掌握按钮的制作方法，掌握在按钮上添加ActionScript代码的操作过程。

图6-1-1“链接按钮”的效果图

设计步骤：

(1)新建一个flash文档，大小设置为300*200像素，背景色为白色，帧频为12。

(2)单击工具箱中的椭圆工具，按住“shift”键的同时在舞台工作区绘制一个正圆。

(3)单击工具箱中的选择工具，选中正圆，单击“修改”→“转换为元件…”命令（快捷键为F8），弹出“转换为元件”对话框，名称填上“按钮”，类型为“按钮”，单击“确定”，如图6-1-2所示。

图6-1-2“转换为元件”对话框

(4)单击圆形按钮，选择“窗口”→“动作”命令（快捷键为F9），在弹出的动作面板中输入以下代码，如图6-1-3所示。

图6-1-3动作代码

(5)制作完毕后，保存为按钮01.fla，测试影片。

知识进阶：

1.对按钮元件的理解

使用按钮元件可以创建响应鼠标点击、滑过或其它动作脚本的交互式按钮。可以定义与各种按钮状态并联的图形，然后将动作指定给按钮实例。按钮实际上是一个四帧的交互影片剪辑。当创建按钮元件行为时，flash会建立一个四帧的时间轴。前三帧显示按钮的三种可能状态；第四帧定义按钮的活动区域，但在时间轴上并不播放，它只是对指针运动和动作做出反应，跳到相应的帧。

2．ActionScript语言

ActionScript是一门用于Flash中的编程语言，就如同人类语言一样，通过使用ActionScript语言，我们可以告诉Flash应该做什么，而Flash会聆听你的声音，并且试图执行要求的动作，然后给出响应。

案例进阶：

【进阶案例41 】动态按钮

案例效果：

“动态按钮.swf”播放画面如图6-1-4所示。窗口中一个迪斯尼的卡通人物，在他下方有5个按钮，可以控制人物的移动和旋转。

图6-1-4“动态按钮”效果图

设计步骤：

(1)新建一个flash文档，把大小设置为500*400像素，背景色为棕黄色，帧频为12。

(2)新建一个图层，命名为“人物”。单击“文件”→“导入”→“导入到舞台”命令，通过弹出的“导入”对话框，给舞台工作区导入人物图片（卡通人物图片.jpg），利用任意变形工具调整图片大小。单击“修改”→“分离”命令，将卡通人物图片打碎。

(3)单击工具箱中的套索工具，选择工具箱下方“选项”栏中的魔

术棒按钮，用鼠标在卡通人物四周白色背景处单击，选中背景图像，按“Delete”键，删除选中的背景。

(4)单击“修改”→“组合”命令，将卡通人物图片组合好。单击“修改”→“转换为元件…”命令（快捷键为F8），弹出“转换为元件”对话框，名称填上“boy”，类型为“影片剪辑”。

(5)在属性面板中，将实例名称设置为“boy”，如图6-1-5所示。

图6-1-5 属性面板的设置

(6)新建一个图层，命名为“按钮”。单击“窗口”→“公用库”→“按

钮”命令，在弹出的库面板中选择“classic buttons”文件夹，选中“arcade button

- yellow”按钮，将其拖拽到舞台工作区中。同样的方法，将“key buttons”文件夹中的“key - down”、“key - left”、“key - right”、“key - up”四个按钮拖放到舞台中，在按钮上或按钮下方写上相应的文字，效果如图6-1-4所示。

(6)在“按钮”图层中，选中圆形按钮，选择“窗口”→“动作”命令（快捷键为F9），在弹出的动作面板中输入以下代码，如图6-1-6(a)所示。

(a) 旋转按钮动作代码(b) 左移按钮动作代码

(c) 右移按钮动作代码(d) 上移按钮动作代码(e) 下移按钮动作代码

图6-1-6 按钮的动作代码

(7)制作完毕后，保存为按钮02.fla，测试影片。

【进阶案例42 】创建四种状态的按钮

案例效果：

“创建四种状态的按钮.swf”播放画面如图6-1-7所示。窗口中显示一个有四种状态的长方形按钮。

图6-1-7“创建四种状态的按钮”效果图

设计步骤：

（1）新建一个flash文档，把大小设置为300*200像素，背景色为白色，帧频为12。

（2）单击工具箱中矩形工具，在主场景中画出一个红色矩形，单击

工具箱中的选择工具，选中此矩形，选择“修改”→“转换为元件…”命令（快捷键为F8），弹出“转换为元件”对话框，名称填上“按钮”，类型为“按钮”，单击“确定”。把图层1从命名为“背景”，再添加一层，命

名为“文本”，单击工具箱中的文本工具，在红色矩形之上输入“按钮”两个字，效果如图6-1-8所示。

图6-1-8“按钮”图形图6-1-9 按钮元件编辑界面

（3）单击工具箱中的选择工具，双击红色矩形，进入按钮元件的编辑界面，如图6-1-9所示。

（4）选中“指针经过”的状态，按F6键“插入关键帧”，把矩形的填充色换成蓝色；接着选中“按下”的状态，按F6键“插入关键帧”，把矩形的填充色换成绿色；最后选中“点击”的状态，按F5键“插入帧”。

（5）制作完毕后，保存为按钮03.fla，测试影片。

6.2【案例18 】画面切换动画

案例效果：

“画面切换动画.swf”播放画面如图6-2-1所示。窗口中显示兔子图片过渡变化为孔雀图片的动画效果。通过本节内容的学习，将进一步掌握影片剪辑的制作方法，掌握影片剪辑独立于主时间轴的多帧时间轴的操作方法。

(a) (b)

图6-2-1“画面切换动画”效果图