views:

60

answers:

4

So, I'm writing an AS3 program that tiles floor tiles. I want the user to be to be able to create their own floor schematic represented by different rectangles. It'll be drag-and-drop. They will lay out their schematic (which is composed of different size rectangular tiles) and drop colors/patterns onto them.

This schematic will then be tiled on a 3D plane to represent what the actual floor would look like.

I've got the 3D part working, drag-and-drop working, etc. What I'm missing is the floor schematic stuff. I've spent a lot of time trying to figure out the best solution, but I can't QUITE get there.

Here are some examples (out of a WHOLE bunch of possible combinations) of how the floor schematics could look:

alt text

alt text

alt text

alt text

The different tiles within the schematic are the droppable regions. My problem: How can represent these schematics in XML? Don't worry about tiling, sizing, etc. I've got that all figured out already. I just literally do not know how I can represent a tile schematic in XML and draw it correctly with AS3. Any ideas?

A: 

For the sake of simplicity, you might want to consider using the x, y, width, height values. That is the format that flash.geom.Rectangle and flash.display.Graphics.drawRect() use.

<tile x="20" y="20" width="400" height="200" pattern="1" />
<tile x="20" y="220" width="100" height="100" pattern="2" />
washwithcare
A: 

Disclaimer: I am not the best person at writing XML. For instance, <Cell x="0" y="1" tile="no"/> can be a pain, for it makes xsd schema more complicated - which is: if tile = no, it should not have children. If tile = yes, then it must have children. Also note that you need to rework <RgbColor>LightGrey</RgbColor>. Also note that I do not know what is the best trade-off between elements and attributes. Also note that I do not like having <Cells> as well as <Cell> - typo opportunity. However, I do not know a better way, but would like to find out what that might be. Also, perhaps this format is too verbose. Also, I did not include an xsd schema, but you can get started with it here: http://www.google.com/search?hl=en&amp;q=xsd+schema+generator&amp;aq=f&amp;aqi=&amp;aql=&amp;oq=&amp;gs_rfai=

Also inspired by another answer, you might want to define pattern colors separately and then refer to them ... can be error-prone.

<?xml version="1.0" encoding="utf-8"?>
<TileSchematics name="Blah" comment="This starts to describe second one.">
  <BoundingBox>
    <Width>8</Width>
    <Height>3</Height>
    <StackHorizontally>yes</StackHorizontally>
    <StackVertically>no</StackVertically>
  </BoundingBox>
  <Cells>
    <Cell x="0" y="0" tile="yes">
      <RgbColor>LightGrey</RgbColor>
      <Border>
        <Right>yes</Right>
        <Left>yes</Left>
        <Top>yes</Top>
        <Bottom>yes</Bottom>
      </Border>
    </Cell>
    ...
    <Cell x="0" y="1" tile="no"/>
    ...
  </Cells>
</TileSchematics>
Hamish Grubijan
I like this solution too, but it does seem a little too verbose. You did solve the border issue though. Couldn't really wrap my head around that. Wish I could accept both of these for different reasons! :)
lewiguez
+3  A: 

It looks to me like your tiles really boil down to layouts on a grid. Given that, I would have the xml for the tile be comprised of a list of elements, each element would have properties for the row/column of the upper left square of the element, the row span and column span for that element, and the fill for that element. Something like this:

<Tile>
    <Cell row="0" col="0" rowSpan="1" colSpan="4" fill="#a0a0a0"/>
    <Cell row="1" col="0" rowSpan="1" colSpan="4" fill="#b0b0b0"/>
    <Cell row="0" col="4" rowSpan="2" colSpan="2" fill="#c0c0c0"/>
    <Cell row="2" col="2" rowSpan="1" colSpan="4" fill="#a0a0a0"/>
    <Cell row="3" col="2" rowSpan="1" colSpan="4" fill="#b0b0b0"/>
    <Cell row="2" col="0" rowSpan="2" colSpan="2" fill="#c0c0c0"/>
</Tile> 

The above would represent your first example (I made up the colors though). Hope that helps.

Wade Mueller
I like this answer better than mine - preserves information about blocks, which can be helpful for editing. I was obsessed with borders for some reason. Anyhow, I will keep my answer as is; I do not think that it is terrible, just not great. However, DO USE XML header: `<?xml version="1.0" encoding="utf-8"?>` and look into generating an XML schema from a file just in case - those are two things I would add to the answer.
Hamish Grubijan
That's exactly how I would do it. Then in your app just have a static fromXML() method on your Tile object which returns a new tile based on those parameters. The only other thing I might add that might be useful in the XML above is "totalRows" and "totalCols" attributes on the <Tile> node itself, just so you can get a rough idea of the size without having to parse it all out.
Myk
I think this is a nice, simple solution. I never thought about implementing it similar to a standard HTML table. I like the simplicity here.I would make the fill be rgba though. That way for the empty cells I could specify them as transparent.Thanks! :)
lewiguez
A: 

why XML? why not just serialize it using AMF3? or if you need something human readable, JSON should do it. JSON has exactly the same object semantics as ECMA-script, being a subset of ECMA-script, while XML doesn't, which makes working with XML quite annoying.

representation of the first schematic as object structure:

[
    {"x":0, "y":0, "width":100, "height":25, "pattern":0 },
    {"x":0, "y":25, "width":100, "height":25, "pattern":1 },
    {"x":100, "y":0, "width": 50, "height":50, "pattern":2 },
    {"x":50, "y":50, "width":100, "height":25, "pattern":0 },
    {"x":50, "y":75, "width":100, "height":25, "pattern":1 },   
    {"x":0, "y":50, "width": 50, "height":50, "pattern":2 }
]
//this is both valid JSON and ActionScript, although in ActionScript, you would
//typically use identifiers instead of strings for property names

You can use the as3corelib for serialization.

greetz
back2dos

back2dos
XML was asked for, so give him XML.
Matt W
@Matt W: "Serializing as XML seemed like the best bet for Flash to me because it's web-based". With that being the reason for choosing XML, I feel obliged to point out alternatives.
back2dos
I didn't know that you could serialize JSON with Actionscript. I'll consider adding that to future projects, but for this project, I've already done A LOT of work with XML. It's pretty much a requirement without a lot of refactoring. Great idea for the future though!
lewiguez