修改VSlider的thumb的大小

在做flex的时候  使用slider 总是觉得太大 ，网上查了资料 呵呵 感觉不错  因为 slider 的 thumb  继承于  button  所以我们可以引用很多的特性。 如需要修改 Thumb Skin
發現不管怎樣改 Skin，Thumb 都只有 12 x 12 大小
Flex API 上也沒有提供可以設定的 CSS Style 屬性
以下分享個人修改 Slider Thumb 大小的做法

方式一、待 Slider 建立完成後，取出 Thumb 加以設定

Main.mxml：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
 layout="horizontal" verticalAlign="middle">
 <mx:HSlider>
  <mx:creationComplete>
   <![CDATA[
    import mx.controls.HSlider;
    import mx.core.UIComponent;
    var slider:HSlider = event.target as HSlider;
    var thumb:UIComponent = slider.getThumbAt(0);
    thumb.width = 24;
    thumb.height = 24;
    slider.invalidateDisplayList();
   ]]>
  </mx:creationComplete>
 </mx:HSlider>
</mx:Application>
<!-- Ticore's Blog - http://ticore.blogspot.com/ -->

方式二、自訂 SliderThumb Class，覆寫 measure 方法

MySliderThumb Class：

package {
 import mx.controls.sliderClasses.*;
 
 public class MySliderThumb extends SliderThumb {
  override protected function measure():void{
   super.measure();
   measuredWidth = 24;
   measuredHeight = 24;
  }
 }
}
// Ticore's Blog - http://ticore.blogspot.com/

Main.mxml：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
 layout="horizontal" verticalAlign="middle">
 <mx:HSlider sliderThumbClass="{MySliderThumb}" />