flex自定义preloader预加载进度条

 
flex默认的preloader已经很不错了,可是有时候还是需要自定义的.
 
需要在要出现自定义预加载的程序的<mx:Application>标签里加入preloader="".
preloader="com.lichen.component.CustomPreloader"
其中,com.lichen.component是我的包名,CustomPreloader这个类是继承了DownloadProgressBar
这句就是指明了程序preloader的时候加载哪个类
 
CustomPreloader.as
package com.lichen.component 

  import flash.display.Sprite; 
  import flash.events.Event; 
  import flash.events.ProgressEvent; 
  import flash.text.TextField; 
    
  import flashx.textLayout.BuildInfo; 
    
  import mx.events.*; 
  import mx.preloaders.DownloadProgressBar; 
    
  public class CustomPreloader extends DownloadProgressBar { 
     
    public var wcs:WelcomeScreen; 
    public var msg:TextField; 
    public function CustomPreloader()    
    { 
      super();    
      msg=new TextField(); 
      wcs = new WelcomeScreen(); 
        
      this.addChild(wcs); 
      this.addChild(msg); 
    } 
     
    override public function set preloader( preloader:Sprite ):void    
    {                                        
      preloader.addEventListener( ProgressEvent.PROGRESS , SWFDownloadProgress );         
      preloader.addEventListener( Event.COMPLETE , SWFDownloadComplete ); 
      preloader.addEventListener( FlexEvent.INIT_PROGRESS , FlexInitProgress ); 
      preloader.addEventListener( FlexEvent.INIT_COMPLETE , FlexInitComplete ); 
    } 
     
    private function SWFDownloadProgress( event:ProgressEvent ):void { 
      msg.text=String(int(event.bytesLoaded/event.bytesTotal*100))+" %"
      msg.background=true
      msg.backgroundColor=0xD4E4FF; 
      msg.width=200; 
      msg.height=20; 
      msg.textColor=0x444444; 
    } 
     
    private function SWFDownloadComplete( event:Event ):void {} 
     
    private function FlexInitProgress( event:Event ):void { 
//      wcs.ready = true; 
      msg.text="完成了!"
      wcs.closeScreen(); 
      dispatchEvent(new Event(Event.COMPLETE)); 
    } 
     
    private function FlexInitComplete( event:Event ):void    
    {             
//      wcs.ready = true;             
//      dispatchEvent( new Event( Event.COMPLETE ) ); 
    } 
     
  } 

 
这其中使用了WelcomeScreen,这个类的作用是使用图片,并且设置定时器控制图片显示的alpha属性.
WelcomeScreen.as
package com.lichen.component     
{        
  import flash.display.Loader; 
  import flash.events.MouseEvent; 
  import flash.events.TimerEvent; 
  import flash.utils.ByteArray; 
  import flash.utils.Timer; 
    
  public class WelcomeScreen extends Loader 
  { 
    [ Embed(source="images/mt.jpg", mimeType="application/octet-stream") ] 
    public var WelcomeScreenGraphic:Class; 
    public var timer:Timer; 
    private var fadeInRate:Number    = .05; 
    private var fadeOutRate:Number = .08; 
    private var timeAutoClose:int = 500; 
    public var ready:Boolean = false;    
     
    public function WelcomeScreen() 
    { 
      this.visible = false
      this.alpha = 0.5; 
      timer = new Timer( 1 ); 
      timer.addEventListener( TimerEvent.TIMER, updateView ); 
      timer.start(); 
      this.loadBytes( new WelcomeScreenGraphic() as ByteArray ); 
      this.addEventListener( MouseEvent.MOUSE_DOWN, mouseDown );                            
    } 
     
    public function updateView( event:TimerEvent ):void 
    { 
      ifthis.alpha < 1)        this.alpha = this.alpha + this.fadeInRate; 
      ifthis.stage.stageWidth>0){ 
        this.stage.addChild(this); 
        this.x = this.stage.stageWidth/2 - this.width/2; 
        this.y = this.stage.stageHeight/2 - this.height/2; 
        this.visible=true
      } 
      ifthis.ready && timer.currentCount > this.timeAutoClose ) closeScreen()         
    } 
     
    public function closeScreen():void 
    { 
      timer.removeEventListener( TimerEvent.TIMER, updateView ); 
      timer.removeEventListener( MouseEvent.MOUSE_DOWN, mouseDown); 
      timer.addEventListener( TimerEvent.TIMER, closeScreenFade );                                         
    } 
     
    public function closeScreenFade( event:TimerEvent ):void 
    { 
      ifthis.alpha > 0){ 
        this.alpha = this.alpha - fadeOutRate; 
      } else { 
        timer.stop() 
        this.parent.removeChild(this); 
      }                 
    }                 
     
    public function mouseDown( event:MouseEvent ):void 
    { 
      closeScreen();                 
    } 
  } 
}    
 
最终的效果图
flex自定义preloader预加载进度条


本文转自chainli 51CTO博客,原文链接:http://blog.51cto.com/lichen/244538,如需转载请自行联系原作者
上一篇:10个优秀的 HTML5 & CSS3 下拉菜单制作教程


下一篇:延时函数出错,volatile一例