最新更新 sitemap 网站制作设计本站搜索
网页设计
国外网站 韩国网站 个人主页 手提袋设计 CSS 网页特效 平面设计 网站设计 Flash CMS技巧 服装网站 php教程 photoshop 画册 服务器选用 数据库 Office
虚拟主机 域名注册 云主机 网页设计 客服QQ:8208442
当前位置:首页 > 网络设计学院 > Flash教程

Flash标准loading提高播放质量制作方法

日期:09-16    来源:中国设计秀    作者:cnwebshow.com

网络中的swf影片是可以实现边下载边播放的,由于受到当前网络传输的制约,对于大容量的影片,这种实时播放并不理想。为避免受众尴尬的等待,flash制作人员往往设计一个加载(loading)的画面,等影片的全部字节下载到本地后再播放,从而保证影片的播放质量.本文将介绍一种较为标准的loading制作方法。CeV中国设计秀

  步骤:CeV中国设计秀

  1.打开Flash MX 2004,选择矩形工具,在主场景中画出下一个只有边框有矩形,本例该矩形大小为350*16像素。CeV中国设计秀

  2.再在主场景中仍用矩形工具画出一个只有填充而无边框的矩形,并按F8键将其转换为影片剪辑(注:其注册点一定要选在该矩形的最左侧),其实例名为bar 。本例该矩形大小为345*11像素。CeV中国设计秀

  3.将上述两矩形在主场景中排列好,使边框矩形嵌套填充矩形。CeV中国设计秀

  4.在上述两矩形旁边用文字工具拖出一动态文本框,其变量名为bar_per。CeV中国设计秀

  至此,准备工作就绪,即建立了两矩形框和一动态文本框,下面准备编写代码。CeV中国设计秀

  5.在主场景中,新建一层,选中该层第1帧,按F9键打开动作脚本编辑窗口,输入以下代码:CeV中国设计秀

this.onLoad=function(){ CeV中国设计秀
myBytesTotal=_root.getBytesTotal(); CeV中国设计秀
} CeV中国设计秀
this.onLoad(); CeV中国设计秀
this.onEnterFrame=function(){ CeV中国设计秀
myBytesLoaded=_root.getBytesLoaded(); CeV中国设计秀
bar_xscale=myBytesLoaded/myBytesTotal*100; CeV中国设计秀
percent=Math.round(bar_xscale); CeV中国设计秀
this.bar._xscale=bar_xscale; CeV中国设计秀
this.bar_per=percent+"%"; CeV中国设计秀
if(myBytesLoaded==myBytesTotal){ CeV中国设计秀
delete this.onEnterFrame; CeV中国设计秀
_root.nextFrame(); CeV中国设计秀
}else{ CeV中国设计秀
this.stop(); CeV中国设计秀
} CeV中国设计秀
}CeV中国设计秀

  6.从主场景时间轴第2帧起制作你的flash影片。CeV中国设计秀

  注解:CeV中国设计秀

  ①CeV中国设计秀

this.onLoad=function(){ CeV中国设计秀
myBytesTotal=_root.getBytesTotal(); CeV中国设计秀
}CeV中国设计秀

  此段代码是指,当影片剪辑(本例指两矩形和一动态文本框所存在的主场景)加载时,读取主时间轴存在的所有元素的总字节数并赋值给变量myBytesTotal。CeV中国设计秀

  ②this.onLoad();CeV中国设计秀

  flash事件处理函数MovieClip.onLoad=function(){…}有些奇怪,其中设置的代码,若不在后面加上this.onLoad();,这些代码并不能执行,因此加上这一句以便这些代码得以执行。CeV中国设计秀

  ③myBytesLoaded=_root.getBytesLoaded();//读取主时间轴存在的所有元素已加载的字节数,并将其赋值给变量myBytesLoaded。CeV中国设计秀

  ④bar_xscale=myBytesLoaded/myBytesTotal*100;//将myBytesTotal折算成100时,myBytesLoaded所得到的折算值赋给变量bar_xscale,以便给主场景中bar的_xscale赋值(_xscale的最大值只能为100),这里用到了初等数学的比例计算。CeV中国设计秀

  ⑤percent=Math.round(bar_xscale);//将变量bar_xscale的值取整后赋给变量percent,以便显示的百分比不带小数。CeV中国设计秀

  拓展:CeV中国设计秀

  1.“下载速度”的代码设计CeV中国设计秀

  ①在主场景中用文字工具拖出有适当宽度的动态文本框,并设其变量名为rate 。CeV中国设计秀

  ②在主场景代码层第1帧this.onEnterFrame=function(){}代码体if语句前追加如下代码:CeV中国设计秀

t=getTimer();CeV中国设计秀
rate= "下载速度:" + Math.round(myBytesLoaded/t * 100)/100 + CeV中国设计秀
" K/s";CeV中国设计秀

  2.“已用时间和剩余时间”的代码设计CeV中国设计秀

  ①在主场景中用文字工具拖出有适当宽度的动态文本框,并设其变量名为mytimes 。CeV中国设计秀

  ②在主场景代码层第1帧this.onEnterFrame=function(){}代码体if语句前追加如下代码:CeV中国设计秀

timeLoaded=Math.round(t/1000); CeV中国设计秀
timeRemain=Math.round(timeLoaded*(myBytesTotal-myBytesLoaded)/myBytesLoaded);CeV中国设计秀

timeRemain=Math.round(timeRemain/60)+":"+Math.round(timeRemain%60);CeV中国设计秀

timeLoaded=Math.round(timeLoaded/60)+":"+Math.round(timeLoaded%60);CeV中国设计秀

mytimes="已用时间"+timeLoaded+" "+"剩余时间"+timeRemain; CeV中国设计秀
           CeV中国设计秀

CeV中国设计秀
  注:若“下载速度”的代码没有设计,则上述代码前应追加代码 t=getTimer();拓展后主场景代码层第1帧的全部代码如下:CeV中国设计秀
 CeV中国设计秀

this.onLoad=function(){ CeV中国设计秀
myBytesTotal=_root.getBytesTotal(); CeV中国设计秀
} CeV中国设计秀
this.onLoad(); CeV中国设计秀
this.onEnterFrame=function(){ CeV中国设计秀
myBytesLoaded=_root.getBytesLoaded(); CeV中国设计秀
bar_xscale=myBytesLoaded/myBytesTotal*100; CeV中国设计秀
percent=Math.round(bar_xscale); CeV中国设计秀
this.bar._xscale=bar_xscale; CeV中国设计秀
this.bar_per=percent+"%"; CeV中国设计秀
t=getTimer(); CeV中国设计秀
rate= "下载速度:" + Math.round(myBytesLoaded/t * 100)/100 + CeV中国设计秀
            " K/s"; CeV中国设计秀
timeLoaded=Math.round(t/1000); CeV中国设计秀
timeRemain=Math.round(timeLoaded*(myBytesTotal-myBytesLoaded)/myBytesLoaded); CeV中国设计秀
            CeV中国设计秀
timeRemain=Math.round(timeRemain/60)+":"+Math.round(timeRemain%60); CeV中国设计秀
            CeV中国设计秀
timeLoaded=Math.round(timeLoaded/60)+":"+Math.round(timeLoaded%60); CeV中国设计秀
            CeV中国设计秀
mytimes="已用时间"+timeLoaded+" "+"剩余时间"+timeRemain; CeV中国设计秀
            CeV中国设计秀
if(myBytesLoaded==myBytesTotal){ CeV中国设计秀
delete this.onEnterFrame; CeV中国设计秀
_root.nextFrame(); CeV中国设计秀
}else{ CeV中国设计秀
this.stop(); CeV中国设计秀
} CeV中国设计秀
}CeV中国设计秀