Action Script的简单应用

摘要：本文通过对浏览艺术照案例的剖析，阐述了Action Script脚本的简单应用.通过制作“大图”影片剪辑完成照片的放大和恢复的动作。利用“照片”影片剪辑以从左向右的缓动形式展示各张图片。可以通过个人的喜爱来选择需要查看的照片：在没有做出选择的过程中，照片是以小图片的形式从界面的下部依次排列鱼贯而出，观看者可以通过鼠标点击选取需要查看的照片，则被选择的照片就会放大并放置在界面中心位置。当再次点击被放大的图片，该图片就会收回，恢复到最初的状态，直到下次的选择。

关键词：Flash 元件 脚本 按钮

中图分类号：TP317 文献标识码：A 文章编号：1007-9416(2012)05-0091-02

Flash这款软件近年来在网络中的应用越来越广泛，由于它的操作简单，制作的成品动画栩栩如生，获得越来越多的人的喜爱。通过使用时间轴的排布让纸上的人物能够真正的活过来，变成一个有灵魂，有思想的个体，Flash的魅力更在于它不仅仅能够按照时间轴的安排来播放动画还能够运用脚本来控制动画的播放，使动画能够与观看者产生互动，更可以使用Flash来制作小游戏，通过玩家对页面的交互反应来完成游戏。

下面是一个具有交互功能的艺术照浏览界面，可以通过个人的喜爱来选择需要查看的照片：在没有做出选择的过程中，照片是以小图片的形式从界面的下部依次排列鱼贯而出，观看者可以通过鼠标点击选取需要查看的照片，则被选择的照片就会放大并放置在界面中心位置。当再次点击被放大的图片，该图片就会收回，恢复到最初的状态，直到下次的选择。

下面是制作可放大浏览的艺术照的制作方法：

首先选择背景图片拖拽到图层1第1帧，将该图层命名为“背景”设置舞台的尺寸，与背景图片尺寸相同即600pc×400pc，并且定位背景图的位置为原点坐标。

1、创建“大图”影片剪辑

创建一个影片剪辑，命名为“大图”，选择第一张照片，创建为按钮元件并命名为“照片按钮1大”选择图层1命名为“照片1”将按钮元件“照片按钮1大”放置在图层 “照片1”的第1帧，并在第10帧插入关键帧，第1帧调节元件的大小为115×113，第2帧插入关键帧，第11帧，第30帧插入关键帧.并在第2帧和第10帧、第11帧和第30帧之间创建补间动画。创建一个新图层，命名为“照片2”，在第31帧插入关键帧，选择第二张照片，创建为按钮元件并命名为“照片按钮2大”将按钮元件“照片按钮2大”放置在图层 “照片2”的第31帧，调节第31帧元件的大小为115×113，分别在第40帧、第60帧插入关键帧，调节第40帧元件的大小为417×306，在第41帧插入关键帧，并在第31帧到第40帧、第41帧到第60帧之间创建补间动画。再创建一个新图层，命名为“照片3”，在第61帧插入关键帧，选择第三张照片，创建为按钮元件并命名为“照片按钮3大”将按钮元件“照片按钮3大”放置在图层 “照片3”的第61帧，调节第61帧元件的大小为115×113，分别在第70帧、第90帧插入关键帧，调节第70帧元件的大小为417×306，在第71帧插入关键帧，并在第61帧到第70帧、第71帧到第90帧之间创建补间动画。再创建一个新图层，命名为“照片4”，在第91帧插入关键帧，选择第四张照片，创建为按钮元件并命名为“照片按钮4大”将按钮元件“照片按钮4大”放置在图层“照片4”的第91帧，调节第91帧元件的大小为115×113，分别在第100帧、第120帧插入关键帧，调节第100帧元件的大小为417×306，在第101帧插入关键帧，并在第91帧到第100帧、第101帧到第120帧之间创建补间动画。再创建一个新图层，命名为“照片5”，在第121帧插入关键帧，选择第五张照片，创建为按钮元件并命名为“照片按钮5大”将按钮元件“照片按钮5大”放置在图层 “照片5”的第121帧，调节第121帧元件的大小为115×113，分别在第130帧、第150帧插入关键帧，调节第130帧元件的大小为417×306，在第131帧插入关键帧，并在第121帧到第130帧、第131帧到第150帧之间创建补间动画。再创建一个新图层，命名为“照片6”，在第151帧插入关键帧，选择第六张照片，创建为按钮元件并命名为“照片按钮6大”将按钮元件“照片按钮6大”放置在图层 “照片按钮6大”的第151帧，调节第151帧元件的大小为115×113，分别在第160帧、第180帧插入关键帧，调节第180帧元件的大小为417×306，在第181帧插入关键帧，并在第151帧到第160帧、第161帧到第180帧之间创建补间动画。

分别在“照片”影片剪辑的第1、10、30、40、60、70、90、100、120、130、150、160、180帧写入脚本stop();

分别设置“照片”影片剪辑的第1、2、30、31、60、61、90、91、120、121、150、151、180、181 帧内部的元件对象的Alpha值为0。

在第10帧的“照片按钮1大”的按钮元件上插入动作脚本on (release) {gotoAndPlay(11);}

在第40帧的“照片按钮2大”的按钮元件上插入动作脚本on (release) {gotoAndPlay(41);}

在第70帧的“照片按钮3大”的按钮元件上插入动作脚本on (release) {gotoAndPlay(71);}

在第100帧的“照片按钮4大”的按钮元件上插入动作脚本on (release) {gotoAndPlay(101);}

在第130帧的“照片按钮1大”的按钮元件上插入动作脚本on (release) {gotoAndPlay(131);}

在第160帧的“照片按钮1大”的按钮元件上插入动作脚本on (release) {gotoAndPlay(161);}

新建一个图层，命名为“大图”将“大图”影片剪辑放置在图层的第一帧。

2、创建“照片”影片剪辑

创建一个新的影片剪辑，命名为“照片”，将该影片剪辑的图层1重命名为“背景”，设置笔触颜色为无色，填充颜色为#999999在该图层的编辑区绘制一个矩形大小为1058×130

新建一个图层，命名为“照片1”将按钮元件“照片按钮1小”放置在矩形右侧，依次创建新图层分别命名为“照片2”“照片3”“照片4”“照片5”“照片6”并将“照片按钮2小”“照片按钮3小”“照片按钮4小”“照片按钮5小”“照片按钮6小”分别放置在相应的图层，均匀排列在背景层上。选择影片剪辑“照片”的第210帧所有图层插入关键帧，选择所有图层的内容向右拖拽1662pc。在每一个图层中创建一个动画补间。选择“照片按钮1小”添加以下脚本动作：

on (rollOver){_root.dong.stop();}

on (rollOut) {_root.dong.play();}

on (release) {_root.photo.gotoAndPlay(2);}

选择“照片按钮2小”添加以下脚本动作：

on (rollOver){_root.dong.stop();}

on (rollOut) {_root.dong.play();}

on (release) {_root.photo.gotoAndPlay(31);}

选择“照片按钮3小”添加以下脚本动作：

on (rollOver){_root.dong.stop();}

on (rollOut) {_root.dong.play();}

on (release) {_root.photo.gotoAndPlay(61);}

选择“照片按钮4小”添加以下脚本动作：

on (rollOver){_root.dong.stop();}

on (rollOut) {_root.dong.play();}

on (release) {_root.photo.gotoAndPlay(91);}

选择“照片按钮5小”添加以下脚本动作：

on (rollOver){_root.dong.stop();}

on (rollOut) {_root.dong.play();}

on (release) {_root.photo.gotoAndPlay(121);}

选择“照片按钮6小”添加以下脚本动作：

on (rollOver){_root.dong.stop();}

on (rollOut) {_root.dong.play();}

on (release) {_root.photo.gotoAndPlay(151);}

新建一个图层，命名为“照片”将“照片”影片剪辑拖拽到该图层第1帧。

以上是制作浏览艺术照的全过程，通过对脚本的应用完成Flash的交互功能。一提到代码，可能很多人都望而却步，以为会很难，没有办法马上学会，但以上的案例只采用了最常用的简单语句，能够使初学者也能掌握精髓。

3、结语

在使用ActionScript脚本的时候需要注意可以在图层和元件两处写脚本语句，在图层中写脚本时脚本作用于时间轴，可以通过脚本来控制时间轴的播放并且在时间帧上的空格会出现“a”标记，表示已在该帧写入代码。而在元件处写脚本是将元件当做按钮元件来使用，一般情况下此种元件为按钮元件或影片剪辑而不是图形元件。写在按钮元件上的脚本需要使用“on”相关语句。例如：on( ){ }、onMouseMove（）、onClipEvent（）。在图层和元件两处的脚本语句不能相互交叉使用。

参考文献

[1] 周建国.Flash CS3中文版实例教程.人民邮电出版社.

[2] 周德云.Flas制作与应用.人民邮电出版社.

作者简介

姓名：付长凤,出生年月：1980.6、性别：女、学历：本科、职称：助教、研究方向：数字媒体。