Skip to main content
Inspiring
November 30, 2018
Answered

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

  • November 30, 2018
  • 1 reply
  • 519 views

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!!!

This topic has been closed for replies.
Correct answer kglad

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!


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);

1 reply

kglad
Community Expert
Community Expert
November 30, 2018

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.

Inspiring
November 30, 2018

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
Community Expert
Community Expert
November 30, 2018

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.