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

by Peter deHaan on August 15, 2008

in CheckBox

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>

{ 2 comments… read them below or add one }

1 Galahady August 16, 2008 at 9:45 am

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" />

Reply

2 kasun November 4, 2008 at 9:40 pm

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.

Reply

Leave a Comment

Sorry, this blog is terrible at eating HTML comments.
If you're pasting any HTML/XML/MXML code, you need to convert your < characters to &lt; and your > characters to &gt; .

You can 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

Previous post:

Next post: