这是FLEX3默认的进度条,它起到等待加载FLEX文件的作用。如果你需要设计和自定义FLEX加载进度条,本文将介绍2种方法实现自定义 FLEX3的loading进度条.
首先:修改下载进度的文字为中文
建立扩展至 mx.preloaders.DownloadProgressBar 的一个类:
package myDownPro
{
import mx.preloaders.DownloadProgressBar;
public class myDownProBar extends DownloadProgressBar
{
public function myDownProBar()
{
//TODO: implement function
super();
downloadingLabel="正在下载中...";
initializingLabel="正在初始化内容...";
}
}
}
然后在修改 preloader 为你建立的这个类:
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml " preloader="myDownPro.myDownProBar" layout="absolute">
<mx:Text text="程序进度条测试" x="37" y="71"/>
</mx:Application>
方法二:覆写 DownloadProgressBar 类的 preloader ,可以在其中加入你自已喜欢的标签或者图像
package myDownPro
{
import mx.preloaders.DownloadProgressBar;
import flash.display.Sprite;
import flash.events.ProgressEvent
import flash.events.*
import flash.text.TextField;
import mx.events.*;
public class myDownProBar2 extends DownloadProgressBar
{
public var msg:TextField
public function myDownProBar2()
{
super();
msg=new TextField()
msg.x=200
msg.y=200
addChild(msg)
}
override public function set preloader(s:Sprite):void{
s.addEventListener(ProgressEvent.PROGRESS,prog)
s.addEventListener(Event.COMPLETE,ecom)
s.addEventListener(FlexEvent.INIT_COMPLETE,flInC)
s.addEventListener(FlexEvent.INIT_PROGRESS,flIn)
}
private function prog(e:ProgressEvent):void{
msg.text=String(int(e.bytesLoaded/e.bytesTotal*100))+" %";
}
private function ecom(e:Event):void{
msg.text="完成了!!!!"
}
private function flInC(e:FlexEvent):void{
msg.text="初始化完毕!"//初始完后要派遣 Complete 事件,不然会停在这里,不会进入程序画面的
dispatchEvent(new Event(Event.COMPLETE))
}
private function flIn(e:FlexEvent):void{
msg.text="开始初始化程序"
}
}
}
同样修改<mx:Application>标签的 preloader 为这个类。
自定义的Preloader:
{
import flash.display.MovieClip;
import flash.display.Sprite;
import flash.events.Event;
import flash.events.ProgressEvent;
import mx.events.FlexEvent;
import mx.preloaders.IPreloaderDisplay;
import mx.preloaders.Preloader;
public class nPreloader extends Sprite implements IPreloaderDisplay
{
[Embed(source="mc.swf", symbol="loader_mc")]
private var LoaderMC:Class;
private var _loader_mc:MovieClip
private var _preloader:Preloader;
public function nPreloader()
{
super();
this._loader_mc = new LoaderMC()
this.addChild(this._loader_mc);
this._loader_mc.gotoAndStop(50)
}
public function get backgroundAlpha():Number
{
return 0;
}
public function set backgroundAlpha(value:Number):void
{
}
public function get backgroundColor():uint
{
return 0;
}
public function set backgroundColor(value:uint):void
{
}
public function get backgroundImage():Object
{
return null;
}
public function set backgroundImage(value:Object):void
{
}
public function get backgroundSize():String
{
return null;
}
public function set backgroundSize(value:String):void
{
}
public function set preloader(obj:Sprite):void
{
_preloader = obj as Preloader;
_preloader.addEventListener(ProgressEvent.PROGRESS, progressEventHandler);
_preloader.addEventListener(FlexEvent.INIT_COMPLETE,initCompleteEventHandler);
}
public function get stageHeight():Number
{
return 0;
}
public function set stageHeight(value:Number):void
{
}
public function get stageWidth():Number
{
return 0;
}
public function set stageWidth(value:Number):void
{
}
public function initialize():void
{
_loader_mc.x = stage.stageWidth / 2 - _loader_mc.width/2;
_loader_mc.y = stage.stageHeight / 2 - _loader_mc.height/2;
}
private function progressEventHandler(eo:ProgressEvent):void
{
_loader_mc.gotoAndStop(Math.round((eo.bytesLoaded / eo.bytesTotal )*100))
_loader_mc.show_txt.text =Math.round((eo.bytesLoaded / eo.bytesTotal )*100)+" %"
}
private function initCompleteEventHandler(eo:FlexEvent):void{
dispatchEvent(new Event(Event.COMPLETE));
}
}
}
主文件:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application preloader="nPreloader" creationComplete="init()" layout="vertical" xmlns:mx="http://www.adobe.com/2006/mxml" >
<mx:Script>
<![CDATA[
[Embed(source="1.mp3")]
private var _file:Class;
]]>
</mx:Script>
<mx:Button label="Button"/>
<mx:ComboBox ></mx:ComboBox>
<mx:Panel width="250" height="200" layout="absolute">
<mx:Label text="我们是Flex组件,hoho" fontSize="15"/>
</mx:Panel>
</mx:Application>