Author Topic: Pixel-perfect Tilemmap collisions  (Read 1466 times)

NateTheGreatt

  • Member
  • **
  • Posts: 83
  • Karma: +0/-0
  • smell the sound
    • View Profile
    • n8bit
Pixel-perfect Tilemmap collisions
« on: Mon, Jul 12, 2010 »
I'm trying to implement a pixel perfect collision system between the player and tilemap of my game. I'm using the FlxHitTest class from the forums, but that only works with FlxSprites.

Any suggestions on how I could go about doing this?
"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away."
-Antoine de Saint-Exupery

xraven13

  • Active Member
  • ***
  • Posts: 213
  • Karma: +0/-0
    • View Profile
    • GemaNeko
Re: Pixel-perfect Tilemmap collisions
« Reply #1 on: Mon, Jul 12, 2010 »
I had same problem so what i did is that i made picture from tilemap, saved it to hard disk and then used it after as single FlxSprite =)...
Problem is that image will be probably big and FlxHitTest will not work good.
So instead of using FlxHitTest, use overlapsPP function ( look in same thread where you found FlxHitTest )...

And here are methods for making picture from tilemap, i probably use some own variables so you will need to edit it a little, but i am sure you will figure it out, i don't have much time right now to edit it myself =)...

This is my function for transforming tilemap into single image ( u will need to tweak it cause i am using my own variables and stuff i dont have time now ) :

Code: [Select]
private function tilemapToImage():void
{
var mapBData:BitmapData = new BitmapData( Global.tileMap.width, Global.tileMap.height );
           var row:int = 0;
  var column:int = 0;
for ( var i:int = 0; i < Global.tileMap.totalTiles ; i++)
{

var test:BitmapData = new BitmapData(16, 16);
test = Global.tileMap.getPictureOfTileByIndex(i);
mapBData.copyPixels(test, new Rectangle(0, 0, 16, 16), new Point( column * 16, row * 16));

column++;
if ( column > Global.tileMap.widthInTiles - 1 )
{
column = 0;
row++;
}
}

bitmap = new Bitmap(mapBData);
//addChild(bitmap);

var byteArray:ByteArray = PNGEncoder.encode(mapBData);

var fileRef:FileReference = new FileReference();
fileRef.save(byteArray, "Level" + String(Global.level) + ".png");

}

U need to add this  to tilemap class, take in note it depends how big your tiles are and do u use tile strip or something else :

Code: [Select]

public function getPictureOfTileByIndex(Index:uint):BitmapData
{
var index:uint = getTileByIndex(Index);
var bitmapData:BitmapData = new BitmapData(16, 16);
bitmapData.copyPixels(_pixels, new Rectangle( index * 16, 0, 16, 16), new Point());
return bitmapData;
}


      

NateTheGreatt

  • Member
  • **
  • Posts: 83
  • Karma: +0/-0
  • smell the sound
    • View Profile
    • n8bit
Re: Pixel-perfect Tilemmap collisions
« Reply #2 on: Mon, Jul 12, 2010 »
That looks like a good solution, but I have one problem:

Using this, how can I add, say, cloud platforms to my game? Or other elements of the map that require interactivity by other objects of the game?
« Last Edit: Mon, Jul 12, 2010 by NateTheGreatt »
"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away."
-Antoine de Saint-Exupery

xraven13

  • Active Member
  • ***
  • Posts: 213
  • Karma: +0/-0
    • View Profile
    • GemaNeko
Re: Pixel-perfect Tilemmap collisions
« Reply #3 on: Tue, Jul 13, 2010 »
Just make that other objects are not part of the tilemap....

NateTheGreatt

  • Member
  • **
  • Posts: 83
  • Karma: +0/-0
  • smell the sound
    • View Profile
    • n8bit
Re: Pixel-perfect Tilemmap collisions
« Reply #4 on: Tue, Jul 13, 2010 »
Just make that other objects are not part of the tilemap....

Yeah, sorry, I confused myself before on how I want the game to work.

This is perfect, thanks
"A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away."
-Antoine de Saint-Exupery