上一期我们介绍了一种非门电路动画设计制作的方法。其中的关键部位——开关是用Flash的按钮功能来实现的,但那是一种直接实现的方法,对于控制少量动画对象,用这种方法是比较简单的。这次我们要实现的控制对象相对多些,可以采用另一种方案的按钮方式来实现。用这种方式,可以实现对任意多个动画元素的控制。
本文介绍的重点仍放在最富生命力的互动按钮设计上,其余如总体布局、单元图块、背景图、给按钮加声音等,就由读者自己去制作了。
与门的特点是只有当与门所有的输入端上都加有高电位时,它的输出端才会有高电位输出。所以可以把与门看作是一个“一票否决机”。据此我们可以设计这样的功能:
安排4个按钮,分别执行:
①一个开关都不按下。此时与门的两个输入端上都没有高电位,输出端也没有输出信号;
②只有开关K1按下。此时仅与K1对应的与门输入端有高电位,输出端也没有输出信号;
③只有K2按下。此时仅与K2对应的与门输入端有高电位,输出端也没有输出信号;
④K1和K2同时按下。此时与门的两个输入端都有高电位,其输出端有了高电位输出,而且在示波器荧光屏上出现了一个不断闪动的绿色信号。与此同时,自动弹出一个叫做“总结”的红色按钮;
⑤点击“总结”按钮,显示总结文字。
小按钮图形符号的制作非常简单,点击菜单Insert→New Symbol→Graphic,然后命名为“按钮”后点击OK,在出现的编辑界面中直接用Flash5.0的绘图工具绘制一个红色按钮就可以了。再转回场景时你可以看到库中已经多了一个按钮图形符号。这个符号允许我们多次使用。
用类似的方法,请读者再建立一个正向阶跃电压波形的图形符号,以便需要时调用。
总体布局包括三个方面:
①标题窗域的层名称(素材名称)的标注
根据我们划分和用到的素材,大致可分成10个层面来命名,自下而上分别为:背景、电池、电池引线、与门、示波器和各开关、按钮等(详见图1相应部分)。
②工作区中图像及按钮等素材的排列
如果你对整体布局的把握性较大,也完全可以不把素材分得这么细,从而可以大大减少排列和分层的手续,但当你在设计中有了更好的创意而想改变图像布局时,就必须重新制作图像或分割图像,尤其是要想改变图像单元的颜色或临时想赋予图像单元以动画特点时就会更不方便了。这就是笔者宁愿将图像素材“积木化”处理的原因。
另外,为了简单起见,图中需要的5个按钮都可从Flash5.0的共用库中直接调用而不必自己设计。调用的方法是:点击菜单项Window→Common Libraries→ Buttons,从其“(3D)”按钮中选用第五个按钮(Red Block Play),并将它复制3次,以产生另3个按钮,然后给这4个按钮设置帧功能跳转所必须的Action语句。方法如下:
①右击第一个按钮,从弹出的界面中点选Action,在出现的Object Actions选项卡中点选Object Actions卡条,再选其Basic Action下面的GoTo项,便会在其右方出现如下的语句:
on (release){
gotoAndPlay (1);
??}
我们不要这样的语句,因为我们不希望画面自动前进,而要受点击来控制。为此请点击该界面右下角处那个小三角形,在出现的界面中将Goto&play前面那个方框中的勾去掉。再点一下那个小三角形,原来的语句就变成了:
on (release){
gotoAndStop (1);
??}
该语句表示当用鼠标点击了第一个按钮时,我们的动画就停留在第一帧上不动了(持续表现第一种状态)。
用同样方法将第2、3、4个按钮的Action分别设为类似的语句,但要将括号中的数字分别改为2、3、4,以便当点击了相应的按钮时让动画表现对应的电路状态。
依次拖放这些按钮到不同层的不同帧中(即按钮1层的第一帧、按钮2层的第二帧、按钮3层的第三帧和按钮4层的第四帧,每帧都要同时拖进4个按钮,并顺序排列,放在编辑区中正确的位置上,以便不论动画运行到哪一帧,都可用鼠标点击到任何其他状态中去)。
这是本设计中最为关键的内容,让我们分帧详述。
1.根据与门电路功能动作的需要,只需使用不同层时间轴上的5帧就足够了。前5个层用来安排与门电路图、电池及示波器等,不需要有动画动作,只要能在任何帧上出现就行,因此都使用5个静态帧(见图1)。第六层的第一帧安排给“K0”,K0并不是一个按钮图像,而是一个层名称,代表当两个开关K1和K2都没有按下时的初始(0)动画状态。所以在这个帧上要把前面事先绘制好的红色小按钮从库中拖放到图2A中K1和K2所示的位置上。然后请右击K0层的第一帧,在弹出的菜单中点击Ac-tion,再从弹出的Object Actions选项卡里面从Basic Actions中点选Stop(),此时会在其右面的窗域中出现蓝色的Stop()字串,最后可以关闭此选项界面(不关也行,把它拖放到不妨碍你继续操作的任何地方即可)。这项设置的目的是确保当运行该动画时会自动停止在第1帧上,等待操作。
与此同时,请右击刚才从共用库中调出来的第一个三角形按钮,并从弹出的界面中点选Edit In Place,以便对当前状态下对应于该按钮需要的画面表现进行准确的编辑。当然此处要对该按钮的4个步骤(Up、Over、Down和Hit)分别进行绘制,相信读者一见到这个界面出现就会懂得如何去给它们安排相应的按钮开关、图形和文字。请参照图2B完成。
下面继续设计各按钮的动作状态:即按钮位置、信号状态、示波器反应及相应的文字描述。
2.在第7层(K1层)的第2帧中设计K1的状态,即让画面显示当只有按钮K1合上时的画面表现。这里应该把库中的“正向阶跃电压波形”的图形符号拖放到K1的右方,表示当K1合上时电池的电压波形(直流阶跃)出现在与门的一个输入端上。这从图3上可以看得很明白,请读者仿照进行。
3.现在安排第8层(K2层)的第3帧。该帧用来表示当只有K2按下时的电路状态,故应当只使第二个按钮闭合,且在其右端有阶跃电压波形出现。具体操作可参考图4进行。

4.接着安排第9层(“K1+K2”层)的第4帧。这层描述当两个按钮同时都按下时与门电路的反应。当然,此时与门的两个输入端上都应该有电压出现,同时在其输出端也应该有信号输出,而在示波器的荧光屏上还应该有绿色抖动的阶跃电压波形出现(看来这还是个“超低频直流示波器”呢!)。
该帧还有一个重要的设项,就是自动调出一个名为“结论”的按钮。这个按钮可从Flash5.0的共用库按钮组中的最后一组按钮Arrow Buttons组中调用第一个按钮Pill Button来使用。将其拖放到图4“结论”按钮的位置上,然后双击之,进入该按钮的编辑状态,增加一个层,在该层上为其标注上“结论”二字,并将该文字拖放到按钮中心即可,见图5。

5.下面设计最后一项描述:“结论”。这里我们要使用一个形象鲜明的按钮,命名为“结论”。当点击它后,应该出现关于与门电路特征的完整描述。为此我们可以简单地这么做:在该帧上将所有用过的4个按钮的文字说明都调出来,形成一组简要的说明,而且还可随时点击任何一个说明前面的按钮来复习他们的动作效果。
为实现这个功能,参照前面给按钮1、2、3、4设置Action的方法,也给“结论”按钮设置如下的动作语句:
on (release) {
gotoAndStop (5);
??}
现在在第10层(结论层)的第5帧上进行设置:将与按钮1、2、3、4对应的描述文字分别写到相应的位置上(如图6 所示)即可。
四、设计一个漂亮的闪动波形
到目前为止,如果你生成动画,就已经能够表现所设定的动作了,但总觉得示波器上那个绿色的波形是“死的”,不过瘾。那就设计一个“活的”、能闪动的波形吧。为此要制作一个叫做“闪动的波形”的电影片段(Movie Clip),方法如下:
点击菜单Insert→New Symbol →Movie Clip,并将名称改为“闪动的波形”,点击OK,就出现了编辑界面。
在这里设置4个关键帧,在第1、3帧上绘制非常鲜亮的绿色阶跃电压,而在第2、4帧上绘制较为暗淡的绿色阶跃电压(见图7),这样当4个帧连续循环播放时就会出现波形抖动的感觉。为了使形象更加逼真,可以点击Modify→Movie…在出现的Movie Properties对话框中将Frame Rate改为48fps,以便使波形闪动得更快些。
现在回到场景,可以看到名为“闪动的波形”的电影片段已经存在于库中了。分别点选K1+K2层的第四帧和第五帧,并将“闪动的波形”的电影片段从库中拖放到编辑区示波器荧光屏的准确位置上即可。
五、增加声音及动画标题
给按钮增加声音相信你早已会了,下面说说制作一个动画标题“与门电路功能演示”的设计方法。
1.点击菜单Insert→New Symbol→Movie Clip,并将名称改为“与门电路功能演示”,点击OK,就出现了编辑界面。
2.共建立两个层:文字层和边框层,各50帧。分别输入文字“与门电路演示”和为之套上边框。将文字层设置为Create Motion Tween(产生移动变形),并均匀地建立3个关键帧(连同首尾的两个共5个关键帧),见图8。
3.右击文字层的第一帧,从弹出菜单中点选Panels→Frame。在弹出的Frame对话框中点击Effect,再点击那个小黑三角,会出现图9的界面。此时你可选用不同的效果变化对文字进行颜色动画处理:依次为None不处理,Brightness亮度变化,Tint颜色变化,Alpha透明度处理和Advanced高级处理。每种处理都有滑杆可调,对不同的帧可使用不同的效果处理,然后运行(回车)就可看到文字颜色变化的动画效果。满意后转回场景,并将这个电影片段拖放到总图的左上方,必要时再对其进行缩放,以使整个画面协调美观(参考图1)。
六、生成swf动画作品
点击菜单File→Publish Settings…,在出现的对话框中点选Formats→Flash,并为要生成的动画命名,例如“与门动画.swf”,然后点击Publish,很快就会完成生成过程。这时打开资源管理器,找到你存放该文件的目录和文件,双击之,即可欣赏你的成果了。最后请将源文件存盘后再退出,以便灵机一动时继续改进。
读者可在本期配刊光盘的“本期程序”文件夹中找到本文设计的“与门电路动作演示.swf”。
(田进勤)


