[教学]Loading Bar 进度表制作（已完成）

yawchoong

>>>>>>参考原处(xzzhangg)<<<<<<

>>>>>>参考原处(super tomato)<<<<<<

参考了xzzhangg和super tomato的帖子，发现，所用的方法都大致上都一样，发现super tomato的教学会比较简单和快速，只是super tomato少了下载巴仙率的小语言，
我把xzzhangg和super tomato的教学二合一，希望大家更容易明白，
在此想要对xzzhangg和super tomato道歉，因为转帖了你们的教学，
也要谢谢两位把这个教学放出来，恕我直言，super tomato的教学有一些快速，导致有些新手的朋友不明白，所以我再把它简单化

在此，我也加入我自己领悟的小贴士，就是把下载了多少巴仙，改为还有多少巴仙未下载，
虽然这是很简单的教学，希望大家多多支持

为了让各位网友能够更容易的明白教学，我把教学分三个步骤



步骤一∶先制作一个简单的进度表

步骤二∶在舞台上加上已下载数值和未下载数值的字体栏

步骤三∶在舞台上要加入的脚本语言


[ 本帖最后由 yawchoong 于 23-5-2006 11:48 PM 编辑 ]

yawchoong

步骤一∶先制作一个简单的进度表

图一
首先创造一个元件，ctrl+F8 create new symbol ，要是movie clip,


图二
然后进入这个元件，在第一个帧里加入这个语言

stop();

图三
然后在第一个帧上，先画一个长方格，宽度可以长或短，可以是1或任何一个数值

图四
在第一百个帧，加入keyframe,ctrl+F6,然后把那个长方格的宽度加长，宽度任由自己发挥

图五
最后，为这个补间设为shape


在这一个步骤里，可以任由发挥，也可以画一条线，
可是条件是要第一百个帧

[ 本帖最后由 yawchoong 于 19-5-2006 12:03 AM 编辑 ]

yawchoong

图六
然后回到舞台上，在舞台上，用文字工具画一个长方格，然后设为dynamic text,


要记得，不要把格里的字体大小设得太大，一面播放时，由于不够位，只显示一半的文字


图七
然后，也照办画多一个，

把第一个文字格的实例名设为loadtxt
第二个设为inloadtxt

如果只是要"动画已下载了xx%而已”，就只放一个文字格，
若要两个，就放两个，
实例名是可以变动的，可是，当换名时，记得在第三步骤时，也记得要换名

[ 本帖最后由 yawchoong 于 19-5-2006 12:09 AM 编辑 ]

yawchoong

在舞台的第一帧，加上这个script
然后在第二帧，才开始你们的动画

stop();
this.onEnterFrame=function(){
        var percent=int(_root.getBytesLoaded()/_root.getBytesTotal()*100);
        var inpercent=100-percent;
        loader.gotoAndStop(percent);
        loadtxt.text= "动画总下载了"+percent+"%";
        inloadtxt.text= "动画还有"+inpercent+"% 未下载";
        if(percent>=100){
                delete this.onEnterFrame;
                play();
        }
}

请注意：
1)红色字是元件的实例名 instance name
2)青色字是你给脚本语言里的参数取的名

这些名字都可以自己更改，可是最后在脚本语言里，名要相对


当完成了这些步骤，就大功告成

[ 本帖最后由 yawchoong 于 17-5-2006 11:54 PM 编辑 ]

懃

如果要loading一次后,就永远不要再看到loading的bar,要怎样做?

super-tomato

原帖由 懃 于 22-5-2006 01:59 AM 发表
如果要loading一次后,就永远不要再看到loading的bar,要怎样做?

跟著做 + 去理解 = 永遠的答案

懃

我后来想到了一个方法:

loader._visible=false
loader.onEnterFrame=function(){
        var percent=int(_root.getBytesLoaded()/_root.getBytesTotal()*100);
        this._visible=percent<5?true:""   
        var inpercent=100-percent;
        this.gotoAndStop(percent);
        this.loadtxt.text= "动画总下载了"+percent+"%";
        this.inloadtxt.text= "动画还有"+inpercent+"% 未下载";
        if(percent>=100){
                delete this.onEnterFrame;
                play();
        }
}

好像就可以了...
谢谢super-tomato的提醒...

大家有兴趣的话可以试一试...

[ 本帖最后由 懃 于 23-5-2006 11:19 PM 编辑 ]

super-tomato

原帖由 懃 于 22-5-2006 08:05 PM 发表


什么意思?
我有跟着做,也完全明白了...
我只是想问,怎样避免如果已经download了那个flash file后,再一次load的时候,那loading bar不会出现...
后来我想到一个方法,把text field也搬进movieclip里,改成:

...

既然你有辦法進行思考而解決﹐那麼為何不先行而告之
http://chinese.cari.com.my/myfor ... ge=1&highlight=

[ 本帖最后由 super-tomato 于 23-5-2006 11:56 AM 编辑 ]

yawchoong

loader._visible=false
loader.onEnterFrame=function(){
        var percent=int(_root.getBytesLoaded()/_root.getBytesTotal()*100);
        this._visible=percent<5?true:""   //如果是不要show loading bar,删除这一句也可以
        var inpercent=100-percent;
        this.gotoAndStop(percent);
        this.loadtxt.text= "动画总下载了"+percent+"%";
        this.inloadtxt.text= "动画还有"+inpercent+"% 未下载";
        if(percent>=100){
                delete this.onEnterFrame;
                play();
        }
}

这是你的，
如果我跟着做，虽然是loading bar 看不到，可是我的text box也看不到

stop();
this.onEnterFrame=function(){
        var percent=int(_root.getBytesLoaded()/_root.getBytesTotal()*100);
        var inpercent=100-percent;
        loader.gotoAndStop(percent);
        loader.loadtxt .text= "动画总下载了"+percent+"%";
        loader.inloadtxt .text= "动画还有"+inpercent+"% 未下载";
        if(percent>=100){
                delete this.onEnterFrame;
                play();
        }
}

这是我的做法


还有一样奇怪的，就是既然你不要show laoding bar,为什么还要放 "        loader.gotoAndStop(percent);"??
到不如把这行删除，也把loading bar mc 里的动画删除，剩余text area

[ 本帖最后由 yawchoong 于 23-5-2006 11:47 PM 编辑 ]

yawchoong

stop();
        if(_root.getBytesLoaded()==_root.getBytesTotal()){
                gotoAndPlay(2);
        }else{
                gotoAndPlay(1)
}

还有一个方法更简单，如果什么都不要显示，
就这一行

懃

原帖由 yawchoong 于 23-5-2006 11:37 PM 发表

这是你的，
如果我跟着做，虽然是loading bar 看不到，可是我的text box也看不到


这是我的做法


还有一样奇怪的，就是既然你不要show laoding bar,为什么还要放 "        loader.gotoAndStop(percent); ...

对不起,其实我的想法有点多虑了...
我的意思是,第一次进去的话,loading bar会出现,但第二次进去时,不要再看见那loading bar了,连一瞬间出现也不要...
比如我有两个files,mv1.swf和mv2.swf,如果我用loadMovie的方式从mv1.swf load mv2.swf...
但,当mv2.swf load回来mv1.swf时,那loading bar 会再出现一阵子才消失,我就是要避开这一瞬间...


我想到的方法是,当file的loading percentage少过5%的话,就出现loading bar,不然就消失...

yawchoong

有一点不是很明白，是不是说当mv2.swf播完了，要按replay button时？试试gotoAndPlay();

懃

原帖由 yawchoong 于 24-5-2006 02:47 PM 发表
有一点不是很明白，是不是说当mv2.swf播完了，要按replay button时？试试gotoAndPlay();

mv1.swf
(loading...)

this.loadMovie("mv2.swf")
(loading...)

当回去mv1
this.loadMovie("mv1.swf")

(loading bar是不是会出现一下子...percentage is 100%)
我就是不要再看到这个bar了...

懃

原帖由 开心D过每一天啦 于 29-5-2006 07:38 AM 发表


你的意思是flash档第一次开会有loading动画,当它下载到电脑以后，再打开它时，它的loading动画不再出现？像酱？

http://geocities.com/happy_to_everyday/loading-mask.html

在第一帖的acion写:

loa ...

大概是酱的意思吧...

落翼天使

我是flash新手。我跟着楼主说的做，loading bar是做到了，可是当我导入我所做的flash 时，loading bar却不会跑？请问是先跟做好的flash转成swf file先吗？还是要在第二帖加什么AS？

samuria

请问是用什么ｓｏｆｔｗａｒｅ　？

kry183

原帖由 落翼天使 于 4-2-2007 02:39 PM 发表
我是flash新手。我跟着楼主说的做，loading bar是做到了，可是当我导入我所做的flash 时，loading bar却不会跑？请问是先跟做好的flash转成swf file先吗？还是要在第二帖加什么AS？

在loading bar的movie clip,instance name那里设定为loader

第二个frame应该加个
stop();

这样应该可以了

jun23

哈罗....想问一下....相信大家都有制作preloader的经验, 大多数是有一个bar显示load progress或巴仙率...如果我想把一组数字比如从1997跳到2007...变成loading 的Progress, (或者说, 我自己customise一个animation, 但是是跟着Loading progress变出来...) 要怎么做呢??