Project very similar to a tile base game

[costa]

Dear all,

I have been working in a project very similar to a tile base game. I am loading my mc from library and put them in a container. I am refreshing the content of the main screen (512x416) each time the main container has been moved 32 pixels. I got mc with different size, from 16x16 (maybe smaller) to 296x64, and their size is not bigger than 2K. In the worst scenery I got around 200 mc in my container.

However I have not could get more than 28 frames per second. The average is 20, and in an old PC I got 9.

I am about to find another method, something like to have a big image to scroll or use BitmapData Class. I have found many discussions about this topic but each one has his/her own interpretation and preferences.

I would like to ask you if that rate is normal in this kind of project. And if the method I am using is a good one or it is time to find another one.

Thanks in advance

Note: I am using AS3

[rahul_7star]

how to make component

[Charleh]

It would make sense that with over 200 mc you could experience slowdown depending on the PC you are using and the complexity of your tiles and objects

try using movieClip.cacheAsBitmap = true; with each of your tiles to see if that gives you a performance boost...

[costa]

Charleh,

Thanks for the answer. I have tried movieClip.cacheAsBitmap = true; but the difference is not noticeable. Besides each time I set it to true the division between mc is visible, I mean there is not a perfect fit between them.

I have another question. When a remove an instance from the container (container.removeChild(target)), it is removed from memory, so the next time I add it again, flash has to load it into memory again?

Thanks

[Sirisian]

I recommend storing your tile images as a BitmapData then setting up a render function given a view rectangle. If you don't know OOP, then you might want to learn it:
Here for simplicities sake you can use my AS3 texture manager class, which can be downloaded conveniently here:
Clicky (http://www.sirisian.templarian.com/flash/TextureManagerAS3.zip)

As for the tile manager class you'd create an array of a tile class:


package {
import flash.display.*;
public class MapManager {

private var displayReference:DisplayObject;
public var renderBuffer:BitmapData;
public var tm:TextureManager;
public var map:Array = new Array();

public function MapManager(displayReference_:DisplayObject):void {
displayReference = displayReference_;
tm = new TextureManager("");//the "" means the images are in the root: use "folderName/" to access a folder under the swf
tm.Load("grass");
renderBuffer = new BitmapData(displayReference.stageWidth, displayReference.stageHeight, true, 0x00000000);
displayReference.stage.addChild(new Bitmap(renderBuffer));
for(var x:uint = 0; x < mapWidth; ++x){
map.push(new Array());
for(var y:uint = 0; y < mapWidth; ++y){
map[x].push(new Tile());
}
}
}
}
}The tile class might have an array of textures like:

public var layers:Array = new Array();
public function InsertLayer(tex_:Texture){
layers.push(tex_);
}Then you'd have a render function in the map manager similar to:

public function Render():void{
var offset:Point = new Point();
//NOTE: offsetMap would shift the whole map a direction, used for scrolling the map
var startX:uint = (Math.floor(-offsetMap.x/tileSize) < 0 ? 0 : Math.floor(-offsetMap.x/tileSize));
var endX:uint = (Math.floor((-offsetMap.x+displayReference.stageWidth)/tileSize) > mapWidth ? MapWidth : Math.floor(-offsetMap.x/tileSize));
var startY:uint = (Math.floor(-offsetMap.y/tileSize) < 0 ? 0 : Math.floor(-offsetMap.x/tileSize));
var endY:uint = (Math.floor((-offsetMap.y+displayReference.stageHeight)/tileSize) > mapHeight ? MapHeight : Math.floor(-offsetMap.y/tileSize));
if(startX < mapWidth && endX > 0 && startY < mapHeight && endY > 0){
for(var x:uint = startX; x < endX; ++x){
for(var y:uint = startY; y < endY; ++y){
offset.x = x*tileSize+offsetMap.x;
offset.y = y*tileSize+offsetMap.y;
map[x][y].Render(renderBuffer, offset);
}
}
}
}
in the tile class the Render function might look like:

public var renderMatrix:Matrix = new Matrix(1,0,0,1,0,0);
public function Render(renderBuffer:BitmapData, offset:Point):void{
renderMatrix.tx = offset.x;
renderMatrix.ty = offset.y;
for(var layerItr:uint = 0; layerItr < layers.length; ++layerItr){
if(layers[layerItr].loaded){
renderBuffer.draw(layers[layerItr].bitmap, renderMatrix);
}
}
}just a hint if you do use my texture manager class it's set to png format in the textureManager class. Another thing to note in order for the images to load, on enter frame you have to put: tm.LoadQueue(); which will load FIFO all of the images one after another.

Note: I coded this in the browser and never tested it so have fun! :sigh:

[costa]

Thanks Sirisian. You gave me a lot material to study. It seems BitmapData is getting popular. I will explore this technique even when I spent 2 months playing with MC.

Thanks again

[Sirisian]

Movie clips are for sites, not games. My best advice is to never touch them. If you've ever programmed in C++ with OpenGL or DirectX then you'll understand the basics of a game loop and a render loop.

[pingnak]

Another probable problem is the file associations for Release vs Debug Flash interpreters. I ended up making a folder with release and debug SAFlashPlayer.exe shortcuts to switch. Once you've run one, it grabs all the associations and links for the swf files for its self, so I keep running the debug version when I'm trying to profile, and running the release version (which hangs FDB) when I try to debug. All the way into the browser, no less.

Another little thing is where the player's working. The release mode player by its self will generally get almost twice the frame rate as the same player embedded in Firefox, and about 75% in IE. Probably still some Microsoft hacks to cripple competition out there. The debug player is less than half-speed from release, and slower yet in the browser. Even slower with the debugger attached.

Anyway, the Flex SDK only comes with the debug player. The RELEASE mode player can be had by simply downloading the Flex Builder or Flash trial, then groping around in the Program Files folder for it. Copy it out. In Flash, it's C:\Program Files\Adobe\Adobe Flash CS3\Players. If this will stay installed, you can make some shortcuts to it.