Well, i had to develop custom functionality which has to give the mouse over tooltip on a part of text in a text field dynamically.
Could not find direct solution for this, but after my research got the solution.
Main application code:
Create MyText mxml component with the following code.
Could not find direct solution for this, but after my research got the solution.
Main application code:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" verticalAlign="middle" layout="vertical"
xmlns:local="*" creationComplete="setText();">
<mx:Script>
<![CDATA[
private function setText():void
{
myText.htmlText = "'<i>Lorem Ipsum</i>' is simply dummy text of the '<b>printing</b>' and typesetting industry."
}
import mx.managers.ToolTipManager;
import mx.controls.ToolTip;
public var myToolTip:ToolTip;
public var isTooltip:Boolean = new Boolean(false);
public function showToolTipAbove(evt:MouseEvent, 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);
isTooltip = true;
myToolTip = ToolTipManager.createToolTip(text, pt.x, pt.y, "errorTipAbove") as ToolTip;
myToolTip.setStyle("borderColor", "#ff6600");
myToolTip.setStyle("color", "white");
myToolTip.setStyle("fontSize","10");
// Move tooltip below target and add some padding
var yOffset:int = myToolTip.height + 5;
myToolTip.y = evt.stageY - yOffset;
myToolTip.x = evt.stageX;
}
public function killToolTip():void
{
if(isTooltip) {
ToolTipManager.destroyToolTip(myToolTip);
isTooltip = false;
}
}
]]>
</mx:Script>
<local:MyText id="myText" htmlText="" mouseOut="killToolTip()" />
<mx:Label id="labelID"/>
<mx:Label id="htmlID"/>
</mx:Application>
Create MyText mxml component with the following code.
<?xml version="1.0" encoding="utf-8"?>
<mx:Text xmlns:mx="http://www.adobe.com/2006/mxml" mouseMove="onMouseMove(event)">
<mx:Script>
<![CDATA[
import mx.core.Application;
import mx.controls.Alert;
import mx.managers.ToolTipManager;
import mx.controls.ToolTip;
// Saved word start and end indexes
private var wordStartIndex:int = -1;
private var wordEndIndex:int = -1;
private function onMouseMove(event:MouseEvent):void
{
if(Application.application.isTooltip) {
Application.application.killToolTip();
}
var charIndexUnderMouse:int = textField.getCharIndexAtPoint(event.localX, event.localY);
wordStartIndex = charIndexUnderMouse;
wordEndIndex = charIndexUnderMouse;
Application.application.labelID.text = charIndexUnderMouse..toString();
// Find start of word
while (text.charAt(wordStartIndex) != "'" && wordStartIndex > 0)
{
wordStartIndex--;
}
// Find end of word
while (text.charAt(wordEndIndex) != "'" && wordEndIndex < text.length)
{
wordEndIndex++;
}
if(text.substring(wordStartIndex+1,wordEndIndex) == "Lorem Ipsum") {
Application.application.showToolTipAbove(event,text.substring(wordStartIndex+1,wordEndIndex));
}
}
private function onMouseOut():void
{
Application.application.killToolTip();
}
]]>
</mx:Script>
</mx:Text>
No comments:
Post a Comment