Ok, you’ve probably always wondered, why photoshop and other apps (like pixelmator for example) allow you to use gradient masks and Flash doesn’t? You probably blamed it on some vector mambo-jumbo and decided to live with it somehow. Well that’s not needed anymore, because with some clever techniques we can achieve this effect in Flash from version 8 and up. It works in actionscript 2.0, but it should be easy to achieve in 3.0 as well. This is a simple, quick effect that we can make having a basketball and it’s reflection underneath. What’s cool is that you can also animate the mask so the ball will bounce for example.
First thing you do is make a flash file, paste your image (it can be a vector shape as well) into it, such as this:
Then let’s duplicate the ball, edit – transform – flip vertical and we have ourselves a sort-of reflection. Let’s move it below, make a movie clip out of it. The movie clip name can be anything, but what’s important to name the instance (in the movie clip properties). In this case I named it “ball2”
Ok now we could just use a black to black gradient with 0 opacity at one end. But that only works for a solid color background so instead we’ll make our gradient white to prove that it works. You can also paste some image below to see it. So let’s make a gradient white to white, with 0 opacity at one end. Such as this:
Now make a movie clip out of it. Name the instance “mask”. Oh and don’t forget to rotate it 180 degrees so the solid white is on top, and the transparency at the bottom. The point here is not to make the mask the normal, layer based way. Instead we put exactly three lines of actionscript (2.0) in the first frame of our movie clip to make this work. And those lines are:
_root.ball2.cacheAsBitmap=true;
_root.mask.cacheAsBitmap=true;
_root.ball2.setMask(“mask”);
And voila. As you can see, after exporting (ctrl + enter on the PC, Option+Enter on a Mac) you’ll see our mask working out as a gradient. How cool is that? (Hint: Very!)
Enjoy!