NoshBar's Dumping Ground




Summary: this week I used Tiled to create a map for a parallax game level in Cocos2D, processing it with a custom written tool to calculate the Box2D collision area for the map automatically.




  • Tiled is a nice and portable tile map editor
  • There is a plugin here to export the level data to a TGA file that Cocos2D expects.
  • The plugin expects 3 layers, "tile", "bkgr" and "code"
  • I use the tile layer to store graphical tiles
  • Any tile in the code level is used to signify the tile it covers is collidable
  • The plugin exports "tile" data to the Red channel
  • The plugin exports "code" data to the Blue channel
  • Cocos2D only uses the Red channel
  • I wrote a poorly coded tool to calculate
    1) from left to right, the first tile in each column that is collidable, and stores that row value as the first Green value in the row
    2) the first collidable pixel on the left in the selected tile, which is stored in the second Green value in the row
    3) the first collidable pixel on the right in the selected tile, which is stored in the third Green value in the row
  • In the app, a static edge object is created from vertices calculated from TileYOffset + TileYOffet information
    (or at least it would add static edges, if they weren't acting funky... so instead, I create a 4 sided poly object per column for now)
  • For kicks, I added some parallax layers, the sky as the background, the level as the focal point, and the sea as the forefront layer.

Get the source here.

( 187 views ) permalink print article