The following example shows how you can display a hand cursor when the user rolls their mouse over the Flex CheckBox control by setting the useHandCursor and buttonMode properties.

According to the documentation for the useHandCursor property:

A Boolean value that indicates whether the pointing hand (hand cursor) appears when the mouse rolls over a sprite in which the buttonMode property is set to true. The default value of the useHandCursor property is true. If useHandCursor is set to true, the pointing hand used for buttons appears when the mouse rolls over a button sprite. If useHandCursor is false, the arrow pointer is used instead.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/08/15/displaying-a-hand-cursor-when-the-user-rolls-over-the-checkbox-control-in-flex/ -->
<mx:Application name="CheckBox_useHandCursor_test"
        xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:CheckBox id="checkBox"
            label="useHandCursor"
            useHandCursor="{checkBox.selected}"
            buttonMode="true"
            selected="true" />

</mx:Application>

View source is enabled in the following example.

You can also set the useHandCursor property using ActionScript, as seen in the following example:

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/08/15/displaying-a-hand-cursor-when-the-user-rolls-over-the-checkbox-control-in-flex/ -->
<mx:Application name="CheckBox_useHandCursor_test"
        xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:Script>
        <![CDATA[
            private function checkBox_change(evt:Event):void {
                checkBox.useHandCursor = checkBox.selected;
            }
        ]]>
    </mx:Script>

    <mx:CheckBox id="checkBox"
            label="useHandCursor"
            useHandCursor="true"
            buttonMode="true"
            selected="true"
            change="checkBox_change(event);" />

</mx:Application>
 
Tagged with:
 
About The Author

Peter deHaan

Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.

2 Responses to Displaying a hand cursor when the user rolls over the CheckBox control in Flex

  1. Galahady says:

    is it more succinct, if we don’t use event handler, but use the property binding mechanism, as the following code snippet showing?

    <mx:CheckBox id="checkBox"
            label="useHandCursor"
            useHandCursor="{checkBox.selected}"
            buttonMode="true"
            selected="true" />
    
  2. kasun says:

    I am trying to implement a way to control FLEX GUI s’ from MFC.Almost all other components can be controlled and their properties can be retrieved and set from MFC.But I can’t get the selected property of a check box from MFC.

    Plz Reply.
    thank you.

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">

Anti-Spam Protection by WP-SpamFree