Milos Zikic - Personal site, sharing thoughts about startups, products and engineering

Flex : Display hand cursor on buttons inside a container

I recently had a requirement to make an ItemRenderer for a TileList and I encountered a problem with showing hand cursor for buttons inside ItemRenderer. After a bit of digging through documentation I solved the problem.

The solution was to set buttonMode="true" property on my button.

There are 2 more properties that might be required useHandCursor and mouseChildren.

Here is an extract from Adobe livedocs:

Specifies the button mode of this sprite. If true, this sprite behaves as a button, which means that it triggers the display of the hand cursor when the mouse passes over the sprite and can receive a click event if the enter or space keys are pressed when the sprite has focus. You can suppress the display of the hand cursor by setting the useHandCursor property to false, in which case the pointer is displayed.

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.

You can change the useHandCursor property at any time; the modified sprite immediately takes on the new cursor appearance.

Determines whether or not the children of the object are mouse enabled. If an object is mouse enabled, a user can interact with it by using a mouse. The default is true.

This property is useful when you create a button with an instance of the Sprite class (instead of using the SimpleButton class). When you use a Sprite instance to create a button, you can choose to decorate the button by using the addChild() method to add additional Sprite instances. This process can cause unexpected behavior with mouse events because the Sprite instances you add as children can become the target object of a mouse event when you expect the parent instance to be the target object. To ensure that the parent instance serves as the target objects for mouse events, you can set the mouseChildren property of the parent instance to false.

No event is dispatched by setting this property. You must use the addEventListener() method to create interactive functionality.


Thanks for the clarification :)

Share this post