BlendMode.LAYER; A must when changing the alpha property of a DisplayObject containing other DisplayObjects

I don’t know if you ever tweened a MovieClip’s alpha while this MovieClip contained multiple assets, but I kinda do this all the time (fade in ,fade out being the easiest transition for almost everything). The default way Flash handles this is by changing the alpha of every assets in the containing MovieClip (or Sprite). Sometimes it doesn’t matter but most of the time that’s not the behavior you would like it to have. When you have shapes or bitmaps that overlap or hide other graphical assets you will see what is under it when changing the alpha instead of actually changing the alpha of the container as if it was a whole.

Well I don’t know if it’s clear but I have an example below that should clarify that. Anyway, I have stumbled upon the solution to this while browsing through the help files for BlendMode. If you set the blendMode of your containing DisplayObject to BlendMode.LAYER Flash will consider this DisplayObject as only one layer and will change the alpha the way you normally think it would.

Here is the example that will illustrate my point better. The left Sprite is the reference object, the middle Sprite has no blendMode on and the right Sprite has a blendMode of BlendMode.LAYER. Mostly look at the colors while tweening and the overlapping regions of the green and blue ellipses.

I really wish I had found this earlier and I hope this will help others that were in my situation.

Cet article en Français

, , , ,

  1. #1 by Sidney de Koning - April 29th, 2008 at 03:55

    Hi,

    The example is not showing up :(
    I’m using flash player 9.0.124.

    Dont know if other people are also noticing this.

    Cheers,

    SIdney

  2. #2 by dgelineau - April 29th, 2008 at 18:17

    There seemed to be a problem with the word press plugin I am using to embed the flash. Since I am using the title of the page as the url to this particular page the path to the flash file was different than on the home page. I seem to have it fixed now.

    Thank you for pointing it out.

  3. #3 by Og2t - May 12th, 2008 at 07:21

    Oh, thanks for sharing! I was always wondering how to achieve that mode… and it was just simply Layer blend mode. I should have been read the manual in the first place ;-)

  4. #4 by zgub - June 4th, 2008 at 08:02

    Do you have to assign this value only once (let’s say at the time of creating the container’s content) or everytime tween has to be shown?

    I have a similar (at least, that’s what I suspect) problem with clip containing Bitmap and white rectangle beneath it that acts as a border. Problem appears when the fadein/out is supposed to take place, showing transparent hole where the bitmap is supposed to be. Then, it suddenly appears when the alpha value reaches 100%.

  5. #5 by Paulo Barcelos - August 27th, 2008 at 16:52

    Genius!

    I’ve been living up with this problem for ages! Can’t believe it was so simple….Thanks for the tip!

  6. #6 by oliver - September 22nd, 2008 at 01:24

    I think this is more to do with cacheAsBitmap rather than “layer” blendMode, yes?
    this is why zgub’s having problems with white.

  7. #7 by James - March 9th, 2009 at 02:20

    Fantastic! I’ve been looking for this for years.

    [hi5]

  8. #8 by Rezmason - October 2nd, 2009 at 23:14

    Also note that the LAYER blendMode is also what allows us to use ALPHA and ERASE blendModes. A lot of people get hung up on that as well.

  9. #9 by Jensa - October 3rd, 2009 at 01:27

    Brilliant find! Always wondered if that was possible. Thanks for posting!

    J

  10. #10 by scottchu.tw - December 28th, 2009 at 02:15

    your article explains the meaning of BlendMode.LAYER for me well.

    Thanks a lot!

  11. #11 by James - February 24th, 2011 at 00:45

    Haven’t been able to get this working in cs5.. anyone have the source?
    Cheers,
    James

  12. #12 by joni - March 23rd, 2011 at 19:37

    movieclip.blendmode = BlendMode.LAYER

  13. #13 by Seema Navale - April 5th, 2011 at 05:30

    Thanx a lot useful stuff.

  14. #14 by Keith - June 21st, 2011 at 11:33

    This is something I have noticed in Flash for years and never actually knew there was a ‘fix’ for it. Thank you so much for this post!

(will not be published)
Subscribe to comments feed