Social Game Flash Engine Tutorial, Part 2: Adding in a special IsoItem

Hi,

This is the next part in the tutorial to build your own Social Flash Game MMO based on the Free Social Game Flash Engine…
You can read part 1 here…

Part 2…
The first thing to understand when working with an Iso World is how to generate an isometric grid. This will become very useful when it comes to developing items or flooring for the game.

As can be seen, Fig 1.1 is a 2D grid that we start off with. The first thing we need to do is rotate this grid by 45 degrees, then squish it in half in to what is shown by Fig 1.3. This will give us an isometric grid to work with.

The default size of tile we will be working with is 86.2×43.1 pixels, as specified in the IsoMap.as file. This can be obtained by taking a 50×50 pixel square, rotating it the 45 degrees and reducing the height by half.

In order to best develop a standard that we will work with in the Iso World, we will be placing the 86.2×43.1 pixel tile at the (0,0) point in a flash file. For larger IsoItem’s, these must be extended downward in the appropriate direction as illustrated here:

It is really important that these dimensions and positioning are followed in order for them to be displayed correctly when loaded into the game, and for the sorting to work as expected. We have now extended both the xlen and ylen to be of value 2, and have a 2×2 IsoItem basis to work with:

We can make this loose guide into anything we choose, for example this overly sized statue might fit perfectly into a 2×2 IsoItem tile slot:

Now all that’s needed is to delete our tile grid and we have a 2×2 IsoItem ready to be inserted into an Iso World.

In VetRanch, all items are loaded into the game when the Iso World is generated at run time, so we need to save this as a seperate .swf called our_statue.swf.

The next step is to upload this information to our .xml file, so that the game knows where to find the information on the new IsoItem we have just created. Every item in the game must have a unique identifier, and should appear in the itemlist.xml file. Opening the .xml file you will see lots of items listed, it should look something like this:

<items>
<item uid="1" type="item" loc="isoitems/1.swf" frameno="1" xlen="1" ylen="1">This is item #1</item>
<item uid="2" type="item" loc="isoitems/1.swf" frameno="2" xlen="1" ylen="1">This is item #2</item>
<item uid="3" type="item" loc="isoitems/1.swf" frameno="3" xlen="1" ylen="1">This is item #3</item>

</items>

The attributes of a single “item” is given by the uid (the unique identifier), loc (location of the item), frameno (the frame number that the item is on) and the xlen/ylen, these are the two values we’ve talked about. For our statue they will both take the value 2. Finally, this is followed by the items description.

Next, by taking the next unique identifier (we’ll take the number 4 for this example, assuming there are only 3 other items in the list) we might have something that looks like this:

<item uid=”4″ type=”item” loc=”our_statue.swf” frameno=”1″ xlen=”2″ ylen=”2″>Our statue!</item>

Now that the game knows our item exists, where to find the image of it and the size of tiles it will take up on the map, we will need to place this item in the store so that it can be purchased and placed in the game.