我有一个AdvancedDataGrid
用于HierarchicalData
以树格式显示数据的方法。AdvancedDataGridRendererProvider
对于其中一列,如果满足某些条件,我将使用有条件地显示图像。ToolTipManager
如果用户将鼠标悬停在图像上,我目前正在使用来显示附加信息。
这是我想做的事情:
toolTip
我不想显示用户将鼠标放在图像上的时间,而是希望在toolTip
图像在AdvancedDataGrid
. 如果用户滚动浏览AdvancedDataGrid
,则toolTip
应该相应地移动并跟随其图像。
示例 AdvancedDataGrid:
<mx:AdvancedDataGrid id="myAdvancedDataGrid"
displayItemsExpanded="true"
allowMultipleSelection="false"
dataProvider="{myTreeData}"
draggableColumns="false"
depthColors="{[0xD6E5FF,0xFFFFFF]}"
folderClosedIcon="{null}" folderOpenIcon="{null}" defaultLeafIcon="{null}">
<mx:columns>
<mx:AdvancedDataGridColumn id="colID" headerText="ID" dataField="myID"/>
<mx:AdvancedDataGridColumn id="colComments" headerText="Comments" dataField="comments"/>
</mx:columns>
<mx:rendererProviders>
<mx:AdvancedDataGridRendererProvider column="{colComments}" depth="2" dataField="comments" renderer="com.whatever.AdvancedDataGridCommentsRenderer" />
</mx:rendererProviders>
</mx:AdvancedDataGrid>
以及当前的 AdvancedDataGridRendererProvider:
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
paddingLeft="2" paddingRight="2" paddingTop="2"
horizontalScrollPolicy="off"
verticalScrollPolicy="off"
height="22"
horizontalAlign="center">
<fx:Script>
<![CDATA[
import mx.controls.ToolTip;
import mx.events.FlexEvent;
import mx.managers.ToolTipManager;
[Embed(source="assets/myImage.png")]
[Bindable]
private var myIcon:Class;
private var commentsToolTip:ToolTip;
override public function set data(value:Object):void
{
super.data = value;
if (value["comments"] != null)
{
if (value["comments"].toString().length > 0)
{
myImage.visible = true;
}
else
{
myImage.visible = false;
}
}
else
{
myImage.visible = false;
}
validateDisplayList();
}
private function showToolTip(evt:Event, text:String):void
{
var pt:Point = new Point(evt.currentTarget.x, evt.currentTarget.y);
// Convert the targets 'local' coordinates to 'global' -- this fixes the
// tooltips positioning within containers.
pt = evt.currentTarget.parent.contentToGlobal(pt);
commentsToolTip = ToolTipManager.createToolTip(text, pt.x, pt.y, "errorTipAbove") as ToolTip;
commentsToolTip.setStyle("borderColor", "#ff0000");
commentsToolTip.setStyle("color", "white");
var yOffset:int = commentsToolTip.height + 5;
commentsToolTip.y -= yOffset;
commentsToolTip.x -= 5;
}
// Remove the tooltip
private function killToolTip():void
{
ToolTipManager.destroyToolTip(commentsToolTip);
}
]]>
</fx:Script>
<mx:Image id="myImage"
source="{myIcon}"
mouseOver="showToolTip(event, data['comments'].toString())"
mouseOut="killToolTip()" />
</mx:HBox>
有什么建议么?