How to get transparency to work on a bitmap in Actionscript

For a class project I'm working on "Pissed Off Pigs" (I think you get the idea, the pigs get revenge, don't worry, I'm not going to release it!) and I want to create circles with a fill from a bitmap (circles because the collision math is easier). Here is how they look now.

Of course, the white is the problem. Below is my "pigs" class. Any ideas? I've tried gif's, pngs, 8-bit pngs, etc and it seems to make no difference. The image itself is 20px square and the radius of the circle is 10px (so a 20px diameter). Here is the image I'm using:

And I know I should probably load the image outside the class and just pass the BitmapData when I make a new pig so I don't have to load the image every time I create a new pig but for now it works! (Sorta).

Is the matrix translate the problem?

Oh, and I have checked bmpImage.transparent and it returns true (even when I don't specify true in the constructor).

` package { import flash.display.; import flash.net.; import flash.events.; import flash.geom.; import flash.display.BitmapDataChannel;

public class pig extends Sprite {
    public var radius:uint;
    public var velocity:Vec2;
    public var tt:Sprite;
    public var pigLoader:Loader;
    public var bmpImage:BitmapData;
    public var framesAlive:uint;


    public function pig(xx:uint, yy:uint, radius:uint, vx:Number, vy:Number, sprite:String){
        this.x = xx;
        this.y = yy;
        this.radius = radius;

        this.velocity = new Vec2(vx, vy);

        pigLoader = new Loader();
        pigLoader.load(new URLRequest(sprite));
        pigLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, picLoaded);

    }
    private function picLoaded(event:Event):void {
        bmpImage = new BitmapData(pigLoader.width, pigLoader.height, true);
        bmpImage.draw(pigLoader);
        tt = new Sprite();
        var matrix:Matrix;
        matrix = new Matrix();
       开发者_开发技巧 matrix.translate( -10, -10);
        tt.graphics.beginBitmapFill(bmpImage, matrix, false, false);
        tt.graphics.drawCircle(0, 0, this.radius)
        tt.graphics.endFill();
        this.addChild(tt);
    }
}

}

`

You've way overcomplicated the problem. Bitmap fill is normally used when you want to fill a large area with a tiled pattern, and the pattern is coming from a bitmap (think wallpaper), you don't need to use it here. What you should be doing is using the Loader.content Bitmap. You don't need the draw() or the matrix, just use .x and .y to move your pig Bitmap centered over your Sprite's (0,0) point if that's the center of the circle you're using for collision detection.

There is no reason for your pig sprite to have a visual circle for you to use circle-based collision detection. The visual representation should not matter to your collision detection at all. Circle-based collision detection is normally just an application of the Pythagorean distance formula, i.e. if the distance between centers is less than (or equal to) the sum of the radii of the circles being tested, you have overlap (collision).

What if you replace that last function with this:

private function picLoaded(event:Event):void
{
    var pigPic:Bitmap = event.target.loader.content;
    pigPic.x -= 10;
    pigPic.y -= 10;
    this.addChild(pigPic);
}

in order to have a functional alpha channel in your bitmapData canvas you need to set a zero alpha for the 32-bit hex value (0x00FFFFFF) of the BitmapData object's fillColor property prior to drawing.

package
{
//Imports
import flash.display.Sprite;
import flash.display.Shape;
import flash.display.Bitmap;
import flash.display.BitmapData;

//SWF Metadata Tag
[SWF(width = "1000", height = "500", frameRate = "30", backgroundColor = "#000000")]

//Class
public class Test extends Sprite
    {
    //Constructor
    public function Test()
        {       
        var sh:Shape = new Shape();
        sh.graphics.beginFill(0xFF0000, 1.0);
        sh.graphics.lineTo(200, 200);
        sh.graphics.lineTo(0, 200);
        sh.graphics.lineTo(0, 0);
        sh.graphics.endFill();

        var shBitmapData:BitmapData = new BitmapData(sh.width, sh.height, true, 0x00FFFFFF); //32-bit Hex Value
        shBitmapData.draw(sh);

        addChild(new Bitmap(shBitmapData));
        }
    }
}

swap it out to the default value of 0xFFFFFFFF to see the difference.