AS3 - drawings exceeds stage range

Question

Currently i am experiencing a problem with AS3.

I was trying to draw a very long image which its size exceeds the range of the stage. The problem is that the part that exceeds the range of the stage will still be drawn so when I test my program using flash or on webpage the result doesn't look very good.

I set the stage size to 960 by 640, but the parts that beyond 960 and 640 (or even x< 0 y<0 ) are still drawn.

Is there a way to hide the parts that are out of the range and only draw things within the range of the pre-defined stage?

From my understanding the stage width and height should be the only viewable range but I don't know why things out of this range can still be seen.

Btw I am using FlashDevelop.

Thanks very much.

Answer 1

It depends largely whether you're taking a code-only approach or using the IDE.

IDE Approach: In Flash Professional, create a new layer on the stage's timeline. Put a rectangle the exact same size as the stage in that layer. Now, right click the layer and select "Mask". Lock the layer.

Now, make sure all other layers on the stage timeline are positioned under that mask. Drag the layer to just below the mask, so that it appears slightly indented in the list below the mask.

Code Approach: (Code from How to create masks in AS3?. Cheers to Sappy and Nebu for the code.)

var maskShape:Shape = new Shape();
maskShape.graphics.beginFill(0x0);
maskShape.graphics.drawRect(0, 0, 960, 640);
maskShape.graphics.endFill();
addChild(maskShape);
maskShape.x = 0;
maskShape.y = 0;

thingToMask.mask = maskShape;
maskShape.visible = false;