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.

Tagged as: removeBusyCursor(), removeCursor(), setBusyCursor(), setCursor()