Problem with TexturePacker and Tiled Map Editor

[gaelbeltran]

I, I'm trying to make maps for my new phaser game but I'm having some problems.

 

I'm using Texture Packer to pack my game assets, and then loading the exported image to Tiled to make maps. The problem is that my sprites aren't multiples of the same size like I always do, like 32x32, 32x64, 128X64, etc. They are like: 20x52, 40x130, 62x46, etc. And I can't make make the right selections within Tiled.

 

Has any of you faced this problem? Is there a "non tiled, generic" map editor compatible with phaser?

Or is there a thing I can change within Tiled to make this work?

[rich]

Tiled works on each tile (per layer, and overall for the map) using the same dimensions. It doesn't matter what those are: 20x52, 8x8, etc - but every tile has to use the same size.

 

There's nothing you can change in Tiled to 'fix' this, it's just how tile maps work I'm afraid.

[valueerror]

there is still GIMP  i use it a lot to resize my assets so they are all multiple of 32 for example...

[gaelbeltran]

That's what I was thinking.

 

@rich Have you faced a problem similar to this with your games? having to build levels with graphics that aren't "tiles"? What do usually do? I've always used the same tile sizes, so this is new to me.

 

 

Yes, I use inkscape to modify my graphics, valueerror

[drhayes]

I'm a complete Tiled newbie, but I have a few irregularly shaped tiles for landscape features (checkpoint altars, trees, etc). Those landscape features end up being Sprites.

 

In Tiled, I have a tileset for each one of these features that is made up of a single image. So, e.g., I have a "checkpoints" tileset that uses "checkpoint-off001.png" which is a single frame of the checkpoint animation spritesheet that I haven't put into Texture Packer. Then I have a checkpoints layer that contains a bunch of checkpoint tiles and, in Phaser, I do this:

if (this.checkpoints) {  this.checkpoints.destroy();}this.checkpoints = this.game.add.group();this.checkpoints.enableBody = true;map.createFromObjects(  'checkpoints', 21, 'checkpoint', 0, true, false, this.checkpoints, Checkpoint, false);

21 is the "gid" of the checkpoint tile. You can find out what gid you need in the JSON exported from Tiled.

 

It's working for me so far.

[rich]

That's what I was thinking.

 

@rich Have you faced a problem similar to this with your games? having to build levels with graphics that aren't "tiles"? What do usually do? I've always used the same tile sizes, so this is new to me.

 

Sure, lots of games don't benefit from a tilemap style layout. To be honest I mostly still use Flash. I position all my images with that and have a JSFL script that exports coordinates into a Phaser class for me. Allows me to iterate quickly, although I'd love to write a proper browser app to do this instead of needing Flash. But free time isn't something I'm blessed with.

[gaelbeltran]

It would be nice to see that script. Thanks for your help!

[Pooya72]

its probably too late for you but as i had same problem i share solutions for everyone who has the same problem 

there is a not very great solution for this problem but any way it works:
make your tiles size an small number which is multiple of all sizes in your game in worst case your tiles size in tiled would be 1*1 

then you can select pixels which create your desired sprite and use them.

or create spaces around tiles which are sized ( less_than_max_width*less_than_max_height ) like this sprite-sheet 



 

to do so you can download transparence png square, resize it to match your desired width and height and then merge your texture and transparence png file
just remember texture packing applications remove extra transparence parts by default, so you need to disable this feature.

 

(tex crop alpha is false and padding is 0 in shoeBox).