XNA Code Generator for Tile Studio 2.55

Playing with XNA yesterday made me wonder how easy it would be to build a Tile based game, such as a 2D ‘walk around’ adventure game (ie; Zelda, or the likes). I downloaded a copy of Tile Studio 2.55 not too long ago and have been staring at it’s icon on my desktop for quite some time now.

It came ‘out of the box’ with a handful of nice code generators, and it even included a .NET code generator … but it only supported the BooGame library, and generated Boo code.

So, I thought to myself, why not look for an XNA Exporter … so I loaded up the Tile Studio website, and found nothing there. I googled briefly and found nothing as well. So, I started on a little code adventure and decided to build my own. Now, keep in mind, I’m by no means an XNA Expert so my method for creating the tile map in C# may or may not be ‘the best’ or even ‘proper’. However, the map works … and I’m happy. I started on the project around 10:20am and am now writing this post at 11:50am … so, it wasn’t “too hard” and didn’t take too much time. The time spent also included learning the Tile Studio Definition language and how it worked as well.

So, onto some ‘proof’, here’s a few screenshots:

Tile Studio Map

This is Tile Studio, with my little map loaded up
–the Map is 100×100, and the Tiles are 20×20.

Visual Studio Project Files

Here is my Visual Studio project, after performing a code generation
in Tile Studio and refreshing the project directory and including the files.

XNA Game with Tile Studio Generated Map

And, here is my Map rendering to an XNA Game Window.

Now, in the project files shot you might notice that there are three files highlighted. The first is the exported Tile Map file from Tile Studio, the second is the actual Map definition (Tile2.cs) and the third is a helper class I wrote that is automatically exported for you that contains the MapDefinition and Tile classes.

And, here’s the best part, your not gonna believe it … or maybe you will. To load the map up, you simply do:

[csharp]//In Class scope
WatrRoad map;[/csharp]

[csharp]// in LoadContent
map = new WatrRoad(Content.Load<Texture2D>(“WatrRoad”));[/csharp]

[csharp]// in Draw

And that’s it … the MapDefinition provides a ‘Draw’ method to loop through all the tiles and render them to the screen. I’ve not yet optimized this to store a cached copy, but I also haven’t tested it with any real ‘logic’ yet to try building a game. You can download a copy of the XNA C# Tile Studio Definition file from here, expect updates in the future to support more of Tile Studio’s feature set.

Download the Definition File Here

Download the Full Example Project Here

Currently Supported Features:

  • Export Tile Sets to BMP and place in ‘Content’ sub-directory
  • Export CS File containing all Maps
  • Export TileStudioMap.cs containing MapDefinition and Tile helper classes
  • Easy Map instantiation, just pass a reference to the Map’s Texture2D containing the Tiles
  • Easy Map Rendering, just call the Map’s “Draw” method and pass the SpriteBatch

4 comments for “XNA Code Generator for Tile Studio 2.55

  1. May 10, 2008 at 7:37 am

    Hello guy, i’m trying this content importer that you made and….it worked with little maps…
    with a greater map it just appear a runtime error “Texture width or height is larger than the device supports.
    Parameter name: height”
    What it could be.
    Thanks for the attention and greeting for the tool….I think it’ll be the best out there!

  2. May 10, 2008 at 7:50 am

    Hello i’ve found the error..
    the .bmp file size is 16x 16100..
    is there any way to modify the code to generate textures in popular sizes…like 1024x…..

  3. May 10, 2008 at 2:42 pm

    Diego, I can look into making a modification to change the exported image size so it does not export a ridiculously wide image.

    Please do keep in mind, I am new to Tile Studio and XNA … and this was an experimental thing for me … so it’s all “trial and error”.

    — David

  4. May 10, 2008 at 3:07 pm

    Diego, you can try making one quick change to your TSD — I don’t have any tile sets that would generate such large maps, so I’ll need you to test this for me …

    Where you see this:
    #tilebitmap Content\\.png

    Add the value ‘1024’ after the filename, with a space — change ‘1024’ to something like ‘2048’ if your map is still too ‘tall’ — This should restrict the maximum width of your generated image file and hopefully resolve your problem.

    Please report your success or failure, thank you.

    — David

Leave a Reply