Interactive AIR animation - Actionscript only working for the top layer?

[MadrikMedia]

Hello, new to Animator here.

So I'm building an animation that allows the user to drag/drop elements on the stage via AS3 (which is working great!).

My issue is that I have some graphic elements that I need to overlay on the layer with the User animated elements so that none of the user interactive elements every cross 'over' but instead go 'underneath' these overlaid elements.

When I test/publish this way, I'm unable to drag/drop or otherwise interact with the elements on stage.  BUT, if I simply move the top layer containing the overlays down below the layer with the interactive elements (or delete it for that matter), the animation works as scripted. 

So, it seems that the AS3 commands are only working for me when published to the upper most layer?

What am I missing to be able to stack graphic layers on top of scripted interactive layers?

Thank you!!!

[kglad]

the layer that contains your code is irrelevant.  if you have a display object above an interactive display object, that will interfere with mouse interactivity of the lower depth object.

that said, as3 has more than enough methods to handle depths and do what you want.  i'm just not sure what exactly you want.

[MadrikMedia]

Thank you for your reply!

Hopefully I can explain better.

So in regards to depths of the various layers:

For the interactive layers, I'm bringing each to the front currently using:

addChild(DisplayObject(e.currentTarget));

This works to bring the interactive layers to the front each time one is dragged/dropped.  The problem is that I have an overlay layer (like a picture frame) that I need to always remain on top of those interactive layers. 

Seems from what you're saying, I can't solve this problem by putting the overlay image on a layer above my interactive layer. 

Is there AS3 code that will lock the overlay image to the front and then display my interactive elements behind the overlay BUT on top of one another when dragged/dropped?

Below is the script I'm using now:

labScreen1.addEventListener(MouseEvent.MOUSE_DOWN, lab1Start);

function lab1Start(e:MouseEvent):void {

addChild(DisplayObject(e.currentTarget));

labScreen1.startDrag();

}

labScreen1.addEventListener(MouseEvent.MOUSE_UP, lab1Stop);

function lab1Stop(e:MouseEvent):void {

labScreen1.stopDrag();

}

labScreen2.addEventListener(MouseEvent.MOUSE_DOWN, lab2Start);

function lab2Start(e:MouseEvent):void {

addChild(DisplayObject(e.currentTarget));

labScreen2.startDrag();

}

labScreen2.addEventListener(MouseEvent.MOUSE_UP, lab2Stop);

function lab2Stop(e:MouseEvent):void {

labScreen2.stopDrag();

}

labScreen3.addEventListener(MouseEvent.MOUSE_DOWN, lab3Start);

function lab3Start(e:MouseEvent):void {

addChild(DisplayObject(e.currentTarget));

labScreen3.startDrag();

}

labScreen3.addEventListener(MouseEvent.MOUSE_UP, lab3Stop);

function lab3Stop(e:MouseEvent):void {

labScreen3.stopDrag();

}

[kglad]

there are several ways to resolve that.

one would be to apply addChild to your overlay after every

addChild(DisplayObject(e.currentTarget));

another would be to add a movieclip (at 0,0) (eg, parent_mc)that's in a layer just below your overlay.  then use:

parent_mc.addChild(DisplayObject(e.currentTarget)) instead of addChild(displayObject(e.currentTarget))

there are other ways to handle, but those two are the common solutions.

[MadrikMedia]

Thanks so much for the quick reply:

Given I only have 3-4 objects that are interactive it seems straight forward enough to add:

addChild(DisplayObject(e.currentTarget)); for the Overlay layer. 

Question - would I include this within the function for each of the interactive objects?  If so, I'm unsure of how to attribute the addChild to the 'parent_mc'.

Sorry, super new to AS3.

Thank you!

[kglad · Accepted solution]

if you're going to use the first suggestion, make sure your overlay is converted to a displayobject (usually a movieclip) and assign it an instance name (eg, overlay_mc).

then change:

addChild(DisplayObject(e.currentTarget));

to:

addChild(DisplayObject(e.currentTarget));

addChild(overlay_mc);

[MadrikMedia]

Thanks for script.  I plugged it in as follows:

labScreen1.addEventListener(MouseEvent.MOUSE_DOWN, lab1Start);

function lab1Start(e:MouseEvent):void {

addChild(DisplayObject(e.currentTarget));

addChild(topToolbar);

labScreen1.startDrag();

}

I made the overlay layer a MC with the Instance name of "topToolbar".  When I test I'm unable to interact with any of the drop/drag layers?

Thanks for working with me on this!

[MadrikMedia]

kglad, it worked!!! 

The problem I was having is that my overlay was a graphic with a full screen alpha that was preventing me from clicking on the other objects underneath. 

I rebuilt accordingly and NOW the drag/drop objects are indeed staying underneath the overlay element. 

THANK YOU VERY MUCH!!!

[kglad]

you're welcome.