Flex进度条

Flex中，进度条的皮肤，以及使用Timer让它自动增加~

mxml中：

<mx:ProgressBar id="proBar"
                    verticalCenter="0"
                    horizontalCenter="0"
                    trackSkin="probar.borderskin"
                    fontSize="12"
                    height="24"
                    color="#336699"
                    label="正在加载..."
                    labelPlacement="center"
                    maskSkin="probar.maskskin"
                    maximum="100"
                    direction="right"
                    mode="manual"
                    minimum="0"
                    barSkin="probar.updatedisplay_"
                    visible="false"
                    alpha="0.9">

    </mx:ProgressBar>

as中：

（注意：没有贴上整个的，只是取了其中相关的）

private var requestDataTimer:Timer = new Timer(50);

public function complete():void
{
    //register event.
    requestDataTimer.addEventListener(TimerEvent.TIMER, progressOnRequestDataTimer);
}

private function progressOnRequestDataTimer(event:TimerEvent):void
{
    if (progressInt > separateProgressInt)
    {
        proBar.label = "数据量大或网络慢, 请耐心...";
        requestDataTimer.stop();
        return;
    }
    
    proBar.setProgress(progressInt, 100);
    proBar.label = "当前进度： " + progressInt.toString() + "%" + "(正在请求数据...)";
    progressInt++;
}

呵呵，皮肤是在网上找来的(其实本人对flex研究不深，这皮肤里面的弯弯绕绕也没完全看明白，而且感觉flex的每次升级都变动很大，皮肤相关的很多属性都不是以前能用的，导致学习成本都很高啊~所以拿过来修改一番能用就用上了)：

1.borderskin.as

import mx.skins.halo.ProgressTrackSkin;
    import mx.skins.Border;
    import mx.styles.StyleManager;
    import mx.utils.ColorUtil;
    
    /**
     * ...
     * @author Thyiad
     */
    public class borderskin extends ProgressTrackSkin
    {
        
        public function borderskin()
        {
            super();
        }
        
        override protected function updateDisplayList(w:Number, h:Number):void
        {
            super.updateDisplayList(w, h);
            
            // User-defined styles
            var borderColor:uint = getStyle("borderColor");
            var fillColors:Array = getStyle("trackColors") as Array;
            this.styleManager.getColorNames(fillColors);
            
            // ProgressTrack-unique styles
            var borderColorDrk1:Number = ColorUtil.adjustBrightness2(borderColor, -30);
            
            graphics.clear();
            
            drawRoundRect(0, 0, w, h, 0, [borderColorDrk1, borderColor], 0, verticalGradientMatrix(0, 0, w, h));
            
            drawRoundRect(1, 1, w - 2, h - 2, 0, fillColors, 0, verticalGradientMatrix(1, 1, w - 2, h - 2));
        }
    
    }

2.maskskin.as

        import flash.display.Graphics;
    
    import mx.skins.halo.ProgressMaskSkin;
    
    /**
     * ...
     * @author Thyiad
     */
    public class maskskin extends ProgressMaskSkin
    {
        
        public function maskskin()
        {
            super();
        }
        
        override protected function updateDisplayList(w:Number, h:Number):void
        {
            super.updateDisplayList(w, h);
            
            // draw the mask
            var g:Graphics = graphics;
            g.clear();
            g.beginFill(0xFFFF00);
            //g.drawRect(1, 1, w - 2, h - 2);
            g.drawRoundRect(1, 1, w - 2, h - 2, 20, 20);
            g.endFill();
        }
    }    

3.updatedisplay_.as

    import flash.display.Graphics;
    import mx.skins.halo.ProgressIndeterminateSkin;
    import mx.styles.StyleManager;
    import mx.utils.ColorUtil;
    import mx.controls.ProgressBar;
    import mx.skins.halo.ProgressTrackSkin;
    
    /**
     * ...
     * @author Thyiad
     */
    public class updatedisplay_ extends ProgressIndeterminateSkin
    {
        
        public function updatedisplay_()
        {
            super();
        }
        
        override protected function updateDisplayList(w:Number, h:Number):void
        {
            super.updateDisplayList(w, h);
            
            var barColorStyle:* = 0xff9935; //blue
            var barColor:uint=this.styleManager.isValidStyleValue(barColorStyle) ? barColorStyle : getStyle("themeColor");
            
            var barColor0:Number = ColorUtil.adjustBrightness2(barColor, 0);
            var hatchInterval:Number = getStyle("indeterminateMoveInterval");
            
            if (isNaN(hatchInterval))
                hatchInterval = 28;
            
            var g:Graphics = graphics;
            
            g.clear();
            
            if (w == 0)
            {
            }
            else
            {
                g.beginFill(barColor0, 1);
                g.moveTo(0, 1);
                g.lineTo(w, 1);
                g.curveTo(w + 10, h / 2, w, h - 1);
                g.lineTo(0, h - 1);
                g.lineTo(0, 1);
                g.endFill();
            }
        }
    
    }