Changing the cursor in a Flex application using the CursorManager class

The following code shows how you can toggle the “busy” cursor in Flex using the static setBusyCursor() and removeBusyCursor() methods in the CursorManager class, as well as using your own custom cursors by calling the static setCursor() and removeCursor() methods.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/09/10/changing-the-cursor-in-a-flex-application-using-the-cursormanager-class/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">
 
    <mx:Script>
        <![CDATA[
            import mx.managers.CursorManager;
 
            [Bindable]
            [Embed(source="assets/bug.png")]
            private var BugIcon:Class;
 
            [Bindable]
            [Embed(source="assets/bug_delete.png")]
            private var BugDeleteIcon:Class;
 
            private var cursorID:int;
        ]]>
    </mx:Script>
 
    <mx:ApplicationControlBar dock="true">
        <mx:Button label="setBusyCursor()"
                click="CursorManager.setBusyCursor();" />
        <mx:Button label="removeBusyCursor()"
                click="CursorManager.removeBusyCursor();" />
    </mx:ApplicationControlBar>
 
    <mx:Button label="setCursor()"
            width="100"
            height="100"
            rollOver="cursorID = CursorManager.setCursor(BugIcon);"
            rollOut="CursorManager.removeCursor(cursorID);" />
 
</mx:Application>

View source is enabled in the following example.

15 thoughts on “Changing the cursor in a Flex application using the CursorManager class

    1. To get rid of the default text cursor I added selectable = false; to the text element. Not sure if you need that or not, but that worked for me.

  1. I was using the setBusyCursor() and removeBusyCursor() methods in my application,until I had two tabs in my app which loaded once my Application initialized.Both these tabs make remote method calls,and display the busy cursor until the results come back.This resulted in the busy cursor getting converted into a normal cursor before the data come back.Here is a blog post related to this and how we could use a progress bar instead and pointers on ProgressBar:
    http://flex-j2ee.blogspot.com/2008/01/flex-progressbar-versus-cursormanager.html

  2. I am trying to create a custom set of cursors for my app tha dont have to be turned on, can this code be edited so it is automatically switched on without a button needed to be pressed?

  3. I have an application where when the user clicks a button I removeAllChildren() from an HBOX, and then run a loop through my data to add new children to the same HBOX (I’m paginating the children). The first line of my function sets the busy cursor and the last line removes it as it takes a second or so to swap the children. However, when I click the button my cursor just disappears instead of showing the busy cursor. Then when the process is done the regular cursor returns. Why does my BusyCursor disappear when removing / adding children? Is there a way to prevent that from happening? Is this a bug or performance issue?

  4. I have the same problem Anz has.

    The new cursor and the text cursor overlay each other. Does anybody know how to fix this problem?

  5. Hi,
    I am changing the cursor successfully, but I need to disable the cursor click event while the information that I am retrieving is displayed?
    Can I do this? How can I do it?

Comments are closed.