button event with transparency

[kruc3fix]

Hi people !
This is my first thread. I searched google a lot but didn't found a reasonable sollution for what I need, so I'm thinking you could help me out.

Here's the code:


// add the images
var region1_on:Loader = new Loader();
region1_on.contentLoaderInfo.addEventListener(Even t.COMPLETE, region1OnLoad);
region1_on.load(new URLRequest("assets/region1on.png"));

var region1_off:Loader = new Loader();
region1_off.contentLoaderInfo.addEventListener(Eve nt.COMPLETE, region1OffLoad);
region1_off.load(new URLRequest("assets/region1off.png"));


// build the button
var region1_button:SimpleButton = new SimpleButton(region1_off, region1_on, region1_on, region1_on);
addChild(region1_button);

Here's a demo (http://www.enjoycoding.com/ec_www/flash/Map.html)

The problem is that even though the background of the image is transparent, the event is attacched to the entire image, instead to what's visible.

Is there a property tht needs to be set to the SimpleButton object in order to make the event react only to non-transparent bitmap data ?

[GrndMasterFlash]

you could just reach inside the button and point to the visible child

[kruc3fix]

Thanx GrndMasterFlash for the quick reply, I'm quite suprised :)

What do you men by "point to the visible child" ? How do I do that with AS3 in Flex Builder 3 ?

[GrndMasterFlash]

i was thinking on the way home form work, im like 95% sure that if you set visible to false it will ignore and button events, should do the trick ;)

[kruc3fix]

I found the solution myself.

In order to keep the mouse interaction only to the visible part of the button, you need to use swf images instead of png (jpg and gif doesn't work either; haven't tested with svg)

The only difference to the code is new URLRequest("assets/region1on.swf") instead of ".png"

To export swf images, you can use Illustrator > Save for Web and Devices > SWF