actionscript 3.0 visible mask over a visible masked object - actionscript-3

I have a moving truck in my game and I want the city lights reflections (NOT the background) to be visible over its body as it moves around.
What stands behind the truck does not matter, some trees and buildings.
So,
I add the background (not important);
then I add the truck to the stage;
then I add another MovieClip with the size of the whole stage (city lights and stuff) and I set it as a masking object for my truck.
I dont want the truck to disappear, i just want the masking object show up over it with some transparency;
I know about masking and also catching my movieclips as bitmaps but it wont work in my case; because here the truck stays totally visible and the mask semi-transparent.
Please help me, I'm running out of time:/
EDIT
Here is my current code based off one of the asnwers:
var buildingHolder: Sprite = new Sprite;
this.addChild(buildingHolder);
var Mask: Sprite = new Sprite()
Mask = Sprite(buildingHolder);
Mask.alpha = 1;
Mask.cacheAsBitmap = true;
this.addChild(Mask);
var reflection: MovieClip = new nightSky1Mask;
reflection.x = 0;
reflection.y = 480;
reflection.alpha = .6;
reflection.scaleX *= 320 / reflection.width;
reflection.scaleY = reflection.scaleX;
reflection.cacheAsBitmap = true;
reflection.mask = Mask;
this.addChild(reflection);
for (var i: int = 0; i <= 29; i++){
//some codes are deleted here
var image: MovieClip = new level1Images[i];
image.x = // deleted
image.y = // deleted
image.scaleX *= 30 / image.width * 2;
image.scaleY *= 5 / image.width * 2;
buildingHolder.addChild(image)
currLevelImages.push(image)
}

You DON'T want to mask the truck. What you want to mask are the city lights.
You need to create a copy of the truck, and mask the city lights with that.
Assuming you have a Bitmap in your library with exported class as TruckImage and your lights are exported for actionscript as Lights, you can do something like this:
var truck:Bitmap = new Bitmap(new TruckImage());
//scale and position however you'd like
truck.scaleX = truck.scaleY = .25;
truck.y = 100;
addChild(truck);
var theMask:Bitmap = new Bitmap(truck.bitmapData);
theMask.cacheAsBitmap = true;//!very important
theMask.scaleX = theMask.scaleY = truck.scaleX;
addChild(theMask); //also important
lights = new Bitmap(new Lights());
lights.cacheAsBitmap = true;//!very important
lights.mask = theMask;
addChild(lights);
//let's move the truck and the mask every frame
addEventListener(Event.ENTER_FRAME,enterFrame);
function enterFrame(e:Event):void {
truck.x = (truck.x + 2) % stage.stageWidth;
theMask.x = truck.x;
}
EDIT
Try something like this: (creating a bitmap copy of your building)
var buildingHolder:Sprite = new Sprite();
this.addChild(buildingHolder);
//create a bitmap data object and draw the building holder sprite into it (making a copy)
var maskBMD:BitmapData = new BitmapData(buildingHolder.width,buildingHolder.height,true,0x00000000);
maskBMD.draw(buildingHolder);
var msk:Bitmap = new Bitmap(maskBMD,"auto",true);
msk.cacheAsBitmap = true;
this.addChild(msk);
var reflection:MovieClip = new nightSky1Mask;
reflection.x = 0;
reflection.y = 480;
reflection.alpha = .6;
reflection.scaleX *= 320 / reflection.width;
reflection.scaleY = reflection.scaleX;
reflection.cacheAsBitmap = true;
reflection.mask = msk;
this.addChild(reflection);
for (var i: int = 0; i <= 29; i++){
//some codes are deleted here
var image: MovieClip = new level1Images[i];
image.x = // deleted
image.y = // deleted
image.scaleX *= 30 / image.width * 2;
image.scaleY *= 5 / image.width * 2;
buildingHolder.addChild(image)
currLevelImages.push(image)
}
Or, you could do something like this to make two copies of your building:
var buildingHolder:Sprite = createBuilding();
var buildingHolderMask:Sprite = createBuilding(false);
function createBuilding(addToArray:Boolean = true):Sprite {
var building:Sprite = new Sprite();
for (var i: int = 0; i <= 29; i++){
//some codes are deleted here
var image: MovieClip = new level1Images[i];
image.x = // deleted
image.y = // deleted
image.scaleX *= 30 / image.width * 2;
image.scaleY *= 5 / image.width * 2;
building.addChild(image)
if(addToArray) currLevelImages.push(image)
}
return building;
}

Related

Creating Falling Snow in AS3/Flash

So I am trying to create random, falling snow in a Flash application. Using the following code I have my snow appearing at a random point on the screen.
var mc:snowFalling = new snowFalling();
addChild(mc);
var result:Number = Math.random() * 100;
var randomX:Number = Math.random() * stage.stageWidth;
mc.x = randomX;
snowFalling is the linkage name.
I am unsure how to have the snow both appear multiple times and respawn. Could someone give me a rundown of the code I will need to do this.
First, you need to create as many snowflakes on the screen as you'd like to have. Then, you need to move each snow flake every frame tick. Something like the following is ONE way you could do it. (there are many ways to accomplish this).
var flakes:Vector.<snowFalling> = new Vector.<snowFalling>(); //an array to store all your snow flakes
var mc:snowFalling;
var mc2:snowFalling;
var columns:int = 5;
var rows:int = 7;
var columnWidth:Number = stage.stageWidth / columns;
var rowHeight:Number = stage.stageHeight / rows;
//make 5 columns
for (var i:int = 0; i < columns; i++) {
mc = new snowFalling();
mc.x = (columnWidth * i);// + (Math.random() * (columnWidth * .25)); //to randomize the x position within the column size
addChild(mc);
flakes.push(mc);
//make 7 rows in each column
for (var j:int = 0; j < rows; j++) {
mc2 = new snowFalling();
mc2.x = mc.x;
mc2.y = (rowHeight * j);// + (Math.random() * (rowHeight * .25)); //to randomize the y within the row size
addChild(mc2);
flakes.push(mc2);
}
}
//run the enterFrame function below every frame tick of the application
this.addEventListener(Event.ENTER_FRAME, enterFrame);
function enterFrame(e:Event):void {
//loop through each snowflake in the flakes array
for (var i:int = 0; i < flakes.length; i++) {
flakes[i].y += 2; //move it down 2 pixels
//check to see if it's off screen, if so, move back to the top of the screen (less it's height so it's just off screen at the top)
if (flakes[i].y > stage.stageHeight) flakes[i].y = -flakes[i].height;
}
}
Or, if you wanted a traditional spawn type method, this:
//create a container to hold all the snowflakes
var snowContainer:Sprite = new Sprite();
addChild(snowContainer);
//this function creates a snowflake and puts it at the top of the screen in a random x spot
function spawnFlake(e:Event = null):void {
var mc:snowFalling;
snowContainer.addChild(mc);
mc.x = Math.random() * (stage.stageWidth - mc.width);
mc.y = -mc.height; //just off screen at the top
}
//create a timer that will call the spanFlake function every second
var timer:Timer = new Timer(1000);
timer.addEventListener(TimerEvent.TIMER, spawnFlake);
timer.start();
this.addEventListener(Event.ENTER_FRAME, enterFrame);
//every frame, iterate through all the children of snowContainer and move the flakes down 2 pixels
function enterFrame(e:Event):void {
var flake:snowFalling;
var i:int = snowContainer.numChildren;
//we need to iterate backwards because we are potentially removing items (which would throw our i value out of whack if iterating forwards)
while(i--){
flake = snowContainer.getChildAt(i) as snowFalling;
flake.y += 2;
//if out of bounds, remove the flake
if (flake.y > stage.stageHeight) {
snowContainer.removeChild(flake);
}
}
}

How to place multiple bitmaps in a scrollable rectangle? AS3

This code builds a palette of tiles for use in a map maker program. It takes in an array set by its parent and uses the bitmaps(from the objects) in that array to display a grid of tiles. Right now it only does a 5x5 grid, but what if there are more than 25 tiles in my tileSet? I want to display only the 5x5 tile grid, but be able to scroll through the images. I imagine that I need to make another rectangle to use as its mask and use a ScrollBar to make it scrollRect, but I can't get this working. Please Help.
public function Palette(X:uint, Y:uint, tileSet:Array)
{
addChild(handleGraphics);
var palette:Rectangle = new Rectangle(X, Y, 5*32, tileSet.length*32); //Default size is 5x5 tiles.
handleGraphics.DrawGrid(32,palette.x,palette.y,5,5);
var counter:int = 0;
for(var i:int = 0; i < 5; i++)
{
paletteArray[i] = [];
for(var u:int = 0; u < 5; u++)
{
if(counter >= tileSet.length)
{
counter = 0; //Which frame to show?
}
var b:Bitmap = new Bitmap(tileSet[counter].Graphic);
b.x = (palette.x) + 32 * u; //Align with palette Rectangle.
b.y = (palette.y) + 32 * i; ///////////////////////////////
addChild(b);
var tileObj:Object = new Object();
tileObj.Name = tileSet[counter].Name;
tileObj.Frame = tileSet[counter].Frame;
tileObj.Graphic = tileSet[counter].Graphic;
paletteArray[i].push(tileObj);
setChildIndex(b, 0); //Under grid.
counter++;
}
}
ActivatePaletteListeners();
}
This code works great for a tileSet array that has less than 25 objects. It loops and shows them continuously until it hits 25. I could do without this I guess, but it is a neat affect.
In another class (HandleTiles) I cycle through my tileSet MovieClip and use each frame to create a new object for each tile.
public function GetPaletteTiles(MC:MovieClip)
{
if (tileArray != null)
{
tileArray.length = 0;
}
for(var i:int = 1; i <= MC.totalFrames; i++)
{
MC.gotoAndStop(i); //Change frame for new info.
var tileObj:Object = new Object(); //The object to push to an array of tiles.
var graphicData:BitmapData = new BitmapData(32,32);
graphicData.draw(MC); //Graphic data from sampleTS.
tileObj.Name = MC.currentFrameLabel;
tileObj.Frame = MC.currentFrame;
tileObj.Graphic = graphicData;
tileArray.push(tileObj);
}
BuildIndexArray(15, 20); //Default size 15 x 20.
}
And here I set the tileSet to use
private function ChangeActiveTileset(Mc:MovieClip)
{
activeTileset = Mc;
GetPaletteTiles(activeTileset);
UpdatePalette();
}
I can change the tileSet with a comboBox. That's why I tear down the tileArray every time I call GetPaletteTiles(). Each tileSet is a different MovieClip, like Buildings, Samples, InTheCity, etc.
Sorry I didn't have time to get this code together earlier. Here's tiling code pieces. Because you're using rectangle and you have to stay under max dimensions you have to move the source mc. I think you already know everything else in there.
// set the bmp dimensions to device screensize to prevent exceeding device's max bmp dimensions
if (bStagePortrait) {
iTileWidth = Capabilities.screenResolutionX;
iTileHeight = Capabilities.screenResolutionY;
} else {
iTileWidth = Capabilities.screenResolutionY;
iTileHeight = Capabilities.screenResolutionX;
}
// mcList.mcListVector is the source mc - a regular mc containing mcs, jpgs, dynamic text, vector shapes, etc.
// mcList.mcListBmp is an empty mc
aListTiles = new Array();
iNumberOfTiles = Math.ceil(mcList.height / iTileHeight);
for (i = 0; i < iNumberOfTiles; i++) {
var bmpTile: Bitmap;
// move the source mc
mcList.mcListVector.y = -(i * iTileHeight);
bmpTile = fDrawTile(mcList, 0, 0, iTileWidth, iTileHeight);
mcList.mcListBmp.addChild(bmpTile);
bmpTile.x = 0;
bmpTile.y = (i * iTileHeight);
aListTiles.push(bmpTile);
}
// remove the regular mc
mcList.mcListVector.removeChild(mcList.mcListVector.mcPic);
mcList.mcListVector.mcPic = null;
mcList.removeChild(mcList.mcListVector);
mcList.mcListVector = null;
}
function fDrawTile(pClip: MovieClip, pX: int, pY: int, pWidth: int, pHeight: int): Bitmap {
trace("fDrawTile: " + pX + "," + pY + " " + pWidth + "," + pHeight);
var rectTemp: Rectangle = new Rectangle(pX, pY, pWidth, pHeight);
var bdClip: BitmapData = new BitmapData(pWidth, pHeight, true, 0x00000000);
var bdTemp: BitmapData = new BitmapData(pWidth, pHeight, true, 0x00000000);
bdClip.draw(pClip, null, null, null, rectTemp, true);
bdTemp.copyPixels(bdClip, rectTemp, new Point(0, 0));
var bmpReturn: Bitmap = new Bitmap(bdTemp, "auto", true);
return bmpReturn;
}

Previous function is called/Event listener 'delayed' by one

I have altered an image carousel I downloaded, to rotate to the next picture (left or right) when I click one of the two buttons I added. The original carousel was built to rotate according to mouse movement/position.
For some reason, whenever I click the 'right' or 'left' button, which each rotate the carousel in their respecive directions, the event listener/handler is one 'behind'. It does whatever it should've done the previous time I clicked a button. To put it more clearly, the first button click it does nothing. The second button click it responds to what I clicked the last time.
Example:
I click the left button, nothing happens.
Then I click the right button, the carousel rotates to the left (because I clicked the left button before this click)
Then I click the left button, the carousel rotates to the right (idem).
See the code below. It seems fairly simple; no complex structure or whatever.
You can ignore most vars and positioning (like focalLength,vanishingPointX,radius, etc), I suppose. I'm guessing this bug is either related to the importing/processing of the XML, the for() loops, or the structure the .as file has.
package {
//here are all the imports
public class Imagereel extends Sprite {
var imgurl:URLRequest = new URLRequest()
var loadedimgs:uint = 0;
var images_num = 0;
var imageHolders:Array = new Array();
var imageHolder:MovieClip;
var btnLeft:BtnLeft = new BtnLeft;
var btnRight:BtnRight = new BtnRight;
//Set the focal length
var focalLength:Number = 2000;
//Set the vanishing point
var vanishingPointX:Number = stage.stageWidth / 2;
var vanishingPointY:Number = stage.stageHeight / 2;
//The 3D floor for the images
var floor:Number = 40;
//Radius of the circle
var radius:Number = 350;
//We use 70x70 sized images (change this if different for your images)
const IMAGE_WIDTH:uint = 393;
const IMAGE_HEIGHT:uint = 249;
var xmlLoader:URLLoader = new URLLoader();
var xmlData:XML = new XML();
public function Imagereel() {
//here's the positioning of the buttons
//here are the button addChilds
xmlLoader.load(new URLRequest("carousel.xml"));
xmlLoader.addEventListener(Event.COMPLETE, LoadXML);
btnLeft.addEventListener(MouseEvent.CLICK, prevImg);
btnRight.addEventListener(MouseEvent.CLICK, nextImg);
}
function LoadXML(e:Event):void {
xmlData = new XML(e.target.data);
Parseimage(xmlData);
}
function Parseimage(imageinput:XML):void {
var imageurl:XMLList = imageinput.image.iurl;
images_num = imageurl.length();
for (var i:int = 0; i < images_num; i++) {
var urlElement:XML = imageurl[i];
imageHolder = new MovieClip();
var imageLoader = new Loader();
imageHolder.addChild(imageLoader);
imageHolder.mouseChildren = false;
imageLoader.x = - (IMAGE_WIDTH);
imageLoader.y = - (IMAGE_HEIGHT);
imageHolders.push(imageHolder);
imgurl.url = imageurl[i];
imageLoader.load(imgurl);
imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaded);
}
}
function imageLoaded(e:Event) {
//Update the number of loaded images
loadedimgs++;
//Check to see if this is the last image loaded
if (loadedimgs == images_num) {
//Set up the carousel
initializeCarousel();
}
}
function initializeCarousel() {
//Calculate the angle difference between the images (in radians)
var angleDifference:Number = Math.PI * (360 / images_num) / 180;
//Loop through the images
for (var i:uint = 0; i < imageHolders.length; i++) {
//Assign the imageHolder to a local variable
var imageHolder:MovieClip = (MovieClip)(imageHolders[i]);
//Get the angle for the image (we space the images evenly)
var startingAngle:Number = angleDifference * i -0.30;
//Position the imageHolder
imageHolder.xpos3D = radius * Math.cos(startingAngle);
imageHolder.zpos3D = radius * Math.sin(startingAngle);
imageHolder.ypos3D = floor;
//Set a "currentAngle" attribute for the imageHolder
imageHolder.currentAngle = startingAngle;
var scaleRatio = focalLength/(focalLength + imageHolder.zpos3D);
//Position the imageHolder to the stage (from 3D to 2D coordinates)
imageHolder.x = vanishingPointX + imageHolder.xpos3D * scaleRatio;
imageHolder.y = vanishingPointY + imageHolder.ypos3D * scaleRatio;
//Add the imageHolder to the stage
addChild(imageHolder);
}
sortZ();
}
function prevImg(e:MouseEvent) {
//Loop through the images
for (var i:uint = 0; i < imageHolders.length; i++) {
var imageHolder:MovieClip = (MovieClip)(imageHolders[i]);
//Set a new 3D position for the imageHolder
imageHolder.xpos3D = radius * Math.cos(imageHolder.currentAngle);
imageHolder.zpos3D = radius * Math.sin(imageHolder.currentAngle);
var scaleRatio;
//Calculate a scale ratio
scaleRatio = focalLength/(focalLength + imageHolder.zpos3D);
//Update the imageHolder's coordinates
imageHolder.x = vanishingPointX+imageHolder.xpos3D * scaleRatio;
imageHolder.y = vanishingPointY+imageHolder.ypos3D * scaleRatio;
//spinning the carousel
imageHolder.currentAngle += 0.6285;
}
//Call the function that sorts the images so they overlap each others correctly
sortZ();
}
function nextImg(e:MouseEvent) {
//Loop through the images
for (var i:uint = 0; i < imageHolders.length; i++) {
var imageHolder:MovieClip = (MovieClip)(imageHolders[i]);
//Set a new 3D position for the imageHolder
imageHolder.xpos3D = radius * Math.cos(imageHolder.currentAngle);
imageHolder.zpos3D = radius * Math.sin(imageHolder.currentAngle);
var scaleRatio;
//Update the imageHolder's coordinates
imageHolder.x = vanishingPointX+imageHolder.xpos3D * scaleRatio;
imageHolder.y = vanishingPointY+imageHolder.ypos3D * scaleRatio;
//spinning the carousel
imageHolder.currentAngle -= 0.6285;
}
sortZ();
}
//This function sorts the images so they overlap each others correctly
function sortZ():void {
imageHolders.sortOn("zpos3D", Array.NUMERIC | Array.DESCENDING);
//Set new child indexes for the images
for (var i:uint = 0; i < imageHolders.length; i++) {
setChildIndex(imageHolders[i], i);
}
}
}
}
So what this code does:
carousel.xml is imported
The xml is processed so that the image paths there are converted to displayed images
A carousel is made out of the images
The sortZ() function makes sure that the images are aligned in 3D perspective properly; just like z-index in CSS would do.
When clicking btnLeft or btnRight, the carousel rotates to the left or right (this is done by updating the value of imageHolder.currentAngle).
When I put trace's inside the prevImg() and nextImg() functions, I do see the trace that
belongs to the right function, and not the previously clicked one. So it seems that Flash does call the right event.
So how do I get rid of this bug?
Help and tips are greatly appreciated!
Move imageHolder.currentAngle assignment (the line where you change it) BEFORE the code that alters imageHolder's 3D position.
for (var i:uint = 0; i < imageHolders.length; i++) {
var imageHolder:MovieClip = (MovieClip)(imageHolders[i]);
//Set a new 3D position for the imageHolder
imageHolder.currentAngle += 0.6285; // <== HERE
imageHolder.xpos3D = radius * Math.cos(imageHolder.currentAngle);
imageHolder.zpos3D = radius * Math.sin(imageHolder.currentAngle);
var scaleRatio;
//Calculate a scale ratio
scaleRatio = focalLength/(focalLength + imageHolder.zpos3D);
//Update the imageHolder's coordinates
imageHolder.x = vanishingPointX+imageHolder.xpos3D * scaleRatio;
imageHolder.y = vanishingPointY+imageHolder.ypos3D * scaleRatio;
//spinning the carousel
}
The same for the other function.

AIR - Add Images From Drag&Drop To Stage

I'm building a Tile Viewer in Adobe AIR and so far I have implemented the Drag and Drop function that allows the user to load PNG and JPG files.
The function returns a ':File' format, but how can i gram the ':Bitmap' data and place the image in an existing movieclip while looping and make that one tile image repeat in x and y so a preview of a tilemap will shown ?
my thought was to simply add instances of that one file, but i dont know the exact code for that.
( create a Loader, pass the File format to that, and get the BitmapData and place it in place by defining position x and y and also defining width and height. also i want to make instances, to the code doesnt load the image 10 x 10 times )
i would be glad for all helpfull answers.
Edit:
example theory:
( without correct syntax )
image = new ImageFromDropBox(); // bitmap or whatever
for( x = 0; x < 10; x++) {
for( y = 0; y < 10; y++) {
image.x = tilesize * x;
image.y = tileSize * y;
image.width = tileSize;
image.height = tileSize;
stage.addChild( image ); // so each of the 100 places images should be just instances of the ONE LOADED IMAGE
}
}
When working with the File class, you can use the fileInstance.url parameter to load said file in a loader:
var loader:Loader = new Loader();
var urlReq:URLRequest = new URLRequest(file.url);
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaded);
loader.load(urlReq);
function loaded(e:Event):void {
var bmp:Bitmap = loader.content as Bitmap
//scale it down and create a scaled down bitmap data for more efficient memory usage
bmp.width = tileSize;
bmp.height = tileSize;
var bData:BitmapData = new BitmapData(tileSize,tileSize); //your new bitmap data
bData.draw(bmp); //capture the scaled down version of the bitmap
//if you don't need the original anymore, dispose of it
bmp.bitmapData.dispose();
var image:Bitmap;
for( var x:int = 0; x < 10; x++) {
for( var y:int = 0; y < 10; y++) {
image = new Bitmap(bmp.bData);
image.x = tilesize * x;
image.y = tileSize * y;
image.width = tileSize;
image.height = tileSize;
stage.addChild( image );
}
}
}

Single Loader to multiple Sprite Possible?

I've looked in various resources regarding this topic, and it seems to me that I need a Loader for every Sprite which contains an image file (png).
I'm trying to make a Tile Rendering System, and have created a grid of X by Y sprites, but all of them actually reference the same image file.
Is there any other way to do this? (Make the sprite share the same png data file)
Some sample code of what I have done.
// Create an array of X * Y Loaders
var cTileLoaders:Array = new Array( 100 ); // for example 10 by 10 grid
var cTiles:Array = new Array( 100 );
var nIndex:int = 0;
var nImgLoadCount:int = 0;
for ( ; 100 > nIndex; ++nIndex ) {
cTileLoaders[ nIndex ] = new Loader();
cTiles[ nIndex ] = new Sprite();
// perform more sprite initialization
....
cTileLoaders[ nIndex ].contentLoaderInfo.addEventListener( Event.COMPLETE, ImageLoaded
cTileLoaders[ nIndex ].Load( new URLRequest( "some image path" ) );
}
// handler for image loaded
function ImageLoaded( eEvent:Event ):void {
++nImgLoadCount;
// when all 100 sprite data are loaded
// assuming there is no i/o error
if ( 100 == nImgLoadCount ) {
cTiles[ nIndex ].addChild( cTileLoaders[ nIndex ].content );
}
}
I think the answer in your case is to utilise the Bitmap data contained within the image you're loading like this:
var tilesWide:uint = 10;
var tilesHigh:uint = 10;
var tileHolder:Sprite = new Sprite();
this.addChild(tileHolder);
var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onImgLoaded);
loader.load(new URLRequest("tile.png"));
function onImgLoaded(e:Event):void
{
/* Create a template bitmap to hold the image info */
var templateBitmap:Bitmap = e.target.content;
var templateBitmapData:BitmapData = templateBitmap.bitmapData;
/* Loop through your tiles */
for (var a:uint = 0; a < tilesWide; a++)
{
for (var b:uint = 0; b < tilesHigh; b++)
{
var tile:Sprite = new Sprite();
/* Attach the template BitmapData to each tile */
var tileBitmap:Bitmap = new Bitmap(templateBitmapData);
tile.addChild(tileBitmap);
tile.x = a * tile.width;
tile.y = b * tile.height;
tileHolder.addChild(tile);
}
}
}
You could also use SpriteFactory, a little library I wrote specifically for this:
var tilesWide:uint = 10;
var tilesHigh:uint = 10;
var tileHolder:Sprite = new Sprite();
var tilePath:String = "some/image/path.png";
var factory:SpriteFactory = new SpriteFactory();
factory.loadBitmap("tile", tilePath);
for (var a:uint = 0; a < tilesWide; a++)
{
for (var b:uint = 0; b < tilesHigh; b++)
{
var tile:Sprite = factory.newSprite("tile");
tile.x = a * tile.width;
tile.y = b * tile.height;
tileHolder.addChild(tile);
}
}
The advantage here being that you can use the sprites right away, and they'll automatically be filled with the bitmap once it's loaded.