Check when a part of the MovieClip leaves the Stage

Question

I'm creating a Drag and Drop game using AS3, i want to check when a apart of a Movieclip is outside the screen to move the View behind and let the user choose where to drop it.

I cant' test if the MovieClip credentials are bigger that the stage (scaleMode = NO_SCALE) Width/Height, because there is a part of the stage that it's hidden behind the browser window.

It's the same aspect as MOUSE_LEAVE just this time it has to be for MovieClips, i tried to see the code behind MOUSE_LEAVE but i couldn't reach it.

Thank You.

MAIN CLASS

[SWF(width='800', height='800',backgroundColor='#CC99FF', frameRate='60')]
public class DragTest extends Sprite
{
    public function DragTest()
    {
        addChild(new World(this));

        this.stage.scaleMode = "noScale";
        this.stage.align = "TL";

        this.graphics.lineStyle(5,0x555555,0.5);
        this.graphics.drawRect(0,0,800,800);
    }
}

WORLD CLASS

public class World extends Container // Container from my SWC
{
    private var _display:Sprite;
    private var _dragPt:Point;
    private var _dragedObject:MovieClip;

    public function World(display:Sprite)
    {
        super();

        _display = display;

        myMC.addEventListener(MouseEvent.MOUSE_DOWN, onPickUp, false, 0, true ); 

        display.stage.addEventListener(MouseEvent.MOUSE_UP, onDrop, false, 0, true ); 
        display.stage.addEventListener(Event.MOUSE_LEAVE, onMouseLeave, false, 0, true ); 
    }

    protected function onMouseLeave(event:Event):void
    {
        trace("Mouse Is Leaving The Stage");

    }

    protected function onDrop(e:MouseEvent):void
    {
        _display.stage.removeEventListener(MouseEvent.MOUSE_MOVE, onMoveObject);

    }   

    private function onPickUp(e:MouseEvent)
    {
        _dragedObject = e.currentTarget as MovieClip;

        _display.stage.addEventListener(MouseEvent.MOUSE_MOVE, onMoveObject, false, 0, true);
    }

    protected function onMoveObject(e:MouseEvent):void
    {
        var point:Point = new Point(_display.stage.mouseX, _display.stage.mouseY);

            (_dragedObject as MovieClip).x = point.x;
            (_dragedObject as MovieClip).y = point.y;           
    }
}

Here is an Example : Simple Code

Just so this isn't another **[X/Y Problem](http://meta.stackexchange.com/a/66378)**. Is your question more about how to drag Flash content from one browser window to another? I'm confused by "Stage is hidden behind the browser window" and also saying "...is outside the screen to move the View behind and let the user choose where to drop it." — VC.One, Feb 08 '16 at 12:20
Actually it's not dragging from one window to another, the stage is sometimes hidden behind the browser because i'm using noScale so when you reduce the size of the window a part of the stage is not showing, what i'm trying to do is detect when a movieclip is touching the showing bordures of the stage, to detect when it's about to leave, it works great with MOUSE_LEAVE, i just want to do it with a MC. — Zouhair Elamrani Abou Elassad, Feb 08 '16 at 14:57
**[This answer](http://stackoverflow.com/a/6050299/2057709)** doesn't help? Put a small testable example code of how you do it that can be "fixed". To drag usually I just use an `enterframe` function that says when mouse button is held down then `myMC.x = stage.mouseX;` this way the MC follows the mouse and maybe like that you can also apply the `Mouse_Leave` method... — VC.One, Feb 08 '16 at 15:33
@ZouhairElamraniAbouElassad The fact that you are using `NO_SCALE` is very important, please add it to your question, along with an example of the code that drags the MovieClip. — Aaron Beall, Feb 08 '16 at 16:19
Ok i will try to give a simple example, it's an isometric Map using As3isolib but what's important is the Drag effect which is independent of that library, i'll be back with an example. — Zouhair Elamrani Abou Elassad, Feb 08 '16 at 16:44

Aaron Beall · Accepted Answer · 2016-02-08T21:54:50.977

1

The easiest approach would probably be to use getBounds(stage) and compare with stageWidth and stageHeight:

var bounds:Rectangle = _draggedObject.getBounds(stage);
if (bounds.left < 0) {
    // left part of object is off-screen
} else if (bounds.right > stage.stageWidth) {
    // right part of object is off-screen
}
if (bounds.top < 0) {
    // top part of object is offscreen
} else if (bounds.bottom > stage.stageHeight) {
    // bottom part of object is off-screen
}

You could move the display in each of these cases.

edited Feb 08 '16 at 21:54

answered Feb 08 '16 at 19:57

Aaron Beall

49,769
26
85
103

This works great if the browser window > stage window, if reduced the size of the window to be smaller that the stage's it won't work, on the opposite of MOUSE_LEAVE which works on both cases. – Zouhair Elamrani Abou Elassad Feb 09 '16 at 10:15
Make the stage size the same as the window size, by embedding it at 100% width and 100% height. – Aaron Beall Feb 09 '16 at 14:14
Yes i'm already doing that, but the SWF size is already set as well using the SWF metatag, adding to that NO_SCALE, even though i change the window size, the stage doesn't change :). – Zouhair Elamrani Abou Elassad Feb 09 '16 at 14:52
Regardless of what you set the SWF metatag size to be, the stage can change size based on the embedding HTML. This is the point of `NO_SCALE`, so that the stage *can* change size without scaling content. What does your embed code look like? – Aaron Beall Feb 09 '16 at 15:15
Dude you got it, i noticed that the embed code didn't have 100% for the width and height, i thought it had them, now with those parameters i can Drag and Drop my MovieClip beyond the boundaries of the Stage, Thanks a lot it's WORKING :). – Zouhair Elamrani Abou Elassad Feb 09 '16 at 15:23

score 0 · Answer 2 · edited Feb 09 '16 at 11:39

0

You can try to create an invisible zone that's a little bit smaller than your stage.

So you can add the MOUSE_LEAVE event to the zone, and when your mouse leaves that zone, you can do what you want.

Check the example here.

edited Feb 09 '16 at 11:39

helencrump

1,351
1
18
27

answered Feb 09 '16 at 10:59

Yayang Nopandi

1

I see what you mean, but how am i supposed to know the width/height of that zone, what's great about MOUSE_LEAVE it detects the zone showed by the browser without a need of External Interface because that will be heavy if it's called permanently. – Zouhair Elamrani Abou Elassad Feb 09 '16 at 11:13

score 0 · Answer 3 · answered Jan 22 '20 at 10:13

In response to Aaron Beall's response:

For a more interesting effect, if you want to wait until the movie clip is completely off stage, you can swap the boundaries you check on the object

var bounds:Rectangle = object.getBounds(stage);
if (bounds.right < 0) {
    // do thing
} else if (bounds.left > stage.stageWidth) {
    // do thing
}
if (bounds.bottom < 0) {
    // do thing
} else if (bounds.top > stage.stageHeight) {
    // do thing
}

Make sure you have import flash.geom.Rectangle; imported if this is inside a class.

Check when a part of the MovieClip leaves the Stage

3 Answers3