天天看點

Flex中progressBar的使用簡例

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

      xmlns:s="library://ns.adobe.com/flex/spark" creationComplete="InitApp()"

      xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" width="435" height="208">

<fx:Script>

  <![CDATA[

   import mx.controls.Alert;

   import mx.controls.Image;

   import flash.net.URLLoader;

   import flash.net.URLRequest;

   import mx.managers.PopUpManager;

   import mx.controls.ProgressBar;

  private var valueNum:Number = 0;

//使用定時器處理progressBar 開始

  private var timer:Timer;

  protected function InitApp():void{

    timer = new Timer(1);  

    timer.addEventListener(TimerEvent.TIMER, OnTimeEvent);

    timer.start();

   }

    private function OnTimeEvent(evt:TimerEvent):void{

     valueNum = valueNum + 10;

     var vaPercent:Number = valueNum / 100;

     if(valueNum >= 10000)

     {

      progressBar.setProgress(valueNum, 10000);

      progressBar.label = "                     download completed";

      btn.enabled = false;

      isok.enabled = false;

      return;

     }

     progressBar.setProgress(valueNum, 10000);

     progressBar.label = "                     " + vaPercent + "% has been downloaded"   

    //Alert.show(String(progressBar.percentComplete)); 

   }

//使用定時器處理progressBar 結束

   private function OnOk():void{

    valueNum = valueNum + 10;

    if(valueNum >= 100)

    {

     progressBar.setProgress(valueNum, 100);

     progressBar.label = "                     download completed";

     btn.enabled = false;

     isok.enabled = false;

     return;

    }

    progressBar.setProgress(valueNum, 100);

    progressBar.label = "                     " + valueNum + "% has been downloaded"

    //Alert.show(String(progressBar.percentComplete));

   }

]]>

 </fx:Script>

<mx:ProgressBar x="108" y="22" label="                     0% has been downloaded" minimum="0" maximum="100" mode="manual" id="progressBar" name="progress" indeterminate="false" enabled="true" chromeColor="#1F1616" color="#FB0D0D" disabledColor="#FA1919" errorColor="#26AE4D"/>

 <mx:Image x="82" y="110" source="../pic/title_Right.png" width="127" height="28" id="isok" click="OnOk()" mouseOver="OnMouseonOk()" mouseOut="OnMouseoutOk()" visible="true" showBusyCursor="true" scaleContent="true" smoothBitmapContent="true" focusSkin="@Embed(source='../pic/set_left.png')"/>

 <mx:Image x="255" y="110" source="../pic/set_left.png" width="102" height="28" id="issetting" click="OnSetting()" mouseOver="OnMouseonSetting()" mouseOut="OnMouseoutSetting()"/>

 <s:Button x="82" y="64" id="btn" label="Init" click="OnClickInit()" width="126" height="38" focusColor="#010000" accentColor="#EB0D0D" focusSkin="@Embed(source='../pic/title_Right.png')" cacheAsBitmap="true" useHandCursor="true" mouseEnabled="true" mouseFocusEnabled="true" visible="true"/>

繼續閱讀