Ted Patrick > { Events & Community } > Adobe Systems


Depth Mask Magic - Add a dynamic mask & mask Items at Runtime

It seems that masks are properties set on a range of depths at compile time. This helps explain the fine details of how masks work and how to get the most out of them. \0

First I need to explain a few confusing items. Bear with me, understanding these will make you more effective in Flash very quickly.

There are 3 states during development:

Authortime - When you make your movie.
CompileTime - When the Flash compiler take your FLA and makes a swf.
Runtime - When your swf and the player doing their thing.

At every stage, one change can affect the downward stages. Change something at authortime, it will change the Runtime swf. If you understand these changes, it allows you to get the most out of the tools.

When you add a keyframe to your FLA (authortime), the contained items are broken into individual MovieClipDatatypes (MCD) at runtime. Each element be it a symbol, button, component, movieclip, is turned into a MCD and inserted into a unique depth within the player. The default depth starts at -16383 and moves upward adding elements to the player. At authortime you can designate these items as a movieclip and add an instance name _name to allow you to get values from the MCD. When symbols and groups are added at runtime, their __proto__ property does not reference the MovieClip class and thus do not contain the methods allowing them to be manipulated.

Adding a mask simply sets a property on a range of depths. The bottommost depth of that range holds the mask MCD itself. Mask items are added on top of this depth skipping a depth. Once all the mask items are added at a unique depth, 2 more depths are added to the mask. Here is how a simple mask looks at runtime:


Depth -16378 - normal - empty
Depth -16379 - Mask enabled - empty
Depth -16380 - Mask enabled - empty
Depth -16381 - Mask enabled - Mask Item MCD
Depth -16382 - Mask enabled - empty
Depth -16383 - Mask enabled - Mask MCD

In this case only one element was contained within the mask.

It is possible to add items to the mask dynamically at runtime as follows:

_level0.attachMovieClip('circle','mycircle', -16379)
_level0.attachMovieClip('circle','mycircle', -16380)
_level0.attachMovieClip('circle','mycircle', -16381)
_level0.attachMovieClip('circle','mycircle', -16382)
_level0.attachMovieClip('circle','mycircle', -16378) // fails to add to mask and adds over the mask

Or you can add nested items at depth into the Mask movieclip

//square is the _name of my mask
_level0.square.attachMovieClip('circle','mycircle', 0)

You cannot add a movieclip to the Mask MCD depth (-16383). This causes the mask to break apart exposing all of the mask items contents. Although you can shift the mask within the predefined mask layers and only the mask items above the mask will affect the mask itself. Here is a sample:

// circle is the _name of my mask item
circle.swapDepths(-16380)
// square is the _name of my mask
square.swapDepths(-16382)

The mask is still the same, but has been shifted up in terms of depth. Should you move a mask item outside of the compile time define mask range, that item will be exposed out of the mask. If you move the mask MCD outside of the mask, the mask will break apart, but if the proper depth is restored at a later time, the mask will still work.

Here is a sample FLA, that contains the test case.

Flash MX Sample
Flash 5 Sample

Best of all this is compatible with Flash 5 and higher.

The only difference in the Flash 5 version is that the base depth is -16382 not -16383 and getDepth is not supported so you are flying blind. Not a problem as 5 is ancient history as a player. ;)

Have fun and don't hurt yourself.

cheers,

ted ;)

0 Responses to “ Depth Mask Magic - Add a dynamic mask & mask Items at Runtime ”

Post a Comment



Jobs


Flex Jobs
city, state, zip


© 2008 Ted On Flex