Question

I’m making flash game, and I have the staged masked so your character can only see part of it. However, I don’t want the entire stage masked, I only want the “Game Area” masked. Imagine my stage is 800×800. However, the “Game” only takes up the area at the top, 800 by 600. There are 200px at the bottom where I can use for chatting, or displaying information, as your character walks around the game area.

The issue is, I setup my mask, and it masks /everything/ on stage. Even if I have something outside the “game area”, it is still hidden behind the mask. So my question is, in my flash application, how can I use my mask in the “game area”, and not have other parts of my application affected? Can I selectively put items above the mask?

Thank you!

Edit: Clarifying. My game starts by initialzing the GameScreen object:

game = new GameScreen(); //800 x 600.  Declared as class variable
game.y = 40;
addChild(game);

Before that, to make the mask all Black, I put a black rectangle behind the GameScreen:

var rect:Shape = new Shape();
rect.graphics.lineStyle(1, 0x000000);
rect.graphics.beginFill(0x000000);
rect.graphics.drawRect(0,0,800,600);
rect.graphics.endFill();
rect.y = 40;
addChild(rect);

///
/// Start the game
///
game = new GameScreen();
game.y = 40;
addChild(game);

When the GameScreen object initializes, it creates the “hole” so you can see your character.

fogOfWar = new CircleMask();
                addChild(fogOfWar);
                this.mask = fogOfWar;
                fogOfWar.x = player.x;
                fogOfWar.y = player.y;

So now, we have my game setup, with a circular hole in the mask and the player can see his character. However, also when the Game Screen object initializes, it places an infomation bar on the screen. This information bar also gets hidden by the mask. The player cannot see it. The issue is, I want this bar (and other components to be added later) to be visible to the player at all times. I can’t simply change the shape of the “hole” through the mask, because it moves with the player. So how can I allow that information bar to be seen by the player, while still hiding the game area?

Thank you again!

Answer 1

To get a more contextual answer, you should provide a sample of the code you are using to create the mask.

This blog post explains clearly how to create a programmatic mask in AS3.

From what I can gather you have the mask just sitting on the stage, it needs to be applied to another DisplayObject to be useful. At that point, the mask will move around with that DisplayObject, so you can put things infront, behind, whatever you like.

Also, if your mask clip is blank it will mask the entire DisplayObject it’s linked to, to allow content to show through it, it will need to have a suitable shape drawn in it, content will then show through that shape.