HaxeFlixel Tutorial – Parsing CSV Map Data

In the previous post we loaded CSV data to display a tiled map in HaxeFlixel. But I forgot to talk about what to do after loading the data, so let’s run through a quick tutorial on how to parse the loaded map data.

Let’s assume you’ve created a template HaxeFlixel project, and this is how your MenuState.hx looks like:

If you test the game with lime test neko  now, you should get this:


A lot of other tutorials would have mentioned this, but in case you didn’t know yet — To change the resolution of the screen, you just need to modify these variables in Main.hx:

… and now it should look like this:


Even though the map is loaded, it’s just a static image. There’s no player code, or wall data, or anything else. So how do we code from here? Assuming that we’re using the layout above, here’s the CSV data (generated from Tiled, and using Derek Yu’s tilesheet):

If you examine the tilesheet image, the numbers above correspond with the tile index, as noted below:


Let’s start with the player object first. We know that tile 20 is the red player tile, so how do we convert it into a game object?

You can check the FlxTilemap API for more information on the functions used above. If you test the game, it should still look the same. We replaced the player tile with an actual player object, but we can’t control the player yet. So let’s add the code into the update()  function, like this:

Great! Now if you test the game, you’ll be able to move the player and collide with the walls… but wait, you’re also colliding with the key, trap, and door. Why? Because all non-empty tiles (values other than -1) are automatically considered solid walls.

Since we already know how to replace the player tile with the player object, you can repeat the code for other objects. Let’s try to apply DRY (don’t repeat yourself) principle and modify our existing code, resulting in below:

Oops, I forgot about the door object, but you should get the rough idea by now. The code above isn’t complete, but it shows how we can parse the map objects manually, if you’re loading a single .CSV file.

There’s of course a better way to load map data, assuming you have multiple layers. Perhaps I’ll cover that in a separate tutorial next time.

In the meantime, you can check out HaxeFlixel’s official tutorial (Part 5), for a rundown on how to load OgmoEditor’s data file (which includes layers). StrandedSoft’s SHMUP tutorial (Part 2) also talks about loading TiledEditor’s TMX map data.

Leave a Reply

Your email address will not be published. Required fields are marked *