Flex HSlider Skin

今天修改HSlider高度的时候遇到的问题。客户认为HSlider太细，要求加粗。
查了HSlider的API, 没有设置相关high的属性或方法。去adobe查到一篇讲HSlider的不错（这里）

首先要分清，HSlider由
Track (滑杆)
Thumb (指针)
Tick (刻度)
Label (刻度读数)
组成，这里要修改的是Track的粗细。

找到了HSlider的原代码，Flex SDK 2\frameworks\source\mx\controls\HSlider.as和父类Flex SDK 2\frameworks\source\mx\controls\sliderClasses\Slider.as
Track声明为

1. private var track:IFlexDisplayObject;  

再查看Flex SDK 2\frameworks\defaults.css  注意到HSlider的trackSkin被设为mx.skins.halo.SliderTrackSkin
查看mx\skins\halo\SliderTrackSkin.as 其measuredHeight始终返回4。
在自己的项目中，新建一个MySliderTrackSkin类

1. package components.skin   
2. {   
3. import flash.display.GradientType;   
4. import mx.styles.StyleManager;   
5. import mx.utils.ColorUtil;   
6. import mx.skins.halo.SliderTrackSkin;   
7.   
8. public class STSliderTrackSkin extends SliderTrackSkin    
9. {   
10.   
11.     public function STSliderTrackSkin()   
12.     {   
13.         super();   
14.     }   
15.   
16.     override public function get measuredHeight():Number   
17.     {   
18.         return 7; //HSlider的高度   
19.     }   
20. }   
21. }  

 然后在项目的.mxml文件中HSlider处修改如下

1. <mx:HSlider id="scrubber" alpha="0.5"                
2.     trackSkin="components.skin.STSliderTrackSkin"  
3.   
4.     thumbRelease="onScrubberThumbRelease();"  
5.     click="onScrubberClick(event);"  
6.                            
7.     thumbUpSkin="@Embed('images/c.gif')"  
8.     thumbOverSkin="@Embed('images/c1.gif')"  
9.     thumbDownSkin="@Embed('images/c1.gif')"  
10. />   

设定trackSkin为自己建立的类即可。