In order to write Tiled’s TMX file format I needed to do exactly this: figure out how to compress data, encode it as a string, and write it to XML.
I wrote down what I learned from using zlib, base64 and xswi - XML Stream writer for iOS (a single Objective-C class) while writing KoboldTouch‘s TMX writer.
I split it into two articles in the Essential Cocos2D section of the www.KoboldTouch.com homepage:
- How to compress and encode data with zlib and base64
- How to write XML on iOS with xswi (XML Stream Writer)
I was positively surprised how relatively painless zlib and base64 encoding worked (I expected the worst!) and how simple and effective xswi is for writing XML compared to any other XML library.
I’ll probably continue to add those articles to Essential Cocos2D rather than posting them on this blog. Confluence is just so much more convenient for writing technical documentation than WordPress.
Final word: Enjoy! 
I’m currently working on a new tilemap renderer for KoboldTouch.
I now have an early version that’s fairly complete and does most of what cocos2d’s tilemap renderer can do. Pun intended: yes, cocos2d’s tilemap renderer really doesn’t do all that much: load and display tilemaps with multiple layers.
In fact my current implementation is one step ahead already:
KoboldTouch’s tilemap renderer doesn’t require you to use -hd/-ipad/-ipadhd TMX files and the related (often hard to use or buggy/broken) TMX scaling tools. Just use the same TMX file designed for standard resolution, then simply provide just the tileset images in the various sizes with the corresponding -hd/-ipad/-ipadhd suffixes. The tilemap looks the same on a Retina device, just with more image detail.
Performance Comparison
Anyhow, I thought I’ll do some quick performance tests. I have a test map with 2 layers and a tiny tileset (3 tiles, 40×40 points). I’m comparing both in the same KoboldTouch project, using the slim MVC wrapper (named KTLegacyTilemapViewController) for cocos2d’s tilemap renderer CCTMXTiledMap. Continue reading »
iTileMaps developed by Vsevolod Klementjev is a Cocos2D app for iPad that allows you to edit tilemaps in the TMX format, the same format used by the popular Tiled Map Editor.
Although built with Cocos2D the tilemaps created with iTileMaps can be used with any game engine that supports loading the TMX format. To get ahold of the tilemaps created with iTileMaps you can export them directly to your game or send them via e-mail. Great for designing levels on the road!
Check out this fast-forward movie to see it in action:
Check out the iTileMaps website and/or get it on the iTunes App Store.
Chapter 11 - Isometric Tilemaps
After Chapter 10 introduced Tiled and working with orthogonal tilemaps it’s time to step things up a notch and delve into isometric tilemaps. It starts with basic principles of isometric tilemaps and editing before going into detail on what’s different code-wise compared to orthogonal tilemaps. Obviously this has to include how to determine which isometric tile was touched and how to move a character across an isometric tilemap.
Summary of working on Chapter 10 - Working with Tilemaps
This chapter introduces you to tilemaps, what they are and what benefits and tradeoffs they provide. Without a doubt the most popular editor for tilemaps for use with cocos2d is the Tiled Map Editor. I explain how to use it over several pages before going into code and actually loading your first tilemap using cocos2d’s CCTMXTiledMap class.
Loading a tilemap is just half the story. You’ll also learn how to manipulate the tilemap layers and individual tiles, as well as scrolling the tilemap and centering the touched tile on screen. The code takes care that the tilemap is never scrolled outside its boundaries.
While working with the Object Layer feature of Tiled (CCTMXObjectGroup in cocos2d) I noticed it’ll be handy to display the rectangles on the screen. So you’ll also learn a little custom drawing using OpenGL ES respectively cocos2d’s wrapper functions in CCDrawPrimitives.
Chapter 10 - Working with Tilemaps
This chapter dives into the depths of the CCTMXTileMap class and how to create, iterate and modify tilemaps in code, including isometric and hexagonal tilemaps. Of course there will be an introduction to the Tiled Map Editor as its the primary tool to create TMX tilemaps that cocos2d supports.
The chapter 11 will then use this newfound information and I’ll walk you through making a scrolling tilemap game, since simply loading, modifying and displaying a tilemap would just be half the story.
Summary of working on Chapter 9 - Particle Effects
This chapter was fun. Particle effects are fun indeed. That is, unless you need to tweak them in code only. I did do that an did my best to describe what each CCParticleSystem property does to a visual effect, although some things you’ll have to see for yourself. You’ll find a lot of detailed information on how to setup or simply modify a particle system in code and a couple tips for designing good particle effects.
Of course with Particle Designer everything changes. Designing a cool particle effect suddenly goes from a treadmill to a mesmerizing activity that you can waste countless hours on. If you check Particle Designer’s Online Library you’ll find four of the Particle Effects that I designed and submitted, starting with the “Colorful Burst” effect. Have a look!
Obviously these cool effects needed to go somewhere, so I added them to the Shoot ’em Up game as you can see in the screenshot (the boss just exploded into purple smudge). Along the way you learn how to load the particle effects created by Particle Designer of course.
This is worth pointing out: paulsondev (who unfortunately has no About page on his blog, hint hint ;)) posted a 90-minute (!) Tutorial about creating a scrolling Tilemap with TMX and cocos2d for iPhone! I haven’t watched it but anyone who is dedicated to make a 90 minute development video deserves attention. And as far as i can tell it’s pretty cool. Plus he uses the same desktop background as i do.
