Storing and Loading External Level Data and Information in XML

Storing and Loading External Level Data and Information in XML:

Have you ever accidentally hardcoded information into your program, to later realize it would be easier to not have to compile for small changes?

Storing information in XML allows you an easy way to change parts of your program, without needing to re-compile.

You can store entire levels, character definitions, and directions to artwork from xml.

This enables you to create a fully functioning game or application, and make it easy for yourself or other people to change the content of your program.

This tutorial just shows you how to create an xml file, put information in it, load it using actionscript, and run the program based off the content of the xml.

We will be creating a small “side scrolling” game. It is by no means complete, but should show how you can store game information in XML.

Creating your xml file

The first thing you need to do is create an xml file. If you don’t have a current FlashDevelop Project you are working in, you’ll need to create one.

Next, right click on your ‘src’ folder, and go to ‘Add->New XML File’ and name it ‘data.xml’ and click ‘OK’(you can also create a new text file in explorer, and rename it to .xml).

FlashDevelop sets up a basic xml file:

1 2 3

<data>   </data>

Your ‘root node’ has already been created, named ‘data’. You’ll notice that the syntax in xml is very simmilar to html, except that you can declare whatever tags and attributes you want. XML is just a way of organizing your data.

Now we’ll create a couple “basic levels”, and define where some of our art work is located.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72

<?xml version="1.0" encoding="utf-8" ?> <data> <levels> <level name="Red Island"> <shapes> <shape type="rectangle" x="0" y="0"> <name>space background</name> <width>800</width> <height>600</height> <color>0x000000</color> <is_ground>false</is_ground> </shape> <shape type="circle" x="0" y="0"> <name>Star Outline</name> <radius>610</radius> <color>0xffb400</color> </shape>   <shape type="circle" x="0" y="0"> <name>Star</name> <radius>600</radius> <color>0xFF0000</color> </shape> <shape type="circle" x="700" y="20"> <name>tiny star1</name> <radius>2</radius> <color>0xFFFFFF</color> </shape> <shape type="circle" x="720" y="200"> <name>tiny star1</name> <radius>2</radius> <color>0xFFFFFF</color> </shape>   <shape type="circle" x="300" y="300"> <name>Moon1</name> <radius>100</radius> <color>0x3388CC</color> </shape> <shape type="circle" x="600" y="400"> <name>Moon2</name> <radius>100</radius> <color>0x3388CC</color> </shape>   <shape type="rectangle" x="0" y="550"> <name>ground</name> <width>800</width> <height>50</height> <color>0x006666</color> <is_ground>true</is_ground> </shape> <shape type="rectangle" x="250" y="450"> <name>floating block</name> <width>50</width> <height>50</height> <color>0x006666</color> <is_ground>true</is_ground> </shape> </shapes>   <starting_point x="100" y="300"/> </level> </levels> <entities> <entity name="bobby" type="hero"> <filename>lilguy.png</filename> <health>100</health> <speed>10</speed> </entity> </entities> </data>

Here, I just tried to decide on things from my “game” that I would want to store in xml.
I made an xml tag for “shapes” to go under, and then defined circles and rectangles, based on where I’d want to place them.

These make up an outerspace solar system — a giant red star, a few blue moons close by, and a few stars in the background. I also added two blocks to be used as interactive blocks to stand on.

I also added a “starting position” for out hero to start in our level.

I also created a tag for entities– so we can put enemies, allies, ect in here, but for now I just put the hero player, with a path/ filename to an image I created, and a tag for the health and speed of the character.
To load images externally, they must be in your ‘bin’ folder(or sub-folder) for loading using the ‘Loader’ class, or in your ‘bin’ folder if using an embed tag.

You’ll notice that for some tags I either created a sub tag, or an attribute. It’s really up to your discretion — I could have put filename and speed as attributes on the entity tag, like I did with the name, or I could have made the name attribute a sub-tag/ node.
The only difference is just how you refer to them in your actionscript, as you’ll see in the next part.

Creating Actionscript for loading

Now we need to setup our actionscript to load in the xml, load in any images defined in the xml, and create and setup the level[...]