flex toolTip样式设置

 

需要3个文件。一个是样式类，一个样式文件，一个是mxml文件。

 

●MyToolTip.as

package{
 import mx.core.UITextField;
 import mx.skins.halo.ToolTipBorder;
 import mx.controls.ToolTip;
 public class MyToolTip extends ToolTipBorder {
  
  
  override protected function updateDisplayList(unscaledWidth:Number,
   unscaledHeight:Number):void{
    
    var toolTip:ToolTip = (this.parent as ToolTip);
    var textField:UITextField = toolTip.getChildAt(1) as UITextField;
    textField.htmlText = textField.text;
    
    
    var calHeight:Number = textField.height;
    calHeight += textField.y*2;
    calHeight += textField.getStyle("paddingTop");
    calHeight += textField.getStyle("paddingBottom");
    
    
    var calWidth:Number = textField.textWidth;
    calWidth += textField.x*2;
    calWidth += textField.getStyle("paddingLeft");
    calWidth += textField.getStyle("paddingRight");
    
    super.updateDisplayList(calWidth, calHeight);
   }
 }
}

 

●style.css

ToolTip{
    font-family:            verdana;
    font-size:              14px;
    color:                  #000000;
          #FF00FF;
    background-alpha:       0.85;
    cornerRadius:           10;
    borderSkin:             ClassReference("MyToolTip"); 
}

 

●toolTipDemo.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml " layout="absolute" width="640" height="477">
        <mx:Script>
    <![CDATA[
        [Bindable]
        private var myToolTipText:String = "<b>This is a bold toolTip</b>" ;
    ]]>
</mx:Script>
<mx:Style source="style.css"/>
    <mx:Button label="hover to get tooltip" toolTip="{myToolTipText}"
x="36" y="28"/>
</mx:Application>