One of the things I’ve wanted for years in Flash was alpha masks. That is, masks that have gradations in transparency, not just boolean visible / not visible as with masks in Flash 7. Now with Flash 8 we finally have them… sort of.
Flash 8 doesn’t have actual alpha masks per se, but it does have a blend mode called “alpha” which emulates them. You can place a clip with a blend mode of “alpha” into another clip with a blend mode of “layer”, and the parent clip will use the alpha of the child clip for compositing. This gives you the visual effect of a alpha mask (even if it really isn’t one). It also has a blendmode called “erase” that is basically the opposite of alpha – more opaque areas on the child clip are less opaque on the parent (ie. the child “erases” the parent).
I spent a few minutes whipping up a super simple demo. It takes a few pictures (my own strange creations), and cross fades them using an alpha blend mode. I tossed together 4 crossfades:
- A shape tweened radial gradient
- A shape tweened linear gradient
- A grid of square clips that fade in randomly
- A grid of square clips that fade in randomly from right to left
Flash Player 8 required. Might take a few seconds to load (85kb).
EDIT: Added a fourth crossfade.
Actually FP8 has alpha masks. It’s implemented through the bitmap caching functionality. Try something like this:
mc1.cacheAsBitmap = true;
mc2.cacheAsBitmap = true;
mc1.setMask(mc2);
Hmmm, maybe it’s just your choice of images or your implementation of the effect but it lacks the ‘wow’ factor I woul dhave expected from this technique – don’t take that as a criticism, your work is brilliant and your skills outstanding, but I’m having trouble seeing this as anything more than not so good gimmick at the moment – maybe a different example of this technique in use would have more impact?
Skinner’s crossfades SWF
Skinner’s crossfades SWF: I’ve been amazed at all the pre-release SWF showoff files I’ve seen — got no rhyme and reason to what I link here, more of a subjective “wow gotta blog this” feeling — Grant Skinner here shows…
P.S. Can I be your sidekick “gBoy”?
Tinic,
Cool – I wasn’t aware of that. That makes things even easier. I was a little concerned about having to inject a clip arbitrarily into another clip to achieve this effect.
Jon,
No offense taken. When I said I spent a few minutes putting together this demo, I meant it. It’s a few random shape tweens and less than 15 lines of code. I just wanted to show that it was possible, not an amazing implementation of it. 🙂
var PrettyCoolExample:Boolean = true;
trace(“Thanks Dude”);
this.play();
Ah, well tinic’s revelations sounds good, I think maybe part of my lack of enthusiasm was the rather long-winded method myself – I could never understand why flash just couldn’t handle gradient alpha masks etc, always seemed like a huge oversight. I’m sure this is a good technique tho.
Hey Grant, any comment on actionscript.com’s theory that you might be the author of the new v3 components?
Jon, news to me – where on actionscript.com did you see that?
PS. I also cleaned up the linear tween a little bit, to make it look a little bit more production friendly.
http://www.actionscript.com/index.php/fw/1/8-ball-looks-grrrr8/
“V3 Component Architecture – I specifically looked at Grant Skinner’s blog today to see if he had an announcement. Maybe it’s still under NDA, but I’ve suspected that his GLIC components may become Macromedia V3 component architecture. If they don’t, they should have been. But I’ve seen Grant in person around Macromedia offices. With his silence about GLIC, it makes me wonder.”
I wonder if flash 8 has fix the masking problem which won’t display the dynamic text, component (which also use dynamic text) in masking.
Thanks alot for doing this!
Hey, is it possible to see the .FLA file?
thanks,
-bakkelun
This is great but i need speeeed.
Have you solved an alpha mask in AS3?
/Brian
Got it, just needed to change the code syntax.
mc1 = new green();
mc2 = new blue();
mc2.blendMode = BlendMode.ALPHA;
addChild(mc1);
addChild(mc2);
mc1.cacheAsBitmap = true;
mc2.cacheAsBitmap = true;
mc1.mask = mc2;
/Brian
I’d like to know how to animate blending modes (one to another), I’ve tried on the timeline without success and wonder if its possible through script?
Hello, Grant Skinner,
I´ve been in Adobe tuturials and was not able to do this!
Thank you very much for this simple & quick Tutorial.
Cheers!
This post is completely useless without the .FLA – what kind of knowledge sharing is this ? This Post is sharing old news and not helping at all (yes im aware this post is ages old, even worse that there is still no sample FLA).
cheers,
The Visitor
I agree that this post serves no purpose if you are not willing to share the sample FLA
i smell these images is illuminati mindfuck.