您的位置: 首页 > 技术文档 > 多媒体制作 > 完美的loading—完美到底
鼠标特效--弹性框架的制作 回到列表 用纯AS写滚动条
 完美的loading—完美到底

作者:awflasher 时间: 2006-03-24 文档类型:原创 来自:蓝色理想

第 1 页 基础
第 2 页 利器
第 3 页 减负

首先,想说一下我写此文的动机。记得很早之前我曾经说过“没有loading的flash,不是完整的flash”。我想那个句话可能偏激了。因为有时候一些不到10k的flash,确实不需要做什么loading。但我始终认为,做一个优秀的loading是衡量一个flasher水准,甚至态度的。你问我为什么,我可以告诉你,因为loading是唯一一个你不会多看而所有用户、客户会看的东西,所以你对loading的重视程度,甚至可以反衬你这个flasher的职业道德!

有些做设计为主的朋友,我认识不少,他们对loading都是得过且过的态度,做一个loading,更多的是自己找一个现成的,然后每次去套用,我个人认为是很不好的习惯。并不是说我不提倡代码、元件的重用度,而是我觉得对于loading这种东西,套多了,是要出问题的。我强烈建议那些已经达到可以修改人家loading水平的flasher看看我的东西,当然,如果你连flash的as该写在哪都不知道,建议先入门了。

好,下面切入正题,如何制作loading:

首先要感激Macromedia的大智慧,提供了很好的两个函数使我们可以做出完美的loading,那就是getBytesLoaded和getBytesTotal。请不要再用你改来改去改了两三年的那个什么getFrameLoaded什么什么了,我都记不清楚怎么拼了。我只想说,Frame的观念将在真正的Interactive-Design中淡化。更别提什么Scene,那是Flash的败笔!

那么loading如何工作呢?我们如何利用这两个函数呢?这里要提到一个重要的概念。就是间隔调用。间隔调用有多种方式,下面列举出来,并列举出其在loading制作中的地位和用法,欢迎补充:

·setInterval方式

写法:

function loadCheck()
{
  var p = getBytesLoaded()/getBytesTotal();
  if (p==1)
  {
    clearInterval(intervalID); // 释放间隔调用
    gotoAndPlay(someFrame); // 开始播放
  }
}
var interval = 30; // 这个数值是刷新频率
var intervalID = setInterval(loadCheck,interval);

我个人并不推荐初学者用这种写法。因为很多人容易忽视clearInterval,而这个东西被忽视掉,是很恐怖的!如果你的setInterval没有给及时移除,意味着你将在整个swf的播放过程中增加一个没有必要的负担!
而且这种方法很不适合控制MoiveClip的状况(因为初学者会发现MC的路径是个大问题,而loadCheck本身就是个函数,还是被setInterval调用的,要在loadCheck中指一个路径出来,挺麻烦的,你不要指望_root,那样会让你的程序不规范;也不要指望this,因为在函数中用this似乎不太理想;最好什么都不写,但往往你不敢不写),进而做出更好的效果。

·onEnterFrame方式

我最喜欢的就是这种方法了。比较方便、直观。因为往往我们是要用一个MC体现一个loading的进度,比如,一个进度条,或者更有创意的东西,只有你不能想到的,没有你不能做到的。

那么究竟如何用呢。首先,把创意定好。然后给你的MC一个实例名字,比如叫做loader_mc。这时候在timeline上写代码,记住,是timeline而不是MC上。因为这样便于代码统一、便于路径统一、便于管理和寻找。别为了省几个字母就把代码通通搬到button,mc上面去,然后一个on(press)了事。除非你是在敷衍你的作品;或者你是在为了交作业。

loader_mc.onEnterFrame = function ()
{
  var getTar:MovieClip = this._parent;
  var p = getTar.getBytesLoaded()/getTar.getBytesTotal();
  trace(p);
  if(p==1)
  {
    this.onEnterFrame = null;
    gotoAndPlay(someFrame); // 开始播放
  }

}

就这么简单,记住,在MC的事件函数体内部引用MC,永远是一件很快的事情。因为this就可以指向这个MC本身,通过诸如this._parent之类的方法,可以找到你所有的MC!

·直接依赖于timeline的循环方式

非常非常非常古老的方式了,不介绍了。不过你们可以去问问那些一直不喜欢自己动手做loading的flasher,他们也许在改的某一个版本就是这个,呵呵。

以上算是比较简单的。比较容易出问题的,还有两个。
第一、MovieClipLoader
第二、含有多种V2组件的Loader

出处:蓝色理想
责任编辑:moby

上一页 下一页 利器

◎进入论坛Flash专栏版块参加讨论

相关文章
loading 的详细制作
关于linkage的loading问题
Flash Load Movie 的教程
热门搜索:CSS Fireworks 设计比赛 网页制作 web标准 用户体验 UE photoshop Dreamweaver Studio8 Flash 手绘 CG
站点最新 站点最新列表
全兼容的纯CSS级联菜单要点浅析
CSS Sprites 图片整合技术
雅安,一场中式旅行
热烈祝贺"醒狮杯"圆满结束
菊花宝典大赏大奖教程《阳台》
交互设计师怎样和产品团队合作
Photoshop打造个性潮流音乐海报
简单解读面包屑
CSS盒模型
Apple与Microsoft网站可用性研究
栏目最新 栏目最新列表
safari 4 新特性
Photoshop制作精美高光流线字
IE下img多余5像素空白解决方法
XHTML1.0与HTML兼容指引16条
JavaScript优化细节
全兼容的纯CSS级联菜单要点浅析
CSS Sprites 图片整合技术
Photoshop打造个性潮流音乐海报
CSS盒模型
45度地图编辑器及游戏开发心得
>> 分页 首页 前页 后页 尾页 页次:1/31个记录/页 转到 页 共3个记录

蓝色理想版权申明:除部分特别声明不要转载,或者授权我站独家播发的文章外,大家可以自由转载我站点的原创文章,但原作者和来自我站的链接必须保留(非我站原创的,按照原来自一节,自行链接)。文章版权归我站和作者共有。

转载要求:转载之图片、文件,链接请不要盗链到本站,且不准打上各自站点的水印,亦不能抹去我站点水印。

特别注意:本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有,文章若有侵犯作者版权,请与我们联系,我们将立即删除修改。

本文总共有 6 条评论,现在显示最新的 5 条。评分:- llllllllllllllllllll + 评分人数: 3 ,平均分: 3.67


82535599 Publish at 2006-12-31 15:35:00 评分5
文章写的好全面,我一直用的loading效果实在是超级简单了。佩服下....
第一祯放两个文本一个静态一个动态,
第二祯写上loaded=_root.getBytesLoaded();
total=_root.getBytesTotal();
然后在第三祯加上if判断(loaded==total),用gotoAndPlay(n)实现
我的太过简单了,所以效果不是太好。^_^
fanglinyong Publish at 2006-12-31 14:32:03 评分1
我觉得版主的方法太偏激了,毕竟条条大道通罗马,我们不能强加余人呀!
白猫,黑猫,逮住老鼠就是好猫!
八二愚人 Publish at 2006-3-27 18:32:53
测试
cooledi Publish at 2006-3-25 22:08:51
我还是不太会用“ 侦听器”
为什么 这段代码不这么写

stop();
myMCL = new MovieClipLoader();
myListener = new Object();
myMCL.onLoadComplete = function(targetMC)
{
targetMC.onPress = function ()
{
trace("pressed");
}
}

function initClips()
{
for (i=1;i<=3;i++)
{
this.attachMovie("img","img"+i,i);
this["img"+i]._x = i*110;
myMCL.loadClip(url,this["img"+i]);
}
}
//myMCL.addListener(myListener);
initClips();
YuSonG Publish at 2006-3-25 18:50:51 评分5
好!~仔细研究去!谢谢

查看全部评论

您的评论
用户名:  口令:
说明:输入正确的用户名和密码才能参与评论。如果您不是本站会员,你可以注册 为本站会员。
注意:文章中的链接、内容等需要修改的错误,请用报告错误,以利文档及时修改。
不评分 1 2 3 4 5
注意:请不要在评论中含与内容无关的广告链接,违者封ID
请您注意:
·不良评论请用报告管理员,以利管理员及时删除。
·尊重网上道德,遵守中华人民共和国的各项有关法律法规
·承担一切因您的行为而直接或间接导致的民事或刑事法律责任
·本站评论管理人员有权保留或删除其管辖评论中的任意内容
·您在本站发表的作品,本站有权在网站内转载或引用
·参与本评论即表明您已经阅读并接受上述条款
推荐文档 | 打印文档 | 评论文档 | 报告错误  
专业书推荐 更多内容
《Web标准设计》
《美工神话》
《Flash短片轻松学》
Illustrator CS3质感绘画表现技法
大师之路--Photoshop 完全解析
《用户体验要素》
HTML与CSS入门经典(第7版)
作品集 更多内容

华硕(Asus)手机 Zt23 华硕(Asus)手机 Zt23 Aqua land GenNext网站 用CSS写的Michael Ja 变态金刚 毕业设计。 家居城