AS3 : How do I clear graphics in a specific pixel/area

Question

I know that you use graphics.clear to clear all the graphics but that clears the graphics from the stage, I would like to clear graphics in a specific pixel(s) or between x-y value how do I do that?

Answer 1

There's no way to do that with graphics. I just tried, drawing transparent shapes does not create holes, alas.

You should convert the graphics you have into Bitmap instance and work with pixels:

package
{
    import flash.geom.Matrix;
    import flash.geom.Rectangle;

    import flash.display.Sprite;
    import flash.display.Bitmap;
    import flash.display.BitmapData;
    import flash.display.DisplayObject;

    public class Holey extends Sprite
    {
        public function Holey() 
        {
            super();

            // Lets create some example graphics.
            graphics.beginFill(0x990000);
            graphics.drawCircle(200, 200, 100);
            graphics.endFill();

            // Convert into raster and make 1 pixel transparent.
            var aBit:Bitmap = rasterize(this);
            aBit.bitmapData.setPixel32(50, 50, 0x00000000);

            graphics.clear();
            addChild(aBit);
        }

        private function rasterize(source:DisplayObject):Bitmap
        {
            // Obtain bounds of the graphics.
            var aBounds:Rectangle = source.getBounds(source);

            // Create raster of appropriate size.
            var aRaster:BitmapData = new BitmapData(aBounds.width, aBounds.height, true, 0x00000000);

            // Make an offset to capture all the graphics.
            var aMatrix:Matrix = new Matrix;
            aMatrix.translate(-aBounds.left, -aBounds.top);

            aRaster.draw(source, aMatrix);
            return new Bitmap(aRaster);
        }
    }
}

Answer 2

The way to do this would be with a mask. Using an alpha mask (both mask and maskee use cacheAsBitmap=true) you can draw transparent pixels onto the mask to erase parts. The basic approach would be:

1. Put all your graphics that you want to be effected by the mask in a common container (if you mean for everything to be cut, then they are already in a common container: the stage or root timeline.)

2. Draw a bitmap data object that has a transparent "hole" in the area you want to erase. For example:

   // fill the stage with a solid rectangle
   var maskBitmapData:BitmapData = new BitmapData(stage.stageWidth, stage.stageHeight, true, 0xff000000);
   // erase part of it by drawing transparent pixels
   maskBitmapData.fillRect(new Rectangle(20, 20, 200, 100), 0);
   
   // create the mask object
   var maskBitmap:Bitmap = new Bitmap(maskBitmapData);
   maskBitmap.cacheAsBitmap = true; // this makes the mask an alpha mask
   addChild(maskBitmap);
   

3. Set the container's .mask property. For example, to mask the entire main timeline:

   root.cacheAsBitmap = true; // this makes the mask an alpha mask
   root.mask = maskBitmap;