Flex 自定義加載進度條

使用方法: 
設置Application標籤的preloader爲 MyComponent.MyDownloadProgressBar 
<mx:Application preloader="MyComponent.MyDownloadProgressBar" > 

下面是MyDownloadProgressBar.as的代碼: 

package MyComponent 

import flash.display.*; 
import flash.events.*; 
import flash.filters.BitmapFilterQuality; 
import flash.filters.BlurFilter; 
import flash.geom.Matrix; 
import flash.net.*; 
import flash.text.TextField; 
import flash.utils.*; 
import flash.system.Capabilities; 

import mx.events.*; 
import mx.preloaders.*; 
    
    public class MyDownloadProgressBar extends Sprite implements IPreloaderDisplay 
    {        
        [Embed(source="logo.png", mimeType="application/octet-stream")] 
  public var _loadingLogo:Class; 
  
        private var dpbImageControl:Loader; 
        private var _barSprite:Sprite; 
        private var progressText:TextField;        
        private var ProgressBarSpritIsAdded:Boolean = false; 
    
        public function MyDownloadProgressBar() {   
            super();                            
        } 
        
        // Specify the event listeners. 
        public function set preloader(preloader:Sprite):void { 
            //Listen for 正在下載 
            preloader.addEventListener(ProgressEvent.PROGRESS, handleProgress); 
            //Listen for 下載完成 
            preloader.addEventListener(Event.COMPLETE, handleComplete); 
      //Listen for 正在初始化 
            preloader.addEventListener(FlexEvent.INIT_PROGRESS, handleInitProgress); 
            //Listen for 初始化完成 
            preloader.addEventListener(FlexEvent.INIT_COMPLETE, handleInitComplete); 
        } 
        
        // Initialize the Loader control in the override 
        // of IPreloaderDisplay.initialize(). 
        public function initialize():void { 
         //添加logo圖 
            dpbImageControl = new Loader();       
            dpbImageControl.contentLoaderInfo.addEventListener(Event.COMPLETE, loader_completeHandler); 
            dpbImageControl.loadBytes(new _loadingLogo() as ByteArray); 
            //dpbImageControl.load(new URLRequest("loadinglogo.swf")); 
        } 


        // After the SWF file loads, set the size of the Loader control. 
        private function loader_completeHandler(event:Event):void 
        {         
         addChild(dpbImageControl); 
         dpbImageControl.width = 230; 
            dpbImageControl.height= 80; 
            dpbImageControl.x = this.stage.stageWidth/2 - dpbImageControl.width/2; 
            dpbImageControl.y = this.stage.stageHeight/2 - dpbImageControl.height/2 - 80; 
        }   
        
        // 
        private function addProgressBarSprit():void{ 
         //繪製背景漸變 
   var matrix:Matrix=new Matrix(); 
         matrix.createGradientBox(this.stage.stageWidth,this.stage.stageHeight,Math.PI/2); 
         var colors:Array=[0x058BBD,0xFFFFFF]; 
         var alphas:Array=[1,1]; 
         var ratios:Array=[0,255]; 
         this.graphics.lineStyle(); 
         this.graphics.beginGradientFill(GradientType.LINEAR,colors,alphas,ratios,matrix);        
         this.graphics.drawRect(0,0,this.stage.stageWidth,this.stage.stageHeight); 
         this.graphics.endFill(); 
         
         //繪製中心白色發光 
            var _Sprite1:Sprite = new Sprite(); 
   addChild(_Sprite1); 
   _Sprite1.graphics.beginFill(0xffffff,0.45); 
            _Sprite1.graphics.drawEllipse(this.stage.stageWidth/2-130, this.stage.stageHeight/2-90, 280, 100); 
            _Sprite1.graphics.endFill(); 
            //濾鏡實現發光邊緣柔和            
            var blur:BlurFilter = new BlurFilter(); 
   blur.blurX = 100; 
   blur.blurY = 50; 
   blur.quality = BitmapFilterQuality.HIGH; 
   _Sprite1.filters = [blur]; 
   
   //------------------------------------------------- 
   
   //繪製進度條背景 
   var _Sprite2:Sprite = new Sprite(); 
   addChild(_Sprite2); 
   _Sprite2.graphics.lineStyle(1, 0xCCCCCC); 
   _Sprite2.graphics.beginFill(0xFFFFFF); 
   _Sprite2.graphics.drawRect((this.stage.stageWidth/2 - 152), (this.stage.stageHeight/2 - 10), 304, 20);   
   _Sprite2.graphics.endFill(); 
   
   //------------------------------------------------- 
   
   //加載進度條Sprite 
   _barSprite = new Sprite(); 
   addChild(_barSprite); 
   _barSprite.x = this.stage.stageWidth/2 - 150; 
   _barSprite.y = this.stage.stageHeight/2 - 8; 
   
   //------------------------------------------------- 
   
   //加載進度條文字 
   progressText = new TextField(); 
   addChild(progressText); 
   progressText.textColor = 0x333333; 
            progressText.width = 300; 
            progressText.height = 18; 
            progressText.x = this.stage.stageWidth/2 - 152; 
            progressText.y = this.stage.stageHeight/2 + 20; 
        } 
        
        //刷新進度條 
        private function drawProgressBar(bytesLoaded:Number, bytesTotal:Number):void 
  {   
   if (_barSprite != null && progressText != null){ 
    var g:Graphics = _barSprite.graphics; 
    g.clear(); 
//    g.beginFill(0xCCCCCC); 
//    g.drawRect(0, 0, 300*(bytesLoaded/bytesTotal),16);   
//    g.endFill();    
    
    var matrix:Matrix=new Matrix(); 
          matrix.createGradientBox(300*(bytesLoaded/bytesTotal),16,Math.PI/2); 
          var colors:Array=[0x0099CC,0x99cc77]; 
          var alphas:Array=[1,1]; 
          var ratios:Array=[0,255]; 
          g.lineStyle(); 
          g.beginGradientFill(GradientType.LINEAR,colors,alphas,ratios,matrix);        
          g.drawRect(0,0,300*(bytesLoaded/bytesTotal),16); 
          g.endFill();  
    
    
   } 
  } 
        
        //正在下載的進度 
        private function handleProgress(event:ProgressEvent):void { 
         //第一次處理時繪製進度條Sprit 
         if (ProgressBarSpritIsAdded == false){ 
          ProgressBarSpritIsAdded = true; 
          addProgressBarSprit(); 
         } 
         
         if (progressText != null){ 
          progressText.text = "下載進度:已下載 " + event.bytesLoaded + " byte,總大小 " + event.bytesTotal + " byte."; 
         }         
         drawProgressBar(event.bytesLoaded, event.bytesTotal); 
        } 
        
        private function handleComplete(event:Event):void { 
         if (progressText != null){ 
          progressText.text = "下載完成."; 
         } 
         drawProgressBar(1,1);        
        } 
        
        private function handleInitProgress(event:Event):void { 
         if (progressText != null){ 
          progressText.text = "正在初始化..."; 
         } 
         drawProgressBar(1,1); 
        } 
        
        private function handleInitComplete(event:Event):void { 
         if (progressText != null){ 
          progressText.text = "初始化完成."; 
         } 
         drawProgressBar(1,1);         
         
         //0.03秒後拋出完成事件 
            var timer:Timer = new Timer(300,1); 
            timer.addEventListener(TimerEvent.TIMER, dispatchComplete); 
            timer.start();      
        } 
    
        private function dispatchComplete(event:TimerEvent):void { 
            dispatchEvent(new Event(Event.COMPLETE)); 
        } 
        

        // Implement IPreloaderDisplay interface 
    
        public function get backgroundColor():uint { 
            return 0; 
        } 
        
        public function set backgroundColor(value:uint):void { 
        } 
        
        public function get backgroundAlpha():Number { 
            return 0; 
        } 
        
        public function set backgroundAlpha(value:Number):void { 
        } 
        
        public function get backgroundImage():Object { 
            return undefined; 
        } 
        
        public function set backgroundImage(value:Object):void { 
        } 
        
        public function get backgroundSize():String { 
            return ""; 
        } 
        
        public function set backgroundSize(value:String):void { 
        } 
    
        public function get stageWidth():Number { 
            return 500; 
        } 
        
        public function set stageWidth(value:Number):void { 
        } 
        
        public function get stageHeight():Number { 
            return 375; 
        } 
        
        public function set stageHeight(value:Number):void { 
        } 
    } 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章