Flash DecalSheet System
Step 2 – Creating the DecalSheet Class
Step 6 – DecalSheet sample method
public function registerDecal(name:String, rectangle:Rectangle): void { decalRectangles[name] = rectangle; } Now you can associate a Decal's cutout coordinates to a name and a rectangle. You will also need to import the Rectangle class at line 5:
The DecalSheet extends the Bitmap Class. I have set up my classes in com.flashartofwar packages but you are free to set them up however you want. Create a new class called DecalSheet and paste in the following code, see (Listing 2). Step 3 – Testing the DecalSheet Now that we have created our DecalSheet , lets make sure it can display images. We are going to do this by passing in the BitmapData of the png we loaded earlier. Go back into the Doc Class and replace line 40, where we call addChild with the following: decalSheet = new DecalSheet(bitmap.bitmapD ata); addChild(decalSheet); We are also going to have to import the DecalSheet class at line 3:
We are going to add the single most important function of the DeaclSheet , the sample() method. This function is what we will use to cut out BitmapData from the DecalSheet in order to create our decals. Lets put the following function on line 22 of the DecalSheet Class, see (Listing 3). Also you will need to import the Matrix Class on line 5:
import flash.geom.Rectangle;
import flash.geom.Matrix;
Listing 1. Step 1: The DecalSheetTutorial Doc Class
package { import flash.display.Bitmap; import flash.display.Loader; import flash.display.Sprite; import flash.display.StageAlign; import flash.display.StageScaleMode; import flash.events.Event; import flash.net.URLRequest;
import com.flashartofwar.DecalSheet;
public class DeaclSheetTutorial extends Sprite { private var loader:Loader; public function DeaclSheetTutorial() { configureStage(); } private function configureStage():void { stage.align = StageAlign.TOP_LEFT;
As well as setting up a variable to save our DecalSheet at line 16:
private var decalSheet:DecalSheet;
Now, when you compile, you should see the same image but now it is inside of the DecalSheet. Lets talk about how we can cut these graphics out. Step 4 – Storing Decals in the DecalSheet At this point we have a simple DecalSheet class that extends the Bitmap Class. Our goal is to be able to define areas of the DecalSheet that can be cut out and turned into Decals. Before we can register decals we are going to need a place to store them. Add the following property on line 8:
loadDecalSheetSource("images/button_skin_a.png");
stage.scaleMode = StageScaleMode.NO_SCALE;
} public function loadDecalSheetSource(url:String):void { loader= new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onImageLoad); loader.load( new URLRequest( url ) );
protected var decalRectangles:Dictionary = new Dictionary(true);
} private function onImageLoad(event:Event):void {
And import the Dictonary class on line 5:
import flash.utils.Dictionary;
loader.removeEventListener(Event.COMPLETE, onImageLoad); var bitmap:Bitmap = Bitmap(loader.content);
As you can see this Dictonary is going to be the place were we can associate a Decal's names with its coordinates. Step 5 – Registering Decals At its core, a Decal is really just a name and its x, y, width, and height values that we use to cut out BitmapData from the DecalSheet . We are going to register this information with the following function on line 16.
addChild(bitmap);
}
}
}
03/2009 (5)
31
Made with FlippingBook HTML5