Flex: Listening for "Hover" in a Text Area Link

Question

I am trying to find out when the link is “frozen” in the text area displaying the html text. I wonder if there might be a way to listen for a cursor type change. I can not find anything in the documents. Does anyone know what event I could listen to here?

thanks

Answer 1

This is a very interesting problem. Using the Cay clause, I thought of a method that returns an object Arrayfrom Rectangleobjects matching text locations. I use the plural because several rectangles may be needed if the text is a word tapping.

function getPhraseLocation(phrase:String, field:TextField):Array {
    // initialise the return array
    var locations:Array = new Array();
    // find the first and last chars
    var firstChar = field.text.indexOf(phrase);
    var lastChar = firstChar+phrase.length;
    // determine the bounding rectangle of the first char
    var firstCharRect = field.getCharBoundaries(firstChar);
    var crtLocation:Rectangle = new Rectangle(firstCharRect.left,firstCharRect.top,firstCharRect.width,firstCharRect.height);
    // while there are chars left in the string
    var crtChar:uint = firstChar;
    while (++crtChar<lastChar)
        // if they're on the same line, expand the current rectangle
        if (field.getCharBoundaries(crtChar).y==crtLocation.y) crtLocation.width = uint(crtLocation.width)+field.getCharBoundaries(crtChar).width;
        // if they're on the next line, due to word wrapping, create a new rectangle
        else {
            locations.push(crtLocation);
            var crtCharRect = field.getCharBoundaries(crtChar);
            crtLocation = new Rectangle(crtCharRect.left,crtCharRect.top,crtCharRect.width,crtCharRect.height);
        }
    // add the last rectangle to the array
    locations.push(crtLocation);
    // return the array
    return(locations);
}

, TextField :

var field:TextField = new TextField();
this.addChild(field);
// move the text field to some random coordinates
field.x = 50;
field.y = 50;
// set wordwrap to true, to test the multiline behaviour of our function
field.wordWrap = true;
// set a smaller width than our text
field.width = 300;
// disable selectability, I'm not sure it would work properly, anyway
field.selectable = false;
// fill the textfield with some random html text
field.htmlText = 'Lorem ipsum dolor sit amet, consectetur adipiscing <a href="http://www.stackoverflow.com">elit. Aliquam et</a> elementum lorem. Praesent vitae nunc at mi venenatis auctor.';

, , . 0% , .

// create a sprite and add it to the display list
var overlay:Sprite = new Sprite();
this.addChild(overlay);
// enable mouse actions on it and make the cursor change on hover
overlay.mouseEnabled = true;
overlay.buttonMode = true;
// call the function that returns the size and position of the bounding boxes
var locationArray:Array = getPhraseLocation('elit. Aliquam et',field);
// draw each rectangle in white transparent fill
for each (var bounds:Rectangle in locationArray) {
    overlay.graphics.beginFill(0xff0000,0);
    overlay.graphics.drawRect(bounds.x+field.x-overlay.x, bounds.y+field.y-overlay.y, bounds.width, bounds.height);
    overlay.graphics.endFill();
}

MouseOver:

overlay.addEventListener(MouseEvent.MOUSE_OVER, mouseOverHandler);
function mouseOverHandler(evt:MouseEvent):void {
    trace('mouse over key phrase');
    // do whatever else you want to do
}

, - , . , , :

overlay.addEventListener(MouseEvent.CLICK, clickHandler);
function clickHandler(evt:MouseEvent):void {
    navigateToURL(new URLRequest('http://www.stackoverflow.com'));
}

buttonMode true, , , , .

, . , , .

, . , .

Answer 2

, , ... (. TextField.getCharBoundaries()), , Point (mouseX, mouseY) enterFrame.

Answer 3

AFAIK is impossible. You can use CSS to style the link when it rolls over (which is still painful for itself), but you cannot commit rollover as an AS event. You can fix the click on the link using LINK .

Answer 4

You can use the event TextEvent.LINK. Follow the implementation of mobile applications:

while(html.search("http://") != -1){
    html = html.replace("http://.", "event:"); 
    //it necessary that the link contains the tag "event:" to the TextEvent.LINK event works.
}
StyleableTextField(textArea.textDisplay).htmlText = html;
StyleableTextField(textArea.textDisplay).addEventListener(TextEvent.LINK, link_clickHandler);

private function link_clickHandler(event:TextEvent):void
{
    var url:String = "http://" + event.text;
    // event.text contains the clicked URL
}