关于Loading的制作

关于Loading的制作
　　关于Loading的制作，网上已经有很多文章都有介绍，因为最近网友问到这个问题比较多，所以幸运鸟这次也来凑个热闹，一方面总结一下制作Loading的方法，另一方面说说在Loading制作中的一些问题。

　　所谓Loading，主要是指在网上观看Flash电影时，有时由于文件太大，或是网速限制，需要装载一段时间才能播放，但由于这个Loading所需的时间对于观看者来说是未知的，所以在Flash电影装载过程中，假如没有任何提示，多数用户都不会有足够的耐心在面对空白的网页许久仍继续等待。制作Loading，就是要告诉用户目前Flash电影的装载情况，哪怕你做的Loading只是简单的一个小动画，都会起到很好的效果。在使用本地机时，不会存在Loading的问题，但我们可以使用Flash软件模拟网页下载环境进行调试，这一点我们在本节中会有具体说明。

　　Loading分成两种，一种是没有下载进度提示的，另一种是精确显示下载进度的。我们可以根据需要分别使用，也可以结合两者，或许可以得到更好的效果。下面我们就来分别介绍这两种Loading的制作，在这里我们为了教学，选用的都是比较简单的Loading示例，不过制作Loading的方法大同小异，大家在实际制作中可以充分发挥想象，相信会做出好的Loading作品来的。

简单的Loading制作

　　这一种Loading是不提示下载进度的，如下面的示例所示，这种Loading非常适合于下面的情况，也就是我们事先把所有的动画都做成了一个Movie Clip，然后在主场景中把这个Movie Clip拖到画面中，只占一帧。对于这种情况，做有精确下载进度显示的Loading就有些力不从心，因为精确显示需要用到Flash4提供的两个参数。一个是_framesloaded，表示已经装载的帧数，另一个是_totalframes，表示场景中动画占据的总帧数，要精确显示载入进度就要用到这两个参数的比值。但因为主场景中只有一帧，精确显示实际上是很难实现的。

　　下面我们就来介绍如何把这段动画加入到Flash电影中去。


　　首先，我们先找一个比较大一些的Flash电影，我在这里就用第三章第十一节《书本翻页效果》中的示例。这个示例就是把所有的动画都做成一个名为page flip的Movie Clip，然后在主场景中把这个Movie Clip拖出来放到第1帧的。

　　要做这个动画的Loading一般做法是先制作一个Loading小动画的Movie Clip，例如上面这个小动画，然后在主场景中把前两帧空出来（至少要两帧），在第3帧或以后加入主动画。上面这个动画大家应该一看就会做，我就不多说了，只把它的时间轴提供给大家，见下图，其中Layer 1放文字“载入中”，Layer 2在不同的帧放上不同数量的小圆点。


　　现在在主场景中把第1帧中的那个Movie Clip删除，在第3帧按F6插入要害帧，并从图库中把page flip电影片断拖到工作区。

　　新建一个层用于放Loading和加入Actions语句进行控制。在第2帧按F6键，这样前两帧都成为要害帧。现在在第1帧把刚才做的Loading动画拖出来放好，双击这个实例，设置实例名为loader。然后双击第1帧，把Actions设置成下列语句：

　　　　If(_framesloaded >= _totalframes)
　　　　　　Go to and Play(3)
　　　　Else
　　　　　　Set Variable:"frame" = frame + 1
　　　　　　If(frame = 37)
　　　　　　　　Set Variable:"frame" = 1
　　　　　　End If
　　　　　　Begin Tell Target("/loader")
　　　　　　　　Go to and Stop(/:frame)
　　　　　　End Tell Target
　　　　End If

　　下面我们来介绍这样设置的目的。

　　If(_framesloaded >= _totalframes)

　　　　首先加入判定（_framesloaded和_totalframes这两个参数的含义我们上面已经提到过，大家从字面上也可以理解），假如已装入帧数已经达到总帧数，那么

　　Go to and Play(3)

　　　　就跳转到第3帧也就是书本翻页电影片断所在帧继续播放。

　　Else

　　　　否则，也就是没有装载完时，执行下面的操作。

　　Set Variable:"frame" = frame + 1

　　　　新建一个变量frame，它代表当前播放到Loading小动画的具体位置，也就是当前播放到哪一帧了。frame的值默认为0，所以在执行了这个语句后frame的值为1，即在一开始将播放小动画的第1帧。

　　If(frame = 37)

　　　　再加一个判定，因为我们注重到这个Loading小动画一共有36帧，假如frame自加超过了这个数字，我们需要

　　Set Variable:"frame" = 1

　　　　把变量frame重新设置为1。

　　End If

　　　　这个嵌套的判定结束。

　　Begin Tell Target("/loader")

　　　　指示下面的操作我们是针对实例名为loader的电影片断进行的，也就是这个Loading小动画。

　　Go to and Stop(/:frame)

　　　　跳转到Loading小动画的第frame帧然后停在那一帧上，注重这种表示方法。

　　End Tell Target

　　　　Tell Target结束。

　　End If

　　　　最外层的判定结束。

　　总的说来，就是装完了就播放电影，没装完就循环跳转到Loading小动画依次播放每一帧。

　　设置好这一帧的Actions之后，我们还需要设置第2帧的Actions。第2帧的Actions很简单，就是Go to and Play(1)。目的就是阻止Flash在装载完之前播放主动画。

　　最后因为我们在主场景中增加了2帧，所以还需要对主动画所在层做一些小调整。因为这个page flip电影片断一共有450帧，所以在Layer 1的第452帧按F5键，这样才能保证动画可以完全顺利播放。这里有简单Loading的示例。


精确Loading的制作

　　精确的Loading可以让人一目了然，便于用户把握时间。但一般要求主动画直接在主场景中制作，这样才可以连续显示出装载的比例。精确Loading的缺点是它只能显示已装载帧数与总帧数的百分比，不能精确显示已装载数据量与Flash电影总数据量的百分比，也就是说，假如电影的某一帧数据量比其他帧大很多，则会在这一帧上停留很久，而在其他帧上快速擦过。下图给出的只是一个精确Loading的式样，真正的Loading过程是不会象下面这样平滑的。


　　还和上面的简单Loading一样，再为书本翻页的示例做精确Loading，这一次我们得做多一点修改。首先在这个示例中，在图库窗口里双击page flip图符的预览窗口进入它的编辑画面， 在时间轴窗口用鼠标点一下最下面一层的第1帧，再按住Shift键点最上面一层的第450帧，现在所有层都被选中，按Ctrl+Alt-C复制。回到主场景，先把第1帧的内容删除，使第1帧成为空帧，再点一下第3帧，再按Ctrl+Alt-V粘贴，这样就把page flip所有的内容拷贝到主场景中，注重可能复制过来的内容与原先的内容有所不同，把它们修改到完全相同。所有层的起始帧现在都成了第3帧。

　　下面我们来制作Loading动画。新建一个电影片断类图符loader。按Ctrl+Alt-I打开对象监控板，在工作区中间画一个蓝色不带边线的矩形，选中它，在对象监控板上设置参数如下，按Apply应用。这个蓝色的矩形将用作进度指示器。


　　现在回到主场景中，在最上层新建一个层，用于放Loading动画和插入Actions语句。在第2帧按F6键，这样前两帧都成为要害帧。在第1帧把电影片断loader拖进来，双击它设置实例名为loader。

　　为了更精确地显示出装载的进程，我们还需要加工一下。还在这一层的第1帧，画一个宽度为20，长度为400的不填充的矩形边框。把这个矩形边框移动到其左边线刚好覆盖住蓝色矩形的位置上。

　　下面再来加点内容，先在矩形边框中间加上个%号。再选中文字工具，把其下的参数修改器中最下方的按钮按下，然后在%号前拉一个框。选箭头工具，在这个框上点鼠标右键，在弹出的菜单中选Properties，进入设置面板后在Variable里填上framepercent，并把Options里所有的对勾都去掉。

　　再来添些文字，选中文字工具，保证没有被按下，在矩形边框上方输入“总帧数452帧，已装入”，再空上一些，输入“帧”。再次按下这个按钮，在最后那个“帧”字前拉一个方框，然后跟上面一样，设置这个方框的属性，把Variable设为framenumber，再把Options里所有的对勾都去掉。

　　全部设置好后的第1帧应如下图所示：


　　接下来我们来做第1帧的Actions，见下面的设置。

　　　　If(_framesloaded >= _totalframes)
　　　　　Go to and Play(3)
　　　　Else
　　　　　Set Property("/loader",X Scale) = (_framesloaded * 400 / _totalframes) * 100
　　　　　Set Variable: "framepercent" = Int((_framesloaded / _totalframes) * 100)
　　　　　Set Variable: "framenumber" = _framesloaded
　　　　End If

　　下面来具体解释一下这样设置的目的。这里我们只需要说明Else部分的语句含义，其余的语句我们在上面已经讲过了。

　　Set Property("/loader",X Scale) = (_framesloaded * 400 / _totalframes) * 100

　　　　因为要做蓝色矩形条延伸的动画，在这里我们用改变矩形条横向比例值的方法来实现。语句左边表示设置蓝色矩形条的X方向比例值，右边是计算公式，用_framesloaded / _totalframes来表示已装载的百分比，因为X Scale参数本身就是百分数，所以我们在后面要乘上100，我们还注重到，现在蓝色矩形条的长度为1，而整个矩形框的长度为400，所以还需要再乘上400。

　　Set Variable: "framepercent" = Int((_framesloaded / _totalframes) * 100)

　　　　framepercent变量用于存放已装入帧数与总帧数的百分比，右边的计算公式应该不难理解，这里Int()函数表示取整。

　　Set Variable: "framenumber" = _framesloaded

　　　　framenumber变量用于存放已经装入的帧数，用Flash提供的参数_framesloaded就可以轻松获得。

　　这一帧的设置就是这样，然后我们还要对第2帧设置Actions。其内容为Go to and Play(1)。

　　这样这个Loading也就做好了。当然Loading的制作方法还有一些，例如本站Flash技术文章中就有一篇“能精确百分比的LOADING制作”，不过也大同小异。点这里下载精确Loading的示例。


关于Loading的测试问题

　　最后我们再来说说对Loading的测试问题。因为在本地机上做Loading时，Flash电影不管有多大，装载也不需要什么时间，所以Loading的动画往往还没来得及显示就进入主动画的播放了，那么怎么来测试制作Loading的效果呢？

　　我们可以通过Flash中的Show Streaming（显示流）的方法来模拟从网络装载页面的情况。具体做法很简单，在动画全部做好后，按Ctrl-Enter测试效果。在测试画面菜单中选Control -> Show Streaming，或再次按Ctrl-Enter键就可以看到装载画面了。

　　假如你仍觉得装载得太快，看不清Loading效果，则可以在测试画面菜单中选Control项，然后在其下选择一个下载速率，譬如14.4K，也可以自己定义，这样就可以对Loading进行调试了。