Flex让Slider控件拖动时显示Tooltip

格式化与自定义Slider中显示的Tooltip

下面的实例演示了怎样利用dataTipFormatFunction格式化Slider中显示的Tooltip ，和通过css设置Tooltip的外观。
在代码中你也会看到Slider的 tickInterval ，snapInterval， value， liveDragging 等属性的用法

 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
 layout="vertical"
 verticalAlign="middle"
 backgroundColor="white">
 <mx:Style>
 ToolTip {
 backgroundColor: black;
 backgroundAlpha: 1.0;
 cornerRadius: 0;
 color: white;
 fontSize: 12;
 }
 </mx:Style>

 <mx:Script>
 <![CDATA[
 private function formatFunction(item:Number):String {
   //格式化函数
 return "格式化加自定义过了哈哈：" + item.toString();
 }
 ]]>
 </mx:Script>
<!-- tickInterval 是设置tick mark 的间隔，也是就显示符号的标实-->
<!-- snapInterval 设置slider thumb的间隔值，当用户移动thumb时候的移动间隔值 ，如果不设置表示拥护可以随意移动thumb不受tick mark的限制-->
<!-- value 设置默认显示值-->
<!--liveDragging 如果是false 当松开thumb时value才会有值 ，true的话，在移动thumb时value值都会改变-->

 <mx:HSlider id="slider"
 width="200"
 liveDragging="true"
 minimum="1"
 snapInterval="1"
 tickInterval="1"
 value="3"
 dataTipFormatFunction="formatFunction" />

 <mx:Label id="lbl" text="{slider.value}" />

</mx:Application>

http://www.nshen.net/blog/doc/flex/Slider_dataTipFormatFunction_test/main.swf