BlendMode.LAYER & overlapping transparent DisplayObjects

by milchreis
BlendMode.LAYER & overlapping transparent DisplayObjects

Demonstration of how setting the blendMode property of the container to BlendMode.LAYER forces a uniform transparency across overlapping children.
♥0 | Line 41 | Modified 2015-05-07 22:46:46 | MIT License
play

ActionScript3 source code

/**
 * Copyright milchreis ( http://wonderfl.net/user/milchreis )
 * MIT License ( http://www.opensource.org/licenses/mit-license.php )
 * Downloaded from: http://wonderfl.net/c/u0tad
 */

package 
{
    import flash.display.BlendMode;
    import flash.display.Sprite;
    public class BlendModeAlphaOverlap extends Sprite 
    {
        public function BlendModeAlphaOverlap() 
        {
            var normalBlend:Sprite = new DoubleBox(0xff0000);
            addChild(normalBlend);
            
            var layerBlend:Sprite = new DoubleBox(0xff00);
            addChild(layerBlend);
            
            layerBlend.x = 100;
            
            layerBlend.blendMode = BlendMode.LAYER;
        }
    }
}
import flash.display.Sprite;
import flash.display.Shape;

internal class DoubleBox extends Sprite
{
    public function DoubleBox(color:uint = 0)
    {        
        var a:Box = new Box(50, 50, color);
        a.x = a.y = 100;
        addChild(a);  
            
        var b:Box = new Box(50, 50, color);
        b.x = b.y = 125;
        addChild(b);    

        alpha = .5;
    } 
}



internal class Box extends Shape
{
    public function Box(width:Number = 100, height:Number = 100, color:uint = 0)
    {
        graphics.beginFill(color)
        graphics.drawRect(0, 0,  width, height);
        graphics.endFill();
    }
}