AS3 TextField use hand cursor WITH enabled mouseChildren

Question

What I'm trying to do is; upon clicking a textfield, a function runs which uses the text in the textfield as the URL for a URLRequest and sends you to another page. It works perfectly, but I want the cursor to switch to a hand upon hovering over the textfield.

I was able to do this by adding them as Children to a MovieClip with buttonMode and useHandCursor enabled, but I had to set MovieClip.mouseChildren to false for it to work. And that's where the problem lies; mouseChildren is disallowing me from going to the page...

I can't make the MovieClip parent go to the URL with the function, because there are multiple textfields, not just one, and I can't use e.target.text to get the URL from the textfield, because that gets the text property from the parent MovieClip instead...

Here's my code:

var handyMan:MovieClip = new MovieClip;
handyMan.useHandCursor = true;
handyMan.buttonMode = true;
handyMan.mouseChildren = false;

for each (var xit:TextField in linkus)
{
    xit.addEventListener(MouseEvent.CLICK, useLink);
    handyMan.addChild(xit);
}

this.addChild(handyMan);

function useLink(e:MouseEvent):void
{
    navigateToURL(new URLRequest(e.target.text));
}

So, is there a way to enable mouseChildren and use a hand cursor at the same time?

updated my solution to something of which I'm pretty sure it will work, but it's a bit nasty — Pimgd

Pimgd Pimgd · Accepted Answer · 2014-07-14T12:42:46

Have you tried making the textfields not selectable?

xit.selectable = false;

That might allow you to not need to use mouseChildren.

Alternatively, if you receive the event from the textfield, make use of something like FunctionObject:

package {
/**
 * ...
 * @author Pimgd
 */

public class FunctionObject 
{
    private var f:Function;
    private var o:Object;
    private var args:Array;
    public function FunctionObject(func:Function, obj:Object, fArgs:Array) {
        f = func;
        o = obj;
        args = fArgs;
        if (args == null) {
            args = new Array();
        }
    }
    public function call(...rest):* {
        var a = args.concat();
        for each(var x in rest) {
            a.push(x);
        }
        var obj:Object = f.apply(o, a);
        if (obj != null) {
            return obj;
        }
    }
    public function apply(target:Object, ...rest):* {
        return f.apply(target, rest);
    }
    public function setArgs(nArgs:Array):void {
        args = nArgs.concat();
    }
    public function getArgs():Array {
        return args;
    }
    public function getFunction():Function {
        return f;
    }
}
}

alter the forloop to be

for each (var xit:TextField in linkus)
{
    var f:FunctionObject = new FunctionObject(useLink, this, [xit]);
    xit.addEventListener(MouseEvent.CLICK, f.call);
    handyMan.addChild(xit);
}

Then, alter useLink to take a textfield...

function useLink(tf:TextField):void
{
    navigateToURL(new URLRequest(tf.text));
}

And that should fix your problem. Yup, it's not nice. But it works.

What it does is it prepares a function call - useLink, with as argument the textfield. It attaches the trigger of that function to the eventListener, so that when that fires, the prepared functioncall is triggered.

AS3 TextField use hand cursor WITH enabled mouseChildren

1 Answers