XML is not Scripting...

One of the very common questions I see from people, involves writing scripts in xml.

First and foremost XML is not scripting. It is not LUA like WoW uses, think of XML as the blueprints for a house, in this case the UI.

Going with the house analogy here lets picture the we are looking at just one side of the house (front) and tring to draw it out on a piece of paper.

we need to define the object, in this case "House" the object will need a name as well lets say "Grimmier's House". this will give us the overall framework to work inside.

NOTE: This is just a mock up of how XML works for layout. We will get to the Real Syntax Later in this Tutorial.

Code:

  <House name="Grimmier's House">
  </House>

anything between the first <House> and </House> will belong to the object house.

Now say we want the house to take up 300 pixels wide and 200 pixels high on our paper. We need to set dimensions. But we also want the house to appear closer to the middle of the paper, say the paper is 1280 x 1024 pixels in size.

Code:

  <location x="540" y="300"/>
  <Size width="300" height="200"/>

that would be like saying we wanted to start with the top left corner of the house at point 540,300 on the grid, and drawing a rectangle thats 300x200 in size.

Now if we wanted to draw in doors and windows, we would need to add those inside as well. Something like this:

Code:

  <Window name="window 1">
    <location x="50" y="120"/>
    <Size width="30" height="50"/>
  </Window>
  <Window name="window 2">
    <location x="150" y="120"/>
    <Size width="30" height="50"/>
  </Window>
  <Door name="Front Door">
    <location x="100" y="80"/>
    <Size width="30" height="120"/>
  </Door>

Notice how each item has a closing tag to it. All of these items locations will be based on what object they are inside of.

So if I put them inside the tags for House, it will place these items based on their x y coordinates inside the dimensions of the House element.

Code:

  <House name="Grimmier's House">
     <location x="540" y="300"/>
     <Size width="300" height="200"/>
     <Window name="window 1">
         <location x="50" y="120"/>
         <Size width="30" height="50"/>
     </Window>
     <Window name="window 2">
         <location x="150" y="120"/>
         <Size width="30" height="50"/>
     </Window>
     <Door name="Front Door">
         <location x="100" y="80"/>
         <Size width="30" height="120"/>
     </Door>
  </House>

As you can see, all XML is really, is a means of laying out the items where you want them using coordinates. These items can be images, status bars, drop downs, text, etc. but we are only able to use that which is supplied to us.

You will not be able to do math computations in XML. It does not work that way.

Next ... Creating the Window