[2011-04] 更改进度条的样式
Xml代码 1.<?xml version="1.0" encoding="utf-8"?> 2.<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 3. layout="vertical" 4. verticalAlign="middle" 5. backgroundColor="white"> 6. 7. <mx:Script> 8. <![CDATA[ 9. import mx.events.SliderEvent; 10. 11. private function init():void { 12. var c:Class = progressBar.getStyle("indeterminateSkin"); 13. progressBar.setStyle("barSkin", c); 14. progressBar.setProgress(15, 100); 15. } 16. 17. private function progressBar_change(evt:SliderEvent):void { 18. progressBar.setProgress(evt.value, 100); 19. } 20. ]]> 21. </mx:Script> 22. 23. <mx:ApplicationControlBar dock="true"> 24. <mx:Form styleName="plain"> 25. <mx:FormItem label="value:"> 26. <mx:HSlider id="slider" 27. minimum="0" 28. maximum="100" 29. value="15" 30. liveDragging="true" 31. snapInterval="1" 32. tickInterval="10" 33. dataTipPrecision="0" 34. change="progressBar_change(event);" /> 35. </mx:FormItem> 36. </mx:Form> 37. </mx:ApplicationControlBar> 38. 39. <mx:ProgressBar id="progressBar" 40. mode="manual" 41. labelPlacement="center" 42. height="50" 43. creationComplete="init();" /> 44. 45.</mx:Application> <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white"> <mx:Script> <![CDATA[ import mx.events.SliderEvent; private function init():void { var c:Class = progressBar.getStyle("indeterminateSkin"); progressBar.setStyle("barSkin", c); progressBar.setProgress(15, 100); } private function progressBar_change(evt:SliderEvent):void { progressBar.setProgress(evt.value, 100); } ]]> </mx:Script> <mx:ApplicationControlBar dock="true"> <mx:Form styleName="plain"> <mx:FormItem label="value:"> <mx:HSlider id="slider" minimum="0" maximum="100" value="15" liveDragging="true" snapInterval="1" tickInterval="10" dataTipPrecision="0" change="progressBar_change(event);" /> </mx:FormItem> </mx:Form> </mx:ApplicationControlBar> <mx:ProgressBar id="progressBar" mode="manual" labelPlacement="center" height="50" creationComplete="init();" /> </mx:Application>另外你可以将barSkin风格定义在一个.CSS文件或者<mx:Style />中,大致像下面这样: Xml代码 1.ProgressBar { 2. barSkin: ClassReference("mx.skins.halo.ProgressIndeterminateSkin"); 3.} ProgressBar { barSkin: ClassReference("mx.skins.halo.ProgressIndeterminateSkin"); }或者你可以在MXML中利用下面的代码设置barSkin风格:<mx:ProgressBar Xml代码 1.id="progressBar" 2. barSkin="mx.skins.halo.ProgressIndeterminateSkin" 3. mode="manual" 4. labelPlacement="center" 5. height="50" />