Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Jonah

Loadermax transparent png bg click-through?

Recommended Posts

If I use LoaderMax to load pngs with transparent backgrounds and add mouse event listeners to the pngs, will the listeners respond when the mouse is over the transparent portion of the png? If so, is there a way to change this so that the mouse events only dispatch when hovering over opaque portions of the png? Thank you

Link to comment
Share on other sites

If I use LoaderMax to load pngs with transparent backgrounds and add mouse event listeners to the pngs, will the listeners respond when the mouse is over the transparent portion of the png?

 

yes

 

is there a way to change this so that the mouse events only dispatch when hovering over opaque portions of the png?

 

yes there are a number of ways to do this. If you google "actionscript mouse events transparent png" you will find a lot of discussions on the topic.

 

I've found Moses G's InteractivePNG class pretty easy to implement: http://blog.mosessupposes.com/?p=40

 

Below is an example of how you can add the rawContent of a GreenSock ImageLoader to an InteractivePNG instance:

 

import com.greensock.*;
import com.greensock.loading.*;
import com.greensock.events.*;
import com.mosesSupposes.bitmap.InteractivePNG;
var image:ImageLoader = new ImageLoader("diamond.png", {onComplete:completeHandler});
var iPNG:InteractivePNG = new InteractivePNG();

addChild(iPNG);

image.load();

function completeHandler(e:LoaderEvent){
trace("loaded");

//place the loaded png into the InteractivePNG clip
iPNG.addChild(e.target.rawContent);
//update the InteractivePNG's hitArea
iPNG.drawBitmapHitArea();
//add you CLICK handler
iPNG.addEventListener(MouseEvent.CLICK, clickHandler);

iPNG.buttonMode = true;

}
function clickHandler(e:MouseEvent):void{
trace("clicked");
}

 

cs4 files attached

 

I have included the InteractivePNG class for your convenience, but I suggest you download the docs and view the interactive demo to understand it better here: http://www.mosessupposes.com/utilities/

load_transparent_interactive_png_CS4.zip

Link to comment
Share on other sites

Carl,

 

Thanks for the quick response, your example was very helpful and straight-forward. I've already implemented it. Thank you!

Link to comment
Share on other sites

you're welcome. I actually learned something from this myself:)

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×