Masking vs. clipping/croping

Hi guys,

I understand masking movieclips, and theyre working - and after some experimenting what mask seems to do is only visually mask the movieclip, the entire object underneath the mask still exists in its real dimensions and thus can affect the layout of other elements around it.

So what id like to know, how can i achieve the same masking affect, but actually crop or clip the object that the mask is being applied to.

I guess in HTML/CSS the equivilent would be to put a large image inside a div, then set the width/height of the div to be much smaller than the image and say ‘overflow:hidden’. The image is still its original size but only a portion of it is showing, and more importantly the image size doesnt affect the layout - only the dimensions of the div that contains it.

If you dont understand what i mean ill post a screenshot, thanks!

It sounds a bit like the foundation for your question is based on a faulty assumption.
Hidden areas for masked elements will not “bump” other elements in the layout out of position, or otherwise bork your website layout in the way that inline objects on webpages can.
Masks in Flash are essentially a window through which you can view an object.
The properties of the objects themselves are completely independent from other objects, unless otherwise coded.

The issue is that width and height properties of a display object will remain the same regardless of it’s mask. The flash IDE doesn’t represent this visually very well.

For example if you create a 200x200 MovieClip called ‘myMC’ and create a mask inside it with dimensions of 100x100 the flash properties panel will show the width and height of ‘myMC’ as the size of the mask. However if you trace myMC.width it will report a width of 200.

So for that reason you need to need to take the mask into account when positioning objects with actionscript. If you really need to, you could create a custom class which extends MovieClip and overrides the width and height properties with your own. In this case the width and height of the mask.

or you can access the “mask” property of the desired movieclip, which is a direct reference to the object you used to mask said movieclip.

ie;


myMovie:MovieClip = new MovieClip();
myMask:MovieClip = new MovieClip();
myMovie.width = myMovie.height = 200;
myMask.width = myMask.height = 100;
this.addChild(myMask);
this.addChild(myMovie);
myMovie.mask = setMask(myMask);

trace (myMovie.mask.width); //would return the mask width, 100.


Thanks for all the responses, really, i love this forum, because of people like yourself taking the time to help, so again cheers.

Ok so I didnt give enough background on what im actually trying to do here, some pics will no doubt help. I guess my point was really - if you position something outside the bounds of another element, and add it to this element, masking it helps visually but adds to its dimensions, even though it looks visually unaffected. See my pic below:

My flash interface always has to scale to a given ratio, and i do this by looking at stageWidth/height etc then applied the formula to them, then adjusting the width and height of my outside container. It works perfectly until I add nested sprites to it that are sitting outside its bounds, and thus affect its dimensions.

well yes, its changing the parent dimensions as the mask is responsible for dimensions when its a child. um. not much sense.

if you position the mask inside the bounds of the main movie, then the masked movie ( the maskee i guess ) will not affect the main movie dimensions. if you put the mask outside of the main movie bounds, it will grow to fit. the width of a movie is basically the leftmost point to the rightmost point, and a mask writes off the rightmost and leftmost points of the maskee and is used instead, for that object.

also in step 2 the reason you dont have a problem with width is beyond me, except the mask hasn’t been added, but then i realise this wasn’t much more than conceptual example.

Yeah sorry it was just a simple example to show the concept of what im trying to do.

I think maybe the solution to my problem is to mask the entire introduction container, then use its dimensions for calculations on resizing.

I still dont understand why the container should grow in width when the child is masked to bit inside its bounds.

dotted areas in red show total practicaldimensions.

the middle pic shows the child1 has increased the total size of the clip.

the bottom clip shows the mask is being used to determine overflow and thus the movie is the normal size.