<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script>阅读提要：
1 Loading的作用。
2 Loading的制作。
3 Loading的风格分类。
4 Loading的设计思维。
5 总结
一. Loading的作用。
Loading.英文原意为装载，装填。在flash里面叫做预载画面。我们在欣赏每一件完整的flash作品的时候，都会看到loading的出现。这是因为，动画播放是否流畅取决于网络带宽，对于用调制解调器的朋友们欣赏的时候，loading会预先的加载一部分或全部以后，才能流畅播放。特别是，动画中有音乐或者位图的情况下，loading 的作用就显而易见了。由于上述的条件限制，没有哪一个动画不作loading。Loading发展到现在已经不是简单的一个下载动画的工具了。它已经成为体现主体动画，衬托主体的一个载体。Loading分为两个大部分。一个是功能类的（指下载作用功能）另一部分是等待动画。下面我们就从这两个方面来研究一下。
二 Loading的制作
制作loading 有许多的方法。我们从最简单的开始向大家介绍：
第一种：loading( 假的 )
也就是假loading。这种loading我想在某些人的动画中也会出现。我就曾经作了一个。我先作的动画，最后作loading,时值夜半，睡意朦胧，恍惚中作了一个。欣喜之余，马上发布。天明清醒，遂发现loading没加as。故称为（假）loading 。幸好，动画不长，没人发现。心中窃喜。在这里告诫朋友们，loading 也是我们的作品的一部分，我们要用正确的态度来对待它。
第二种：用ifFrameLoaded语句来完成。
IfFrameLoaded现在已经被MX给否决了。MX不提倡用此语句。但是还是可用的。完整的语句为：
If|FrameLoaded(欲加载的场景 . 欲加载的帧数或帧标签){
GotoAndPlay(正式动画的第一帧)
此语句的缺点是，它只能判断欲载程序是否到某一帧。可是如果此帧的后面有许多音乐或位图，播放以后还是不流畅的。
好了，我们一起来作一个简单的Loading吧！
1 打开flashMX，新建文件。
2 插入---新建元件----名称“loading”----类型（影片剪辑）
3 进入loading影片剪辑编辑区后，用文本工具写入“loading”。按F6复制此内容四帧。并删除第二帧，第二四帧的内容。保存！（参看附图ifFrameLoaded---1）
4 回到主场景，把名称为”loading”的影片剪辑拖入到第一层。并延长到第二帧（F5）
5 新建一层，命名为“as”。在第一帧，和第二帧分别插入关键帧。第一帧加入as：ifFrameLoaded(3){
gotoAndPlay(3);
}
第二帧加入as: gotoAndPlay(1);
6 新建一层，命名为主动画。
7 在主动画层的第三帧，插入关键帧，放置你的动画。也就是说，动画可以从这里开始作。（参看附图ifFrameLoaded---2）
8 按Ctrl Enter 两次，欲览loading 。如果你作的动画比较小的化。可以改变swf文件菜单栏中的调试项，选择低一点的速度。
9 完成！（参看源文件ifFrameLoaded）
由于影片剪辑有不受主时间线控制的特点，整个loading呈现的是不停闪烁的文字“loading…”的画面。我们分析一下这条语句。
第一帧：
IfFrameLoaded(3){ file://如果加载完第三帧，执行大括号里面的语句
GotoAndPlay(3);
} file://转到并播放第三帧。
第二帧：
gotoAndPlay(1); file://转到并播放第一帧。
也就是说从第一帧到第二帧是一个小的循环。如果第一帧没有加载完，时间先就到了第二帧，第二帧的语句是gotoAndPlay(1)，所有时间线又回到第一帧播放。循环几次以后，当ifFrameLoaded判断已经加载完动画以后，就执行gotoAndPlay(3)去播放。
这个语句的缺点是显而易见的。它的判断是根据动画中的帧的多少来进行的。我们知道，动画中的帧大小是不一样的，关键帧就要比延长帧大。这样，你就无法准确的判断欲加载的帧数是否适合网络带宽。这也是这个语句的弊病。再有，此语句其实就是一个判断语句，在flash MX中可以用if来完成。
第三种：_framesloaded语句
在Flash MX中，用_framesloaded来替代ifFrameLoaded。我们来看看它的用法。
_framesloaded语句是影片剪辑的属性，在properties集合中。我们来用它来判断我们的欲加载帧数。下面我们用它来作一个简单Loading
1 打开Flash MX，新建文件。
2 利用上面的例子做出影片剪辑Loading。
3 回到主场景，把影片剪辑放到第一层，并延长到第二帧。
4 新建一层，命名为as层，在第二帧加入关键帧。并加入as.如下：
if(_framesloaded>=3){
gotoAndStop(3);
}else{
gotoAndPlay(1)；
}
5 新建第三层。命名图片层。在第三帧插入关键帧，导入一幅图片。
6完成！（参看源文件framesloaded）
解释一下语句的含义：
if(_framesloaded>=3){ file://如果（if）影片加载的帧数大于或等于第三帧的化，执行下面大括号里面的语句。
gotoAndStop(3); file://上面条件成立，则转到并停止在当前场景的第三帧。
}else{ file://如果上面的条件不成立，则执行else下面的语句
gotoAndPlay(1)；//如果条件不成立，则执行转到并播放当前场景的第一帧。（循环，直到条件成立）
}
上面用到了一个条件语句（if）如果大家熟悉条件语句的化，就很容易明白。
利用framesloaded我们还可以做出另外一种比较人性化的Loading，就是加入载入条。载入条可以动态的显示影片的加载情况，是观众能够清楚明了的知道影片的加载过程。利用framesloaded就可以作一个简单的加载条。
我们一起来吧！
1、 打开flash MX，新建一个文件。
2、 新建一个影片剪辑mc，名称为loading。
3、 进入影片剪辑loading编辑区。利用长方形工具画一个长方形进度条。颜色随意。
4、 返回主场景，打开库面板，把影片剪辑loading拖放到主场景的第一层第一帧。并延长到第二帧。（F5）在下面的属性面板中填入影片剪辑loading的分身名”loading”。
5、 新建一层，命名为AS层，在第二帧插入关键帧，打开AS面板，加入如下AS语句：
6、 if(_framesloaded>=_totalframes){
gotoAndPlay(3);
}else{
_root . loading . _xscale=(_framesloaded/_totalframes*100);
gotoAndPlay(1);
}
7、 新建一层，命名为pic，插入几个关键帧，并对应的加入图片。（参看图例framesloaded—1）
8、 Ctrl Enter测试，完成！
注意事项：
1、 制作影片剪辑loading的时候，我们要把长方形的进度条的中心点改变到左侧。这样在测试的时候，进度条就会逐渐的向右延伸。(参看图例framesloaded—注意事项1)
2、 一定在属性面板中加入影片剪辑的分身名，不然as就不知道控制谁了。（参看图例frameloaded—注意事项2）
3、 我们还可以在主场景加一个进度条的外围框，朋友们自己动手去作罢。
4、 朋友们在制作的时候，因为用framesloaded语句制作loading，就是利用动画“帧”的特点，他读入的是“帧”，跟字节没有关系，所以我们在动画中多加入几个关键帧，这样效果就十分明显了。
动作脚本解释：
if(_framesloaded>=_totalframes){ file://利用条件语句（if）。条件是：当下载的帧数大于或等于动画全部帧数的时候，执行下面的语句。
gotoAndPlay(3); file://跳转并播放第三帧。
}else{ file://否则。当条件不满足的时候，执行下面的语句。也就是说，当没有下载完全部帧的时候。
_root . loading . _xscale=(_framesloaded/_totalframes*100);
file://设定影片剪辑loading在x轴上的比例为（——_framesloaded/_totalframes*100）这是什么意思呢？就是说用动画全部帧数除以已经下载的帧数，然后乘以100。这个数值就是我们下载得到的帧数的体现。体现在影片剪辑loading的x轴方向上。 gotoAndPlay(1); file://因为没有下载完，我们依然播放第一帧。
}
第三种：getBytesLoaded()和getBytesTotal()
这两个语句意思分别为：获取装载的字节数和动画总的字节数。说到这里，朋友们大概就明白了。我们利用装载的字节数与总的字节数的比值来判断动画是否装载完或者是否达到我们设定的装载位置。这两个语句的优点在于，他们不想上面那两个语句那样，这是粗略的判断影片的帧数。他们能够精细的判断整个动画和下载的动画的字节数，是观众更能够清楚的知道动画的大小和下载速度。下面我们就利用这两个语句来作一个loading。
Flash 8 中的ActionScrpt区中有详细的教程（动画版）
1、 打开flash mx，新建一个文件。
2、 新建一个影片剪辑mc，命名为myloading。
3、 进入影片剪辑myloading编辑区，利用长方形工具画一个进度条。
4、 然后，在100帧处插入关键帧。
5、 返回到影片剪辑myloading的第一帧，利用变形工具，改变进度条的中心点，并使之变形。（在x轴上缩小至消失）
6、 创建形状渐变。
7、 在影片剪辑myloading的编辑区里新建一层，来作进度条的外框。利用墨水瓶工具和复制。这里就不多说了。
8、 回到主场景，打开库面板，把影片剪辑myloading拖放到第一层的第一帧，并延长第二帧。
9、 点击舞台中的影片剪辑，在属性面板中填如其分身名myloading。
10、 在主场景中新建一层，命名为as。在as层的第二帧插入空白关键帧。
11、 分别在as层的第一帧和第二帧加入as语句如下：
第一帧：
a=getBytesLoaded();
b=getBytesTotal();
loaded=int(a/b*100);
myloading . gotoAndPlay( loaded );
第二帧：
if(a==b){
nextScene();
}else{
gotoAndPlay(1);
}
12、 打开场景面板，把现存的场景一改名为：loading。
13、 新建一个场景，并在新场景的第一帧加入一幅图片或一段动画。
14、 测试完成。（参看源文件getBytesLoaded简单进度条）
动作脚本解释：
第一帧：
a=getBytesLoaded(); file://设置变量a等于下载的字节数。
b=getBytesTotal(); file://设置变量b等于动画全部字节数。
loaded=int(a/b*100); file://int为取(a/b*100)的整数（近似值）
myloading . gotoAndPlay( loaded ); file://播放影片剪辑，并以loaded的进度限制。
第二帧：
if(a==b){ file://如果下载的字节数等于全部字节数，则执行下面的语句。
nextScene(); file://播放下一个场景。
}else{ file://否则，（条件不满足时）
gotoAndPlay(1); file://播放第一帧
}
这段语句与上面的语句其实意义都是一样的，都是利用下载的大小除以全部大小来获取百分比。不同的是获取对象一个是帧数，一个是字节数。另外，一个是用as来控制进度条的变化，一个是用限制进度条的播放来进行变化。
以上这几种方法都可以作一个简单的loading，下面介绍的是带有文本框的loading 。通过文本框我们可以随时观察动画的下在进度，这要比上面的loading更加具有人性化。
第四种： 人性化的loading
我们要在这个loading画面上加入具体的下在信息。其中包括：影片的总字节数，已经下载的字节数，总的帧数，已经下载的帧数，所需要的时间和已用的时间，还有下载比例等。
1、 打开Flash MX，新建一个文件。
2、 按照上面我们作的Loading的方法，我们之作一个loading。这里就不多说了。
3、 在主场景的loading层的第一帧，我们利用文本工具分别在舞台中写入总字节数，已下载字节，总帧数，已下载帧数，需要时间，已用时间。字体大小颜色随意。（静态文本）
4、 在对应的静态文本的位置，我们选择动态文本，拉出足够大的文本框。
5、 分别给动态文本设置变量名称。总字节：aby
已下载字节：bby
总帧数：af
以下载帧数：bf
需要时间：at
已用时间：bt
（参看图例loading---精细图例1）
6、 我们打开as层的第二关键帧，在原来的基础上加入as:
if(a==b){
nextScene();
}else{
aby=_root.getBytesTotal();
bby=_root.getBytesLoaded();
bf=_toot._framesloaded;
af=_root._totalframes;
bt=int((getTimer())/1000);
at=int(((aby-bby)/(bby/bt)) bt);
aaa=int(bby/aby*100);
gotoAndPlay(1);
}
7、 作到这里我想不解释大家也一定已经明白是什么意思了。我们是通过动态文本框来显示下载的信息的。需要注意的就是时间的两个语句，开始的时候不是很好理解的。
bt=int((getTimer())/1000); file://bt是“已用时间”变量文本框的名字，我们用getTimer()来获得影片开始的已经用过的时间，/1000是用来换算成秒。Int是用来取整数值。
at=int(((aby-bby)/(bby/bt)) bt); file://at是“共需时间”变量文本框的名称。我们怎样来获取下载完影片所需时间呢？大家注意听下面的一句话，我用语言来表达出来：用影片的总的字节减去已经下载的字节，这样第一个小括号里面就是代表了剩余字节数。第二个小括号是用已经下载的字节数除以下在这些字节用的时间，也就是说，第二个小括号代表了下载的速度。写成---字节/秒。我们用第一个小括号的剩余字节除以下载速度就得到了下载剩余这些字节所用的时间，然后用剩余时间加上前面
的已经是用的时间，这个和，就是我们求得总的下载时间。
不知道大家听明白了没有？
8、完成，测试！（参看源文件getBytesLoaded---精细进度条）
以上是制作loading 的一些简单的技法。制作loading 在技术上其实并不难。我们完全可以通过上面的介绍来完全了解它。
三、loading的风格分类
loading与我们制作的flash动画一样，每个人具有每个人的风格。大体上分为三类：品牌型，内涵型，随意型和趣味型。下面我就具体分析一下这三中loading的形态。
第一类：品牌型。
一个成熟的动画制作高手，都具有自己的品牌loading。就象他们制作的动画一样，具有独特的风格。往往观赏者通过loading的动画就可以知道这是哪一位作者的作品了，而不需要看作者的名称。例如：拾荒的“客栈”等等，朋友们都比我见得多，我就不一一枚举了。这用品牌型的loading的优点在于，它有一种品牌效应，让人们在视觉上感到亲切，从而更盼望下面的内容了。但是，对于初学flash的朋友们，利用这种制作loading 的方法，有利也有弊。一方面可以节约时间，创造个性化的loading。另一方面，你的动画不能达到观众满意的情况下，在此看到你的品牌loading就会下跑了。不会浪费时间等待下载完。
第二类：内涵型。
这种loading 一般是在同一作者的不同作品中不会重复出现的。因为这种loading 的特点就是：通过loading 等待画面来体现动画中的内容。观众在等待的过程中，可以通过较短的时间来大体感受已下动画的内容和意义。这种loading一般是先作动画或作loading。而且在loading 制作方面会花费一定的精力。但是我们现在看到的一般是把动画中的主角或者场景，放到loading 上面的。这种类型的loading在表现上一般不会有大的变化。（因为它要考虑符合剧情）
第三类：随意型。
这种loading 非常普遍，我们在网络上经常可以看见。这种loading带有很大的随意性，它与剧情没有必然联系。制作的表现技法就很大变化。而且它的功能单一，只是起到了一个loading的最低一级的下载等待功能。初学者开始的时候可以试一试，但是当我们了解一些做法以后，就不要在是用这样的loading了。
第四类：趣味型
这种loading等待画面由简单的情节，带有一定的趣味性。是观赏者在等待的过程中并不感到寂寞。生活经验告诉我们，当我们对某一件事情感兴趣而关注的时候，时间是过的最快的。这种loading解决了我们由于带宽而带来的麻烦。这种loading有很广阔的创造空间。
四 loading的设计思维
loading与动画设计是一样的，一个好的loading设计也不是信手拈来的。它需要平时的积累，和努力。
下面我从设计loading的等待画面着手，探讨一下设计思维。
这也是我把这个贴自发到技术交流板块，而没有发到action区的原因了。
在我们的源文件中都会有几个非常优秀的loading。我们怎么样来设计自己的loading呢？
一、 改变原有的现状。我们知道一般的loading 进度条都是x轴上的缩放。我们可不可以把它立起来，变成y轴的缩放。有的人把进度条叫做补血。那么我们把进度条立起来以后，就可以做出许多有意思的东西了。例如把进度条变成温度计，下面加上一推火，随着火的熊熊燃烧，温度计的汞柱随之上升，完成载入画面。
朋友们可以看一下我制作的“温度计----loading”。进度条的x轴变化与y轴变化是没有区别的。除了使用温度计以外，我们还可以联想一下其他具有垂直伸缩的事物，我们都可以把这些东西做成一不不错的loading。
二、 改变进度条的形状
一般情况来说，下载进度条都是一个长方形的条状物。我们先不要把下载进度，看成是一个条状物。我们可以把这种进度条更加形象化，具象化。比方说拟人，拟物等。
通过这种拟人，拟物的变化，loading的外形有了很大的改变。1、人物（事物）大小渐变
我在《三心书屋》之loading设计思维动画示例2中用了QQ逐渐变大的动画来代替补血进度条的变化。最后，出现进入动画的一个按钮。（本动画旨在研究LOADING，所以并没有进行按钮连接。）作补血进度条loading的时候，我们一般都是用形状渐变，在这里我用了移动渐变。可以看出，loading动画可以用许多方法实现，例如透明度，旋转等，我们可以仔细的想想，用最基础的技法，做出千奇百怪的等待画面。
2、现实世界的模拟 （由于精力，时间上面的原因，下面几个里只能有语言来表述了。朋友们可以试一试。见谅！）
“一个人手里那这酒瓶子，歪斜在墙角。随着动画的载入，这个人的脚开始变红，逐渐红变全身。动画载入完成。这个效果可以通过在影片剪辑loading中的遮蔽来完成。”
“一个非常前卫的小伙子，双手把着自己的摩托车。一边大口喘着粗气，一边用脚使劲的打火，随着动画的载入，摩托车的声音越来越大，直至完成。”
象这样的现象或者说素材，比比皆是，重要的是我们要换一个思维方式，注意观察自己身边的生活点滴，一定会做出不同于其他朋友的作品。
3、标志或者眩目的效果
对于是用AS非常熟悉的朋友们，可以用动作脚本来完成一件非常眩目的loading。我们可以利用其他的辅助软件，如ps,fh等，来完成先期制作，然后在flash里面合成，成为这一类的loading。因为每个人的水平和理解不一样，我们做出来的loading效果就大相径庭了。
总而言之，我们不要模仿，或者从网上下载下来的loading，不管其内容是否符合自己的动画，就盲目的在自己的作品中使用。只要注意观察，注意平时的积累，在加上您聪慧的头脑，一个优秀的loading很可能就在您不经意的努力中之作出来。
五 总结
以前我作loading的时候，总是用最简单的语句，最简单的等待画面，敷衍了事。近来看到网上有的朋友们谈论loading的事情，我细细的研究了一下。因为我很少用as，对动作脚本也不太了解，所以我感觉自己写完这篇教程以后，收获很大！从loading的两个方面来讲，程序方面我基本已经了解了。Loading动画呢，与flash动画的区别不大，但是注意作loading动画的时候，一定要注意其大小。不要丢了西瓜捡芝麻啊！哈哈。
1 Loading的作用。
2 Loading的制作。
3 Loading的风格分类。
4 Loading的设计思维。
5 总结
一. Loading的作用。
Loading.英文原意为装载，装填。在flash里面叫做预载画面。我们在欣赏每一件完整的flash作品的时候，都会看到loading的出现。这是因为，动画播放是否流畅取决于网络带宽，对于用调制解调器的朋友们欣赏的时候，loading会预先的加载一部分或全部以后，才能流畅播放。特别是，动画中有音乐或者位图的情况下，loading 的作用就显而易见了。由于上述的条件限制，没有哪一个动画不作loading。Loading发展到现在已经不是简单的一个下载动画的工具了。它已经成为体现主体动画，衬托主体的一个载体。Loading分为两个大部分。一个是功能类的（指下载作用功能）另一部分是等待动画。下面我们就从这两个方面来研究一下。
二 Loading的制作
制作loading 有许多的方法。我们从最简单的开始向大家介绍：
第一种：loading( 假的 )
也就是假loading。这种loading我想在某些人的动画中也会出现。我就曾经作了一个。我先作的动画，最后作loading,时值夜半，睡意朦胧，恍惚中作了一个。欣喜之余，马上发布。天明清醒，遂发现loading没加as。故称为（假）loading 。幸好，动画不长，没人发现。心中窃喜。在这里告诫朋友们，loading 也是我们的作品的一部分，我们要用正确的态度来对待它。
第二种：用ifFrameLoaded语句来完成。
IfFrameLoaded现在已经被MX给否决了。MX不提倡用此语句。但是还是可用的。完整的语句为：
If|FrameLoaded(欲加载的场景 . 欲加载的帧数或帧标签){
GotoAndPlay(正式动画的第一帧)
此语句的缺点是，它只能判断欲载程序是否到某一帧。可是如果此帧的后面有许多音乐或位图，播放以后还是不流畅的。
好了，我们一起来作一个简单的Loading吧！
1 打开flashMX，新建文件。
2 插入---新建元件----名称“loading”----类型（影片剪辑）
3 进入loading影片剪辑编辑区后，用文本工具写入“loading”。按F6复制此内容四帧。并删除第二帧，第二四帧的内容。保存！（参看附图ifFrameLoaded---1）
4 回到主场景，把名称为”loading”的影片剪辑拖入到第一层。并延长到第二帧（F5）
5 新建一层，命名为“as”。在第一帧，和第二帧分别插入关键帧。第一帧加入as：ifFrameLoaded(3){
gotoAndPlay(3);
}
第二帧加入as: gotoAndPlay(1);
6 新建一层，命名为主动画。
7 在主动画层的第三帧，插入关键帧，放置你的动画。也就是说，动画可以从这里开始作。（参看附图ifFrameLoaded---2）
8 按Ctrl Enter 两次，欲览loading 。如果你作的动画比较小的化。可以改变swf文件菜单栏中的调试项，选择低一点的速度。
9 完成！（参看源文件ifFrameLoaded）
由于影片剪辑有不受主时间线控制的特点，整个loading呈现的是不停闪烁的文字“loading…”的画面。我们分析一下这条语句。
第一帧：
IfFrameLoaded(3){ file://如果加载完第三帧，执行大括号里面的语句
GotoAndPlay(3);
} file://转到并播放第三帧。
第二帧：
gotoAndPlay(1); file://转到并播放第一帧。
也就是说从第一帧到第二帧是一个小的循环。如果第一帧没有加载完，时间先就到了第二帧，第二帧的语句是gotoAndPlay(1)，所有时间线又回到第一帧播放。循环几次以后，当ifFrameLoaded判断已经加载完动画以后，就执行gotoAndPlay(3)去播放。
这个语句的缺点是显而易见的。它的判断是根据动画中的帧的多少来进行的。我们知道，动画中的帧大小是不一样的，关键帧就要比延长帧大。这样，你就无法准确的判断欲加载的帧数是否适合网络带宽。这也是这个语句的弊病。再有，此语句其实就是一个判断语句，在flash MX中可以用if来完成。
第三种：_framesloaded语句
在Flash MX中，用_framesloaded来替代ifFrameLoaded。我们来看看它的用法。
_framesloaded语句是影片剪辑的属性，在properties集合中。我们来用它来判断我们的欲加载帧数。下面我们用它来作一个简单Loading
1 打开Flash MX，新建文件。
2 利用上面的例子做出影片剪辑Loading。
3 回到主场景，把影片剪辑放到第一层，并延长到第二帧。
4 新建一层，命名为as层，在第二帧加入关键帧。并加入as.如下：
if(_framesloaded>=3){
gotoAndStop(3);
}else{
gotoAndPlay(1)；
}
5 新建第三层。命名图片层。在第三帧插入关键帧，导入一幅图片。
6完成！（参看源文件framesloaded）
解释一下语句的含义：
if(_framesloaded>=3){ file://如果（if）影片加载的帧数大于或等于第三帧的化，执行下面大括号里面的语句。
gotoAndStop(3); file://上面条件成立，则转到并停止在当前场景的第三帧。
}else{ file://如果上面的条件不成立，则执行else下面的语句
gotoAndPlay(1)；//如果条件不成立，则执行转到并播放当前场景的第一帧。（循环，直到条件成立）
}
上面用到了一个条件语句（if）如果大家熟悉条件语句的化，就很容易明白。
利用framesloaded我们还可以做出另外一种比较人性化的Loading，就是加入载入条。载入条可以动态的显示影片的加载情况，是观众能够清楚明了的知道影片的加载过程。利用framesloaded就可以作一个简单的加载条。
我们一起来吧！
1、 打开flash MX，新建一个文件。
2、 新建一个影片剪辑mc，名称为loading。
3、 进入影片剪辑loading编辑区。利用长方形工具画一个长方形进度条。颜色随意。
4、 返回主场景，打开库面板，把影片剪辑loading拖放到主场景的第一层第一帧。并延长到第二帧。（F5）在下面的属性面板中填入影片剪辑loading的分身名”loading”。
5、 新建一层，命名为AS层，在第二帧插入关键帧，打开AS面板，加入如下AS语句：
6、 if(_framesloaded>=_totalframes){
gotoAndPlay(3);
}else{
_root . loading . _xscale=(_framesloaded/_totalframes*100);
gotoAndPlay(1);
}
7、 新建一层，命名为pic，插入几个关键帧，并对应的加入图片。（参看图例framesloaded—1）
8、 Ctrl Enter测试，完成！
注意事项：
1、 制作影片剪辑loading的时候，我们要把长方形的进度条的中心点改变到左侧。这样在测试的时候，进度条就会逐渐的向右延伸。(参看图例framesloaded—注意事项1)
2、 一定在属性面板中加入影片剪辑的分身名，不然as就不知道控制谁了。（参看图例frameloaded—注意事项2）
3、 我们还可以在主场景加一个进度条的外围框，朋友们自己动手去作罢。
4、 朋友们在制作的时候，因为用framesloaded语句制作loading，就是利用动画“帧”的特点，他读入的是“帧”，跟字节没有关系，所以我们在动画中多加入几个关键帧，这样效果就十分明显了。
动作脚本解释：
if(_framesloaded>=_totalframes){ file://利用条件语句（if）。条件是：当下载的帧数大于或等于动画全部帧数的时候，执行下面的语句。
gotoAndPlay(3); file://跳转并播放第三帧。
}else{ file://否则。当条件不满足的时候，执行下面的语句。也就是说，当没有下载完全部帧的时候。
_root . loading . _xscale=(_framesloaded/_totalframes*100);
file://设定影片剪辑loading在x轴上的比例为（——_framesloaded/_totalframes*100）这是什么意思呢？就是说用动画全部帧数除以已经下载的帧数，然后乘以100。这个数值就是我们下载得到的帧数的体现。体现在影片剪辑loading的x轴方向上。 gotoAndPlay(1); file://因为没有下载完，我们依然播放第一帧。
}
第三种：getBytesLoaded()和getBytesTotal()
这两个语句意思分别为：获取装载的字节数和动画总的字节数。说到这里，朋友们大概就明白了。我们利用装载的字节数与总的字节数的比值来判断动画是否装载完或者是否达到我们设定的装载位置。这两个语句的优点在于，他们不想上面那两个语句那样，这是粗略的判断影片的帧数。他们能够精细的判断整个动画和下载的动画的字节数，是观众更能够清楚的知道动画的大小和下载速度。下面我们就利用这两个语句来作一个loading。
Flash 8 中的ActionScrpt区中有详细的教程（动画版）
1、 打开flash mx，新建一个文件。
2、 新建一个影片剪辑mc，命名为myloading。
3、 进入影片剪辑myloading编辑区，利用长方形工具画一个进度条。
4、 然后，在100帧处插入关键帧。
5、 返回到影片剪辑myloading的第一帧，利用变形工具，改变进度条的中心点，并使之变形。（在x轴上缩小至消失）
6、 创建形状渐变。
7、 在影片剪辑myloading的编辑区里新建一层，来作进度条的外框。利用墨水瓶工具和复制。这里就不多说了。
8、 回到主场景，打开库面板，把影片剪辑myloading拖放到第一层的第一帧，并延长第二帧。
9、 点击舞台中的影片剪辑，在属性面板中填如其分身名myloading。
10、 在主场景中新建一层，命名为as。在as层的第二帧插入空白关键帧。
11、 分别在as层的第一帧和第二帧加入as语句如下：
第一帧：
a=getBytesLoaded();
b=getBytesTotal();
loaded=int(a/b*100);
myloading . gotoAndPlay( loaded );
第二帧：
if(a==b){
nextScene();
}else{
gotoAndPlay(1);
}
12、 打开场景面板，把现存的场景一改名为：loading。
13、 新建一个场景，并在新场景的第一帧加入一幅图片或一段动画。
14、 测试完成。（参看源文件getBytesLoaded简单进度条）
动作脚本解释：
第一帧：
a=getBytesLoaded(); file://设置变量a等于下载的字节数。
b=getBytesTotal(); file://设置变量b等于动画全部字节数。
loaded=int(a/b*100); file://int为取(a/b*100)的整数（近似值）
myloading . gotoAndPlay( loaded ); file://播放影片剪辑，并以loaded的进度限制。
第二帧：
if(a==b){ file://如果下载的字节数等于全部字节数，则执行下面的语句。
nextScene(); file://播放下一个场景。
}else{ file://否则，（条件不满足时）
gotoAndPlay(1); file://播放第一帧
}
这段语句与上面的语句其实意义都是一样的，都是利用下载的大小除以全部大小来获取百分比。不同的是获取对象一个是帧数，一个是字节数。另外，一个是用as来控制进度条的变化，一个是用限制进度条的播放来进行变化。
以上这几种方法都可以作一个简单的loading，下面介绍的是带有文本框的loading 。通过文本框我们可以随时观察动画的下在进度，这要比上面的loading更加具有人性化。
第四种： 人性化的loading
我们要在这个loading画面上加入具体的下在信息。其中包括：影片的总字节数，已经下载的字节数，总的帧数，已经下载的帧数，所需要的时间和已用的时间，还有下载比例等。
1、 打开Flash MX，新建一个文件。
2、 按照上面我们作的Loading的方法，我们之作一个loading。这里就不多说了。
3、 在主场景的loading层的第一帧，我们利用文本工具分别在舞台中写入总字节数，已下载字节，总帧数，已下载帧数，需要时间，已用时间。字体大小颜色随意。（静态文本）
4、 在对应的静态文本的位置，我们选择动态文本，拉出足够大的文本框。
5、 分别给动态文本设置变量名称。总字节：aby
已下载字节：bby
总帧数：af
以下载帧数：bf
需要时间：at
已用时间：bt
（参看图例loading---精细图例1）
6、 我们打开as层的第二关键帧，在原来的基础上加入as:
if(a==b){
nextScene();
}else{
aby=_root.getBytesTotal();
bby=_root.getBytesLoaded();
bf=_toot._framesloaded;
af=_root._totalframes;
bt=int((getTimer())/1000);
at=int(((aby-bby)/(bby/bt)) bt);
aaa=int(bby/aby*100);
gotoAndPlay(1);
}
7、 作到这里我想不解释大家也一定已经明白是什么意思了。我们是通过动态文本框来显示下载的信息的。需要注意的就是时间的两个语句，开始的时候不是很好理解的。
bt=int((getTimer())/1000); file://bt是“已用时间”变量文本框的名字，我们用getTimer()来获得影片开始的已经用过的时间，/1000是用来换算成秒。Int是用来取整数值。
at=int(((aby-bby)/(bby/bt)) bt); file://at是“共需时间”变量文本框的名称。我们怎样来获取下载完影片所需时间呢？大家注意听下面的一句话，我用语言来表达出来：用影片的总的字节减去已经下载的字节，这样第一个小括号里面就是代表了剩余字节数。第二个小括号是用已经下载的字节数除以下在这些字节用的时间，也就是说，第二个小括号代表了下载的速度。写成---字节/秒。我们用第一个小括号的剩余字节除以下载速度就得到了下载剩余这些字节所用的时间，然后用剩余时间加上前面
的已经是用的时间，这个和，就是我们求得总的下载时间。
不知道大家听明白了没有？
8、完成，测试！（参看源文件getBytesLoaded---精细进度条）
以上是制作loading 的一些简单的技法。制作loading 在技术上其实并不难。我们完全可以通过上面的介绍来完全了解它。
三、loading的风格分类
loading与我们制作的flash动画一样，每个人具有每个人的风格。大体上分为三类：品牌型，内涵型，随意型和趣味型。下面我就具体分析一下这三中loading的形态。
第一类：品牌型。
一个成熟的动画制作高手，都具有自己的品牌loading。就象他们制作的动画一样，具有独特的风格。往往观赏者通过loading的动画就可以知道这是哪一位作者的作品了，而不需要看作者的名称。例如：拾荒的“客栈”等等，朋友们都比我见得多，我就不一一枚举了。这用品牌型的loading的优点在于，它有一种品牌效应，让人们在视觉上感到亲切，从而更盼望下面的内容了。但是，对于初学flash的朋友们，利用这种制作loading 的方法，有利也有弊。一方面可以节约时间，创造个性化的loading。另一方面，你的动画不能达到观众满意的情况下，在此看到你的品牌loading就会下跑了。不会浪费时间等待下载完。
第二类：内涵型。
这种loading 一般是在同一作者的不同作品中不会重复出现的。因为这种loading 的特点就是：通过loading 等待画面来体现动画中的内容。观众在等待的过程中，可以通过较短的时间来大体感受已下动画的内容和意义。这种loading一般是先作动画或作loading。而且在loading 制作方面会花费一定的精力。但是我们现在看到的一般是把动画中的主角或者场景，放到loading 上面的。这种类型的loading在表现上一般不会有大的变化。（因为它要考虑符合剧情）
第三类：随意型。
这种loading 非常普遍，我们在网络上经常可以看见。这种loading带有很大的随意性，它与剧情没有必然联系。制作的表现技法就很大变化。而且它的功能单一，只是起到了一个loading的最低一级的下载等待功能。初学者开始的时候可以试一试，但是当我们了解一些做法以后，就不要在是用这样的loading了。
第四类：趣味型
这种loading等待画面由简单的情节，带有一定的趣味性。是观赏者在等待的过程中并不感到寂寞。生活经验告诉我们，当我们对某一件事情感兴趣而关注的时候，时间是过的最快的。这种loading解决了我们由于带宽而带来的麻烦。这种loading有很广阔的创造空间。
四 loading的设计思维
loading与动画设计是一样的，一个好的loading设计也不是信手拈来的。它需要平时的积累，和努力。
下面我从设计loading的等待画面着手，探讨一下设计思维。
这也是我把这个贴自发到技术交流板块，而没有发到action区的原因了。
在我们的源文件中都会有几个非常优秀的loading。我们怎么样来设计自己的loading呢？
一、 改变原有的现状。我们知道一般的loading 进度条都是x轴上的缩放。我们可不可以把它立起来，变成y轴的缩放。有的人把进度条叫做补血。那么我们把进度条立起来以后，就可以做出许多有意思的东西了。例如把进度条变成温度计，下面加上一推火，随着火的熊熊燃烧，温度计的汞柱随之上升，完成载入画面。
朋友们可以看一下我制作的“温度计----loading”。进度条的x轴变化与y轴变化是没有区别的。除了使用温度计以外，我们还可以联想一下其他具有垂直伸缩的事物，我们都可以把这些东西做成一不不错的loading。
二、 改变进度条的形状
一般情况来说，下载进度条都是一个长方形的条状物。我们先不要把下载进度，看成是一个条状物。我们可以把这种进度条更加形象化，具象化。比方说拟人，拟物等。
通过这种拟人，拟物的变化，loading的外形有了很大的改变。1、人物（事物）大小渐变
我在《三心书屋》之loading设计思维动画示例2中用了QQ逐渐变大的动画来代替补血进度条的变化。最后，出现进入动画的一个按钮。（本动画旨在研究LOADING，所以并没有进行按钮连接。）作补血进度条loading的时候，我们一般都是用形状渐变，在这里我用了移动渐变。可以看出，loading动画可以用许多方法实现，例如透明度，旋转等，我们可以仔细的想想，用最基础的技法，做出千奇百怪的等待画面。
2、现实世界的模拟 （由于精力，时间上面的原因，下面几个里只能有语言来表述了。朋友们可以试一试。见谅！）
“一个人手里那这酒瓶子，歪斜在墙角。随着动画的载入，这个人的脚开始变红，逐渐红变全身。动画载入完成。这个效果可以通过在影片剪辑loading中的遮蔽来完成。”
“一个非常前卫的小伙子，双手把着自己的摩托车。一边大口喘着粗气，一边用脚使劲的打火，随着动画的载入，摩托车的声音越来越大，直至完成。”
象这样的现象或者说素材，比比皆是，重要的是我们要换一个思维方式，注意观察自己身边的生活点滴，一定会做出不同于其他朋友的作品。
3、标志或者眩目的效果
对于是用AS非常熟悉的朋友们，可以用动作脚本来完成一件非常眩目的loading。我们可以利用其他的辅助软件，如ps,fh等，来完成先期制作，然后在flash里面合成，成为这一类的loading。因为每个人的水平和理解不一样，我们做出来的loading效果就大相径庭了。
总而言之，我们不要模仿，或者从网上下载下来的loading，不管其内容是否符合自己的动画，就盲目的在自己的作品中使用。只要注意观察，注意平时的积累，在加上您聪慧的头脑，一个优秀的loading很可能就在您不经意的努力中之作出来。
五 总结
以前我作loading的时候，总是用最简单的语句，最简单的等待画面，敷衍了事。近来看到网上有的朋友们谈论loading的事情，我细细的研究了一下。因为我很少用as，对动作脚本也不太了解，所以我感觉自己写完这篇教程以后，收获很大！从loading的两个方面来讲，程序方面我基本已经了解了。Loading动画呢，与flash动画的区别不大，但是注意作loading动画的时候，一定要注意其大小。不要丢了西瓜捡芝麻啊！哈哈。
540
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
