返回织梦建站服务网首页 业界新闻 教程文档 资源下载 酷站鉴赏 免费服务 站长工具
织梦建站工作室
织梦建站论坛
载入中…
专题栏目
最新热门
>>更多热门...  
最新推荐
>>更多推荐...  
  您现在的位置: 织梦建站服务网 >> 建站教程 >> WEB多媒体 >> Flash >> 教程正文
Flash网页制作之详谈loading的制作        ★★★★
HITS: TIME:2006-8-5 23:01:36 AUTHOR:鬼谷子先… URL:It365cn
CONTENT INTRODUCE :
放大文字  缩小文字  发表评论  加入站内收藏夹  告诉好友  打印模式  关闭窗口 
大家知道,当flash影片或者网页体积相当大的时候,等待页面的出现是非常枯燥的,所以loading的概念就产生了
  loading的制作方法有许多许多种,今天详谈一种。
  好了,转入正题。
  首先,CTRL+F8新建一个电影剪辑(MC),命名为loading。

  然后,进入这个MC,做一个方框,不带边框,只留填充色,选中方框,按F8转换为图形元件。然后按F6在第100帧做一个关键帧。回到第一帧,用自由变形工具(Q),将loading条从左或右像中间拖,拖至一条线为止,然后从第一帧做补间。这样loading动画就是一个从中间向两边延伸的,至于为什么要做100帧的渐变动画,那就是配合100%的AS咯,到100%下载的时候,这个条就延伸完毕咯!
  接下来,将名字为loading的MC拖入场景种的第一层,放到合适位置,点F5延长一帧。将MC实例命名为loading。

  然后进入我们的AS部分。
  在主场景中新建一层,点击F6延长出一个关键帧,因为第一帧是空白帧,所以第二帧也延长出一个空白关键帧了。

  第一帧写入AS:
a=getBytesLoaded(); //a定义为getBytesLoaded()
b=getBytesTotal(); //b定义为getBytesTotal()
loaded=int(a/b*100); //定义为a除以b再乘以100,目的是求个百分整数,其实对于这个loading的效果不大,不过打个基础,对于以后功能详细的loading有用。
loading . gotoAndPlay( loaded ); //loading这里就是场景中实例命名的那个loading,在下载的同时,运行这个MC,配合上面的百分整数显示整个下载过程。

  第二帧写入AS:
if(a==b){ //如果a的值,就是下载的总值等于flash本身的总值,执行下列语句
nextScene(); //转到下个场景,这里可以看到,这里的主动画和loading场景是不同的,所以我们要用shift+f2再建立一个新场景,放入主动画,而且必须在loading场景的下面。
}else{ //其他情况,就是说a不等于b,多半是没有load完的情况下、
gotoAndPlay(1); //回到第一帧,这样做一个循环,当loading不成功的情况下,回到第一帧重新执行下载。
}
  这样就完成了,切记,主动画要放在另外一个场景且在loading场景之下。

  这次我们介绍用AS配合动态以及静态文本来完成显示详尽下载进程,临时再决定加上百分数的显示。
  上次介绍了进度条,这次就不说了,直接进入百分数以及下载进程。
  首先在场景用静态文本在合适的7个合适的位置分别写上:总字节数、已下载字节数、总帧数、已下载帧数、需要时间、实际已用时间和“%”,然后时间轴上用F5延长出一个帧。
  然后分别在前六个的右边用动态文本拉出6个合适大小的框,不写任何东西,在“%”的右边用动态文本拉出一个3个字位数的框。
  然后分别在属性框里给对应静态文本的动态文本框加变量:
  总字节数:aby
  已下载字节数:bby
  总帧数:af
  已下载帧数:bf
  需要时间:at
  实际已用时间:bt
  %:loaded

  然后新建一层,命名为AS(这并不重要,但是养成一个会分门别类的好习惯,大家以后看我放的源文件,不管是层名、还是库里面,我都会

[1] [2] 下一页

教程录入:jerome    责任编辑:jerome 
  • 上一篇教程:

  • 下一篇教程:
  • 【字体: 】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口

    相关教程
    Flash纯脚本生成饼图
    [Flash] 图片轮换效果
    Flex2 学习笔记 Ⅲ
    AS+JS的Flash网站无刷新定位技术
    事件侦听器示例汇总
    [AS3.0] 强大的事件机制
    [FLASH]爽快使用XML
    Document Class特色带来了什么?
    AS3.0的类及绑定
    与Flash9的一次亲密接触!
    网友评论:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)
    湘ICP备05010790号 {$Wap}
    关于我们 | 版本历史 | 联系方法 | 隐私条例 | 链接我们 | 广告服务 | 常见问题 | 友情链接 | 网站公告 | 设为首页 | 收藏本站
    Copyright © 2001-2006 17zm.NET All Rights Reserved.  织梦建站工作室[织梦建站工作室]™荣誉出品. Since 2001