Flex进度条

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

mxml中：

 1 <mx:ProgressBar id="proBar"
 2                     verticalCenter="0"
 3                     horizontalCenter="0"
 4                     trackSkin="probar.borderskin"
 5                     fontSize="12"
 6                     height="24"
 7                     color="#336699"
 8                     label="正在加载..."
 9                     labelPlacement="center"
10                     maskSkin="probar.maskskin"
11                     maximum="100"
12                     direction="right"
13                     mode="manual"
14                     minimum="0"
15                     barSkin="probar.updatedisplay_"
16                     visible="false"
17                     alpha="0.9">
18 
19     </mx:ProgressBar>

as中：

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

 1 private var requestDataTimer:Timer = new Timer(50);
 2 
 3 public function complete():void
 4 {
 5     //register event.
 6     requestDataTimer.addEventListener(TimerEvent.TIMER, progressOnRequestDataTimer);
 7 }
 8 
 9 private function progressOnRequestDataTimer(event:TimerEvent):void
10 {
11     if (progressInt > separateProgressInt)
12     {
13         proBar.label = "数据量大或网络慢, 请耐心...";
14         requestDataTimer.stop();
15         return;
16     }
17     
18     proBar.setProgress(progressInt, 100);
19     proBar.label = "当前进度： " + progressInt.toString() + "%" + "(正在请求数据...)";
20     progressInt++;
21 }

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

1.borderskin.as

 1 import mx.skins.halo.ProgressTrackSkin;
 2     import mx.skins.Border;
 3     import mx.styles.StyleManager;
 4     import mx.utils.ColorUtil;
 5     
 6     /**
 7      * ...
 8      * @author Thyiad
 9      */
10     public class borderskin extends ProgressTrackSkin
11     {
12         
13         public function borderskin()
14         {
15             super();
16         }
17         
18         override protected function updateDisplayList(w:Number, h:Number):void
19         {
20             super.updateDisplayList(w, h);
21             
22             // User-defined styles
23             var borderColor:uint = getStyle("borderColor");
24             var fillColors:Array = getStyle("trackColors") as Array;
25             this.styleManager.getColorNames(fillColors);
26             
27             // ProgressTrack-unique styles
28             var borderColorDrk1:Number = ColorUtil.adjustBrightness2(borderColor, -30);
29             
30             graphics.clear();
31             
32             drawRoundRect(0, 0, w, h, 0, [borderColorDrk1, borderColor], 0, verticalGradientMatrix(0, 0, w, h));
33             
34             drawRoundRect(1, 1, w - 2, h - 2, 0, fillColors, 0, verticalGradientMatrix(1, 1, w - 2, h - 2));
35         }
36     
37     }

2.maskskin.as

 1         import flash.display.Graphics;
 2     
 3     import mx.skins.halo.ProgressMaskSkin;
 4     
 5     /**
 6      * ...
 7      * @author Thyiad
 8      */
 9     public class maskskin extends ProgressMaskSkin
10     {
11         
12         public function maskskin()
13         {
14             super();
15         }
16         
17         override protected function updateDisplayList(w:Number, h:Number):void
18         {
19             super.updateDisplayList(w, h);
20             
21             // draw the mask
22             var g:Graphics = graphics;
23             g.clear();
24             g.beginFill(0xFFFF00);
25             //g.drawRect(1, 1, w - 2, h - 2);
26             g.drawRoundRect(1, 1, w - 2, h - 2, 20, 20);
27             g.endFill();
28         }
29     }

3.updatedisplay_.as

 1     import flash.display.Graphics;
 2     import mx.skins.halo.ProgressIndeterminateSkin;
 3     import mx.styles.StyleManager;
 4     import mx.utils.ColorUtil;
 5     import mx.controls.ProgressBar;
 6     import mx.skins.halo.ProgressTrackSkin;
 7     
 8     /**
 9      * ...
10      * @author Thyiad
11      */
12     public class updatedisplay_ extends ProgressIndeterminateSkin
13     {
14         
15         public function updatedisplay_()
16         {
17             super();
18         }
19         
20         override protected function updateDisplayList(w:Number, h:Number):void
21         {
22             super.updateDisplayList(w, h);
23             
24             var barColorStyle:* = 0xff9935; //blue
25             var barColor:uint=this.styleManager.isValidStyleValue(barColorStyle) ? barColorStyle : getStyle("themeColor");
26             
27             var barColor0:Number = ColorUtil.adjustBrightness2(barColor, 0);
28             var hatchInterval:Number = getStyle("indeterminateMoveInterval");
29             
30             if (isNaN(hatchInterval))
31                 hatchInterval = 28;
32             
33             var g:Graphics = graphics;
34             
35             g.clear();
36             
37             if (w == 0)
38             {
39             }
40             else
41             {
42                 g.beginFill(barColor0, 1);
43                 g.moveTo(0, 1);
44                 g.lineTo(w, 1);
45                 g.curveTo(w + 10, h / 2, w, h - 1);
46                 g.lineTo(0, h - 1);
47                 g.lineTo(0, 1);
48                 g.endFill();
49             }
50         }
51     
52     }

 

posted @ 2013-08-08 11:24  Thyiad  阅读(465)  评论(0)  编辑  收藏  举报