Use setMask to mask flash video clips

Masks are commonly used in flash animation production. It can form a cavity to make the covered object visible through the cavity. The mask layer is often used on the flash stage to implement this technology. In AS, MC is often used to implement the mask. Make the masked object and the masked object into MC, and then use the setMask () method to implement the mask effect.

SetMask () method:

MC's setMask () method enables a MC to become its own mask. MC. setMask (another MC );

Exercise: draw a rectangle on the stage and convert it to MC. The instance name is jx_mc. Draw a smaller garden and convert it to MC. The instance name is yun_mc. Place the circle on the rectangle, open the action panel, and enter:

Jx_mc.setMask (yun_mc );

Yun_mc.onPress = function (){

This. startDrag (true );

}

Yun_mc.onRelease = function (){

StopDrag ();

}

The test film, The Garden has become a rectangular mask.

Font text of the masked device:
Some people often ask why the on-demand video has a mask effect when my text is masked. When I test a video, I have nothing to do with it? The practice we used to teach others in the past is to strip the text, because after the text is split, it is an image, and it can have a mask effect. This is relatively simple, but there is a problem. It may be hard to see the broken text sticking together. We still want to figure out why text cannot be masked? This is because you use the device font. In flash, the font of a device cannot be masked by a mask layer, but only MC can be used to mask the font. That is to say, only the above method can be used.

Exercise:
Create a new MC and use a text tool to input a sentence (using the device font ). Return to the main scenario and drag the text MC onto the stage. The instance name is wb_mc. Draw a pen-less rectangle on the left of the text, which is a rectangle filled with a height of 10 pixels in width. Convert to MC and the instance name is zz_mc. double-click it to enter the editing status, insert a key frame in 40th frames, drag it into the same length as the text with a deformation tool, cover the text, and create a compensation animation. Return to the main scenario, create a new layer, open the use panel, and enter:

Wb_mc.setMask (zz_mc );

Test the film. We want the mask effect to appear.

Alpha channel mask:

We often see an effect. Some people call it a fuzzy mask, while others call it a feather mask. At a glance, smart people like me know that this is a mask effect. This is nothing more than reducing the transparency of the mask layer, or using a fuzzy filter. So I started to do it with full confidence. The result is conceivable and failed!

Flash calls this mask an Alpha-channel mask. You can use this mask to set the transparency of the mask element or use the filter effect. However, you must pay attention to the following two points when using this mask:
1. Alpha channel mask: The mask mode of the mask layer is not supported. You can only use MC to mask.
2. The "runtime bitmap cache" must be used for both the MC and the MC ".

Next, let's take an exercise to further understand the content described in this section.

Effect:

1. Create a new flash document and import a background image and a Guanyin image.
2. Create a component, create a new MC, name it Guanyin, drag the Guanyin image, adjust the size, and align the center.
3. Create a new MC, named "Yin", drag the Guanyin component into the center and align it. Open the attribute panel, name the instance img_mc, and check before "use runtime cache. Insert a frame into 200 frames and lock the frame. Insert a new layer and draw an elliptical area without any fill color, as shown in the figure below:

Convert this Elliptical Garden to MC, and the instance name is zz_mc, which is checked before "use runtime cache. Open the filter panel and add a blur filter to zz_mc. The value is 100. Insert a key frame into the 30th frame, return to the first frame, and narrow the elliptical area to 2 pixels to create a compensation animation. Insert a key frame in 90th frames, insert a key frame in 120th frames, and reduce the elliptical area to 2 pixels. Insert a frame into 200th frames. Lock. Create a new layer named action. Open the frame action panel and enter:

Img_mc.setMask (zz_mc );

4. Create a new MC named "text", input the text in the text tool, as shown in the following figure, and use the device font.

 

5. Create a new MC named "mask text", drag the text component into the center and align it. The instance name is wb_mc, which is checked before "use runtime cache. Insert a frame into 170 frames and lock the frame. Insert a new layer, draw a line-style fill color without strokes, the left color transparency is 0, the right color transparency is 100 of the moment, the left side of the rectangle is aligned with the right side of the text, as shown in the following figure:

 

Convert the moment type to MC, and the instance name is zz2_mc, which is checked before "use runtime cache. Insert a key frame of 30th frames, align the right side of the rectangle with the right side of the text, and create a compensation animation. Insert a key frame at 60th frames, insert a key frame at 90th frames, align the left side of the rectangle with the right side of the text, insert a frame at 170th frames, and lock the frame. Create a new layer named action. Open the frame action panel and enter:

Wb_mc.setMask (zz2_mc );

6. Return to the main scenario, drag the background image into, open the alignment panel, match the width and height with respect to the stage, and align the center. Insert a frame into 200 frames. Lock.
7. Create a new layer, drag the Guanyin element in the mask, place it on the upper part of the stage, and insert frames at 200 frames.
8. Create a new layer, insert a key frame at 30 frames, drag the masked text to the top right of the stage, and insert a frame at 200 frames.

OK.

Materials in this exercise: