结合flash制作的flex进度条

结合flash制作的flex进度条

实例：http://www.fzj360.com/wish/

[img]http://dl.iteye.com/upload/picture/pic/70864/e8c859b5-a1f1-3ac4-a95b-caec3a90dff7.jpg" alt="" width="385" height="199[/img]

如果光用flex去重写这个DownloadProgressBar类可以实现修改进度条，但在这个类去绘制图形界面恐怕有点难，所以结合flash去开发进度条更加简单。至于在flash里导出的swc文件我就不多说了，我只简单出下说一下从flash里导出的swc文件进度条如何在flex中应用，我想这是关键之处。

1、导出的ProBar.swc文件引入flex Project中

2、新建一个类MyDownProBar继承DownloadProgressBar类，然后重新设置一下preloader属性

[code="java"]override public function set preloader(s:Sprite):void{
s.addEventListener(ProgressEvent.PROGRESS,inProgress);
s.addEventListener(Event.COMPLETE,complete);
s.addEventListener(FlexEvent.INIT_COMPLETE,initComplete);
s.addEventListener(FlexEvent.INIT_PROGRESS,initProgress);
}
3、inProgress方法是关键之处，在这个方法里将会绘制进度条图形

[code="java"]private function inProgress(e:ProgressEvent):void{//进度条显示的百分数方法
var barWidth:Number = e.bytesLoaded/e.bytesTotal*100;       
if(proBar==null){
proBar=new ProBar();
proBar.x=(this.stageWidth-this.width)/2-40;
proBar.y=(this.stageHeight-this.height)/2-18;
this.addChild(proBar);

myLabel=new TextField();
myLabel.x=(this.stageWidth-this.width)/2+40;
myLabel.y=(this.stageHeight-this.height)/2;
myLabel.textColor=0x8579E9;
this.addChild(myLabel);

}
proBar.setProBar(int(barWidth));
myLabel.text="已经加载："+int(barWidth)+" %";
}
proBar.setProBar(int(barWidth))是重要环节，实际上在这里这个方法是调用在flash里写好的一个方法，方法很简单

[code="java"]public function setProBar(frame:int):void{
gotoAndStop(frame);
}

意思就是跳到下一帧停止，这就是这个进度条的核心之后在呀。我这样可以根据百分比去一帧一帧显示进度条，这样就实现了动画效果，所以说时间轴和帧在flash里是命脉。


不多说，直接贴出我测试的小例子，自己可以看下，本人刚学flex没多久，代码可能写的有些烂，还望多多包涵！

评论

1 楼 000long000 2010-11-19  

你好，可以把ProBar.swc的源码发我一份吗？
我现在急需要做这个类似的进度条，希望能给我发一份，仅作参考,谢谢，[e-mail]