Is it possible to display a mask object using AS3?
I have a MovieClip called myMC, then I mask myMC with the MovieClip called myMask. MOVIE_CLIP and MASK are library MovieClips.
var myMC:MovieClip = new MOVIE_CLIP();
var myMask:MovieClip = new MASK();
myMC.mask = myMask;
Of course, myMC won't show.
What I want is that myMC is only displayed in myMask, and not outside it, with myMask reamining visible.
To be quite honest with you, this isn't possible AFAIK. A mask, by definition, is invisible. What you would need is to have the mask be the SHAPE you want, and then have an additional MovieClip that shows whatever visual elements you would have shown on the mask.
Case and point, if you wanted to use a glass-pane graphic as your mask, you would need to have a glass-pane graphic, the mask with the same dimensions, and then the MovieClip you're masking underneath that mask.
I hope that helps.
Related
I want to mask the png image pattern.png with another image - mask.png, but it doesn't work at all and I can't find the reason. Instead of masking the image, the mask just disappears and the pattern stays the same as it was.
I tried making a MovieClip, drawing e.g. a circle and using that as the mask instead of mask.png and it works just fine. Is it because you can't use loader objects as masks? How do I make it work?
edit: After changing the size of mask.png to be smaller than the pattern, I've realized that it actually does kind of work, but what happens is instead of cutting the pattern into the shape I've drawn in the png file it just cuts it into the shape of the entire file, as in, it counts the rectangular transparent background as well. How can I make it cut out just the shape?
var mask:Loader = new Loader();
mask.load(new URLRequest("mask.png"));
var pattern:Loader = new Loader();
pattern.load(new URLRequest("pattern.png"));
pattern.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);
function loadComplete(e:Event):void {
addChild(pattern);
addChild(mask);
pattern.mask = mask;
}
Your code is looks correctly. The mask property of DisplayObject wants DisplayObject too. But try to make few things, to find the trouble:
You have only one listener, to pattern.png. But you must be sure, that mask.png has loaded already too.
Despite that Loader is DisplayObject too - try to get content from loader for mask, and just after that try to use it.
*Ah, and one more thing. You must at first add listener, and only later try to load.
I'd like to know how can I add blur in a certain area for example behind a movieclip, maybe a mask that will blur everything in the area of that moviclip.
I don't want to blur everything, just what's behind a movieclip :)
Sort of like Apple is doing with their menus
The only way to do this in AS3 is draw whatever is behind the MovieClip to a Bitmap, then blur the bitmap.
For example, say your MovieClip is a modal dialog of some sort with a semi-transparent background, you could use the following script (inside the MovieClip) to blur whatever is on the stage behind it onto a bitmap surface:
// create a bitmap surface to use as a blurred background
var blurData:BitmapData = new BitmapData(width, height, false);
var blur:Bitmap = new Bitmap(blurData);
addChildAt(blur, 0); // put the blur surface behind everything in the movieclip
// this function draws the portion of the stage that's behind the movieclip
// onto the bitmap surface, then blurs it
function drawBlurBehind():void {
// fill the bitmap with the stage color first
blurData.fillRect(blurData.rect, stage.color);
// account for the coordinate offset of the stage and movieclip
var offset:Point = globalToLocal(new Point());
var matrix:Matrix = new Matrix();
matrix.tx = offset.x;
matrix.ty = offset.y;
// hide the movieclip so it doesn't show up in the blurred background
visible = false;
// draw the stage behind the movieclip onto the bitmap
blurData.draw(stage, matrix);
// blur the background bitmap
blurData.applyFilter(blurData, blurData.rect, new Point(), new BlurFilter(25, 25));
// show the movieclip after the background has been blurred
visible = true;
}
Note that this drawing is not "live" and any time anything changes (you move the movieclip or what's behind it changes) you have to redraw. You could use an ENTER_FRAME event handler to continually redraw every frame, which would basically make it live, but that will be relatively expensive so avoid it if you can.
Also note that this script draws and blurs the whole stage (excluding the movieclip), not what is strictly "behind" the movieclip. So if you want things to appear above the movieclip and not appear blurred behind the movieclip, you'll have to set those to visible=false while you draw the blurred background.
I'm having difficulties trying to add some masks
mc1.mask = randMc;
Where mc1 = loaded MovieClip, and randMc is a pic imported to flash and converted as MovieClip. This is a very big game code I have there so I thought the Indexes might be the problem so I added this :
setChildIndex(randMc, (getChildIndex(mc1)-1));
But it didn't work meaning the movieclip stays the same, it won't mask with randMc...
Any suggestions?
Note: I also have used scaleX/Y on mc1
it seems that .png files are a mask including transparent pixels, so it's a square mask.. anyway I fixed it with
mc1.cacheAsBitmap = true;
randMc.cacheAsBitmap = true;
This way it the empty pixels won't "count" and the mask will be just like the imported .png on stage
I am trying to make a object (movie clip containing textfields and bitmaps) and I need to make it partially transparent at times (like making half of it disappear). How is it possible?
// only things inside the rect will be visible
DisplayObject.scrollRect = new Rectangle(...);
A MovieClip is also a DisplayObject.
Pretty basic question here, but its still got me a little confused..
I have an object(navigation menu bar) that I want to change the colors on with code, so in an updateColor function, I get the bounds of the object (which is a drawing shape contained in a movieclip) and redraw a new shape on top of it with the new color, but I've noticed that the last shape still exists behind this redraw.
I tried using obj.graphics.clear(); before the redraw but that didn't get rid of the original shape. Is there another command that I'm overlooking?
Unless you drew the object you wish to remove within the same graphics object, clearing won't work. You need to remove the DisplayObject.
Depending on the number of children you can do:
obj.removeChildAt(0);
This also removes movieclips / buttons you placed on the stage manually.
If you have a reference to the DisplayObject you wish to remove you can simply do
obj.removeChild(backgroundClip);
Note that you can also change the color of a DisplayObject directly:
import flash.geom.ColorTransform;
...
public var test:MovieClip; //instance on stage
...
var cf:ColorTransform = test.transform.colorTransform;
cf.color = 0xff0000;
test.transform.colorTransform = cf;
while(this.numChildren)
{
this.removeChildAt(0);
}
Will clear child object on this MovieClip,
if it's clearing too much, then put the shape drawing in a subclip, and clear the subclip.