常见的loading条制作方法

2016-01-29 12:38 49 1 收藏

常见的loading条制作方法,常见的loading条制作方法

【 tulaoshi.com - Flash 】

首先我们在制作一个东西的时候我们应该有明确的思路和目标,下面让我们来看看制作思路。

思路:计算出影片的总字节数和正在下载的字节数,将正在下载的字节数除以影片的总字节数并乘以100%获得百分比例,再将其得到的百分数来带动Loading条的滚动。


制作方法如下:

步骤1 打开FLASH,执行"文件---新建"命令或按下CTEL+N建,新建一个文件;

步骤2 利用文本工具绘制个文本框,选择此文本为动态文本设置其变量名为bfb(如图1);

图1

步骤3 Ctrl+F8我们来绘制一个MC(影片剪辑),命名为loading(如图2),在属性面板里命名实例名称为MC;

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/flash/)

图2

[next]

步骤4 选择矩形工具绘制一个长条,填充颜色为无,边框颜色为黑色;

步骤5 新建立一个图层,复制第1个图层的矩形框并粘贴到新建的图层,位置不变,此时填充颜色为黄色(可以自己定义),边框颜色为无(如图3);

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/flash/)

图3

步骤6 在第1层的第100帧出插入帧,第2层第100帧处插入关键帧;

步骤7 图层2中的loading条制作变形动画,首先在第1帧处设置其宽度为1,最后1帧宽度不变,在中间创建补间动画并在第1帧动作面板里加入stop():语句(如图4);

图4

[next]

步骤7 回到主场景,将名为loading的MC(影片剪辑),拖到主场景,并在第1层第3帧处插入普通帧,新建图层2同样第3帧处插入空白关键帧(如图5);

图5

步骤8 在第2层的第2帧处加入如下代码:


[Copy to clipboard] [ - ]CODE:
yxz=_root.getBytesLoaded();//已下载BYTE数
zxz=_root.getBytesTotal();//总下载BYTE数
bfb=int(yxz/zxz*100)+"%";//计算下载百分比
mc.gotoAndStop(int(yxz/zxz*100));//下载到百分之几就播放MC的第几帧


步骤9 同样在第3帧处动作面板里加入如下代码:


[Copy to clipboard] [ - ]CODE:
if(yxz==zxz)
{
        gotoAndPlay(4);

}
else
{
        gotoAndPlay(1);

}


注意:此处目的在于判断已下载的字节数是否与影片总字节数BYTE是否相等,如果不等则继续loading。


步骤10 最好将动态文本框和Loading条摆放好位置就OK咯(如图6);

图6

最后说明下 自认为做得很丑,但原理和方法是正确的。

 

来源:http://www.tulaoshi.com/n/20160129/1486905.html

延伸阅读
Loading条常用于网页中的等待时间,目的是减少用户等待时的烦躁感,以此来增加用户体验。在很多地方我们都能发现loading条的应用,比如表单,提交,下载等等。本文将分析对于网页客户端来说,在页面什么位置摆放loading条是最有效的。 可用性研究表明,当响应时间超过一秒钟时,用户便能够有所察觉。 虽然在反馈系统中,当用户需要等待时,更...
绗纸DIY 卷纸圣诞贺卡制作方法 做一张漂亮的圣诞卡难吗?一点都不难,仔细数数,只有4个步骤: 1、想一个好点子; 2、准备素材; 3、精心制作; 4、写下真诚的祝福。 相信这张你亲手制作的圣诞卡一定能将你的祝福传达给最尊敬的老师! 好创意是手工圣诞卡成功与否的关键。如果你暂时没有什么想法,不用着急,一起去看看别人的作品,...
原料 准备糯米1千克,红曲40克,也可用白色酒曲、甜酒曲代替,清水1.6升,烧酒适量。 淘米 选择上等糯米放于盆中,用清水淘洗2遍左右,洗干净即可。 浸泡 往洗好米的盆中加入适量清水,淹没糯米3公分左右为宜。25~15度温度浸泡8小时,15度以下浸泡14小时,以米粒浸透至无白心为宜。 ...
灯笼的制作方法视频 灯笼的制作方法:准备材料 需要准备的材料有任意尺寸的工艺装饰环,如果没有的话也可以用其他东西代替,或者根据自己需要的来确定尺寸。 灯笼的制作方法:剪裁纸条 首先我们要做的就是剪裁合适数量和宽度的纸条,然后将裁剪的纸条用白乳胶粘贴到环上(如图所示)。 灯笼的制作方法:纸条续接 将第一圈完成...
沙棘是一种在无论多么恶劣的环境都能生长出的一种果实,我国的西北部很多地方都有种植,是一种非常好吃的中草药,今天图老师小编就为大家介绍一下沙棘的制作方法以及沙棘的功效与作用吧。 沙棘的营养价值 沙棘是目前世界上含有天然维生素种类最多的珍贵经济林树种,其维生素C的含量远远高于鲜枣和猕猴桃,从而被誉为天然维生...

经验教程

402

收藏

87
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部