Flex中如何通过thumbSkin样式去掉MX HSlider缩略图的例子

By Minidxer | December 25, 2009

接下来的例子演示了Flex中如何通过thumbSkin样式,去掉MX HSlider默认缩略图。



下面是main.mxml:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application name="Halo_HSlider_thumbSkin_test"
  3.         xmlns:mx="http://www.adobe.com/2006/mxml"
  4.         layout="vertical"
  5.         verticalAlign="middle"
  6.         backgroundColor="white">
  7.  
  8.     <mx:HSlider id="sldr"
  9.             value="7"
  10.             showTrackHighlight="true"
  11.             thumbSkin="{null}" />
  12.  
  13. </mx:Application>

也可以通过.CSS实现相同功能:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application name="Halo_HSlider_thumbSkin_test"
  3.         xmlns:mx="http://www.adobe.com/2006/mxml"
  4.         layout="vertical"
  5.         verticalAlign="middle"
  6.         backgroundColor="white">
  7.  
  8.     <mx:Style>
  9.         HSlider {
  10.             thumbSkin: ClassReference(null);
  11.             showTrackHighlight: true;
  12.         }
  13.     </mx:Style>
  14.  
  15.     <mx:HSlider id="sldr"
  16.             value="7" />
  17.  
  18. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

Topics: HSlider | No Comments » | 1,006 views Tags: ,

Search Posts