CODEWITHSUNDEEP
actionscript-3mouseeventlayer
John Miner
John Miner

Reputation: 893

Stacked objects that both interact with the mouse

I have an external SWF that I load into a Loader object.

I add this Loader object as a child to a MovieClip and add this MovieClip to my stage.

I now want to draw a transparent rectangular Sprite on top of the Loader object, that is just needed to catch mouse event.

(I need to know when the mouse rolled over and rolled out of the transparent layer).

.

If you're asking yourself - why do I need this transparent layer and not just catch the events on the Loader itself ? well, there are a lot of reasons for this, most of them have to do with the client requests, but also - because some externally loaded SWFs don't respond to the mouse events for some reason - so I need to 'trick' it and add my own transparent layer on top.

My problem is - if I put the transparent layer as a child of the MovieClip that holds the Loader, then I get this hirarchy: enter image description here

problem is - mouse events are caught by the top-most layer (the transparent-layer) and passed on to the MovieClip and the Stage. The events aren't fired in the Loader object, and so - the SWF becomes non-interactive.

.

The other solution would be -

to somehow add the transparent layer as a child of the Loader object, like this: enter image description here

then the events would be bubbled up to the Loader and the SWF. Problem is - Loader class does not allow you to add child elements to it (except for the loaded SWF).

So can anyone offer advice how I can add a transparent layer on top of the SWF and still have mouse interaction with both the transparent layer and the SWF layer ?

Upvotes: 1

Views: 693

Answers (1)

fenixkim
fenixkim

Reputation: 363

The transparent layer is blocking the events of the loaded swf file. You need to use the mouseEnabled property to false for this layer.

I don't know if this work for you, but I think that this could be useful. Adds the following code in your main swf.

import flash.display.Loader;
import flash.events.Event;
import flash.events.MouseEvent;
import fl.transitions.Tween;
import fl.motion.easing.Linear;

// Disables the mouse interations
transparentLayer.mouseEnabled = false;
// Initialize with alpha 0
transparentLayer.alpha = 0;

// Cretes the loader
var loader:Loader = new Loader();
// Listen the complete event
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);
// Loads the external swf files
loader.load(new URLRequest("swf.swf"));
// Add in the background
addChildAt(loader, 0);

// Listen the complete event
function loadComplete (event:Event) {
    // Add the mouse events to the loaded content
    loader.contentLoaderInfo.content.addEventListener(MouseEvent.ROLL_OVER, mouseHandler);
    loader.contentLoaderInfo.content.addEventListener(MouseEvent.ROLL_OUT, mouseHandler);
}

// Handles de mouse events of the loaded swf
function mouseHandler (event:MouseEvent)
{
    switch (event.type) 
    {
        case MouseEvent.ROLL_OVER :
            // Shows the transparentLayer from the current alpha value to 1 in 1 second
            new Tween(transparentLayer, "alpha", Linear.easeNone, transparentLayer.alpha, 1, 1, true);
        break;
        case MouseEvent.ROLL_OUT :
            // Shows the transparentLayer from the current alpha value to 0 in 1 second
            new Tween(transparentLayer, "alpha", Linear.easeNone, transparentLayer.alpha, 0, 1, true);
        break;
    }
}

The transparent layer lost all its interations, so you need apply the motion effects externally. Here you can download the project running http://cl.ly/LtfA

Upvotes: 2

Related Questions