Define a custom hitarea in Flex

Flex makes it possible to define a sprite as a custom hitarea for components that extend UIComponent. Defining a custom hitarea can become handy when dealing with complex graphical objects that consist of multiple elements such as bitmap images.

Problem:

Assigning a sprite to the objects hitarea variable doesn’t show any effects.

Solution:

The hitarea also has to be added as a child to the display object.

// Create the bitmap
var bitmap:Bitmap;
bitmap = this._loader.content as Bitmap;
 
// Create a hitarea for the bitmap
// I assume you already made a sprite (called mySprite)
var _hitarea:Sprite = mySprite;
 
//Add the bitmap as a child to a container
this.imageWrapper.addChild(bitmap);
 
//Hitarea also HAS to be added as a child in order to work!!
_hitarea.visible = false;
this.imageWrapper.addChild(_hitarea);
 
// Set the hitarea to imageWrapper				
this.imageWrapper.hitArea = _hitarea;	

Example

This content requires Adobe Flashplayer

View Source is enabled

Here's a tutorial about how to create a hitarea-sprite automatically out of a given image (or it's bitmapData).