As3: Draw overlapping rectangles to a sprite and apply alpha

Question

I need to draw independet rectangles to a sprite. But the overlapping areas will get visible if I apply alpha to my sprite (th

Answer 1

I suspect that the graphics object does not support this kind of functionality for parts of its data.

If both boxes are individual DisplayObjects, you can set the .blendMode of the DisplayObjectContainer to BlendMode.LAYER, which gives the desired result. Here's some example code that refactors the drawing of a rectangle into a Box class:

var spBox:Sprite = new Sprite();
this.addChild(spBox);


var a:Box = new Box(50, 50, 0x123456);
a.x = a.y = 100;
spBox.addChild(a);  

var b:Box = new Box(50, 50, 0x123456);
b.x = b.y = 125;
spBox.addChild(b);    

spBox.alpha = .5;
spBox.blendMode = BlendMode.LAYER;

The relevant parts of the Box class look like this:

public 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();
    }
}