flex tree toolTip

ToolTip只能对Flex Tree的整个组件进行设置（使用Tree的dataTipField属性设置），并不能对每个树节点都设置。如果要实现每个树节点又不同的ToolTip功能，那么就只能自定义ToolTip了。主要有两种方式：

1、dataTipFunction（不推荐使用，虽然方法简单，但是效果非常不好。tip的位置不能动态改变，会出现不停闪烁的情况）
2、itemRollOver 和 itemRollOut（这种效果好，控制灵活，但是相对来说复杂一点）
  
===================================================
Tree要显示的数据如下：

Xml代码 复制代码 收藏代码
  1. <projects>  
  2.  <project name="SapIntegration" pid="1">  
  3.   <depot name="Yorktown:1770" did="1" desc="p4admin:Hiren"/>  
  4.   <depot name="Halifax: 1700" did="2" desc="p4admin:Hiren Dave"/>  
  5.  </project>  
  6.  <project name="LiveCycle Core QE" pid="2">  
  7.   <depot name="faramir:1666" did="3" desc="p4admin:Dean Harmon"/>    
  8.    <depot name="redcloud:1850 " did="4" desc="p4admin:Kiyotaka Taki"/>  
  9.  </project>  
  10. </projects>  




===================================================
第一种情况：

Flex代码 复制代码 收藏代码
  1. private function getToolTip(obj:Object):String{   
  2.   var xml:XML=obj as XML;   
  3.   return obj.@desc;   
  4. }  

Flex代码 复制代码 收藏代码
  1. <mx:Tree id="projects" width="207" height="100%"       
  2.    change="selectChange(event)"    
  3.     dataProvider="{projectdepots}" labelField="@name"     
  4.      dataTipFunction="getToolTip" showDataTips="true"/>  

===================================================

第二种情况：
Flex代码 复制代码 收藏代码
  1. import mx.controls.ToolTip;   
  2. import mx.events.ListEvent;   
  3. import mx.managers.ToolTipManager;   
  4. import flash.geom.Point;   
  5.   
  6. private var myToolTip:ToolTip;    
  7.   
  8. private function itemRollOverHandler(event:ListEvent):void{   
  9.     var node:XML=event.itemRenderer.data as XML;   
  10.     if(node.localName()!="project"){   
  11.         var toolTip:String= node.@desc;                
  12.         var p:Point=new Point();   
  13.         p.x=mouseX;   
  14.         p.y=mouseY;   
  15.         if (myToolTip != null){      
  16.             ToolTipManager.destroyToolTip(myToolTip);   
  17.         }   
  18.         var ltg:Point=projects.contentToLocal(p);      
  19.         myToolTip= ToolTipManager.createToolTip(toolTip, ltg.x, ltg.y) as ToolTip;   
  20.     }   
  21.        
  22. }   
  23.   
  24. private function itemRollOutHandler(event:ListEvent):void{   
  25.     if (myToolTip is ToolTip){   
  26.         ToolTipManager.destroyToolTip(myToolTip);         
  27.     }   
  28.     myToolTip=null;   
  29. }  




Flex代码 复制代码 收藏代码
  1. <mx:Tree id="projects" width="207" height="100%"       
  2.    change="selectChange(event)"    
  3.     dataProvider="{projectdepots}" labelField="@name"     
  4.      itemRollOver="itemRollOverHandler(event)"     
  5.      itemRollOut="itemRollOutHandler(event)"    
  6.      showDataTips="true"/>  
转载至：http://viking-liu.iteye.com/blog/1152657
posted @ 2012-03-31 16:39  寻找蓝手镯  阅读(464)  评论(0)    收藏  举报