A basic masking effect will have hard edges. If you wanted to apply alpha-transparency to the mask, it often involved tricks like created separate gradient shapes that blended with the background. In any case, it wasn't a truly transparent mask effect. After the introduction of Flash Player 8, it was possible to have an actual transparent mask. With some very simple actionscript code, you can turn any gradient shape into a mask for any other object.
A basic masking effect will have hard edges. If you wanted to apply alpha-transparency to the mask, it often involved tricks like created separate gradient shapes that blended with the background. In any case, it wasn't a truly transparent mask effect. After the introduction of Flash Player 8, it was possible to have an actual transparent mask. With some very simple actionscript code, you can turn any gradient shape into a mask for any other object.
Setting Up
You can set up a mask just as you normally would. For this tutorial, we'll keep it simple.
1) Import an image file: Insert Menu -> Import Image
2) On the Properties panel, give the image a name ... img1 ... and select the Target option.
3) Draw an Ellipse on top of the image.
4) On the Properties panel, change the line style to None and the fill type to Gradient. Then, change the gradient type to Radial. Name the object mask1 and select the Target option.
5) The colors of the gradient fill do not matter. What does matter, is the transparency of those colors. Any color that is fully opaque (100% alpha) will be fully transparent when it is used as a mask. So, select one of the color markers, and change it's Alpha level to 0%.
6) You can change the colors of the mask if you prefer (I really only mention this because the screenshot below is different than the one above) ;-)
7) Select Scene_1 from the Outline panel and open the Script panel. The mask will be set dynamically through actionscript. The code is simple:
8) Go ahead and test the movie: Control Menu -> Play Movie
What you should see, is a solid ellipse shaped mask covering part of the image:
9) Stop the movie and go back to the Script panel. In order to support transparency in a mask, we need to use the cacheAsBitmap property. When this property is set to true, the Flash player will cache a bitmap version of the object/MovieClip. One of the best uses of this is for MovieClips that contain vector objects. When cached, the Flash player does not have to constantly redraw the vector shapes when they are moved (_x/_y). This reduces the stress on the Flash player and can greatly increase the speed (performance) of your movie. In this case, it allows the Flash player to render the transparent (and partially transparent) areas of the mask.
Both objects need to have their cacheAsBitmap properties set to true before setting the mask:
10) Before any of this will work, you need to make sure we are exporting to the proper version for compatibility. Modify Menu -> Movie Properties -> Export Settings for Movie -> SWF -> SWF version to export: SWF8 (or higher)
11) Now that the code is in place and the export version is set ... go ahead and test the movie again. You should now see a feathered, gradient mask.
12) If you want the mask to follow the mouse (as it does in the example at the top of this tutorial), then you can set the _x and _y position of the mask object to the _xmouse and _ymouse position:
That's really all there is too it! You can use any shape you want - or even a group of gradient shapes inside a MovieClip. Just use movieClipName.cacheAsBitmap and use the whole MovieClip as a mask.
