How to use "native" custom mouse cursors from within Flash apps?

Question

The most common way of changing a cursor in Flash apps seems to be based on simply hiding the native OS cursor and displaying a graphic (drawn by the Flash Player) inside the Flash rectangle where the (hidden) cursor would be. This is what mx.managers.CursorManager does, for example. The reason why I find this approach unacceptable is that Flash Player isn't nearly fast enough at updating the cursor graphic, leading to some very visible lag in the cursor movement, which I find to be a pretty fundamental usability problem and annoyance, making the whole app seem slower than it really is.

On the other hand, I've noticed that the CSS cursor property implementation in browsers works like it should -- i.e. there's no visible lag in the cursor movement when using it to implement a custom mouse cursor.

So my question is: is there any way to use the CSS cursor property (or any other method that doesn't involve lagging, slow cursor movement) to change the cursor on top of a Flash rectangle?

I've already tried to change the cursor style property for a Flash element (or a Div wrapper around the Flash element) via JavaScript, but didn't seem to get it to work. Has anyone successfully done something like this?

Answer 1

I don't believe there is any way for Flash to use custom system cursors. In my 6 years of being a Flash Developer I've never heard of such functionality or a hack.

Answer 2

I understand your complaints, I too have been frustrated with how laggy the display-update can be. Thinking about the solution to use CSS to set a cursor-style in the browser though is an interesting approach... It smells, but off the top you may be able to implement control over the CSS cursor attribute from Actionscript using ExternalInterface. That way you could presumably communicate back to the HTML container calling some Javascript to modify the HTML page CSS at runtime. Not 100% sure that will work, but it may be worth a try if you are desperate. Otherwise it's probably advisable to stick with CursorManager.

Answer 3

Hi. The CursorManager is it, but I haven't had any problems with being laggy.

If you haven't already seen it, check out Colin Moock's CustomMousePointer classes. He has a bunch of AS3 examples and sample code from his Essential AS3 book posted at http://www.moock.org/eas3/examples/. Scroll down to, or search for, the Custom Mouse Pointer link. It's under the Chapter 22 heading.

The code in these examples, incidentally, was originally intended for use by Flash developers, so you may be able to optimize some of them for Flex by using objects that aren't available in Flash's implementation of AS3.

Answer 4

I believe Flash Player 10 will natively let you select the ibar, drag hand, finger or normal cursors, but if you're in Flash 9 this isn't possible and I don't believe a CSS hack will work either.

My advice is - use the MOUSE_MOVE event to position a graphic and set the frame rate as high as possible (e.g. 50 frames per second).

Answer 5

You could in fact accomplish this by writing an ExternalInterface that calls javascript to update the Mousecursor. jQuery functionality would work well here and it is something im doing in my new portfolio site for buttons and various areas of the flash app.

The new portfolio is not up yet, but should be within the next week or two for those are curious it will be at http://chrismcintoshdesigns.com