AS3.0中的区块设计

这篇文章主要是讲解如何基于AS3来制作一个区块游戏，但仍然保持OOP的结构。
这篇文章的代码能够被诸如FlexBuilder，FlashDevilop这里的编译器解释，当然Flash IDE也可以，但是要在主场景上指明main类。
该应用程序需要一个XML文件存储地图数据，它将会被转换为实际地图显示在屏幕上。这里面是没有什么交互的，不过是区块的放置位置和管理。
程序需要X类，每个来都负责不同的功能。
1、main类：管理所有的类和所创建的实例。
2、XmlLoader：载入一个xml文件并保存他的数据。
3、Parser：解析xml到一个二维的数组当中。
4、Screen：接收parser所创建的数字来构造一个区块的矩阵。
5、Tile：单个区块，保存类型x位置和y位置。
在最后我将会给出main文件：
第一个类：XmlLoader：

package tools {   import flash.events.EventDispatcher;   import flash.net.URLRequest;   import flash.net.URLLoader;   import flash.events.Event;      public class XmlLoader extends EventDispatcher{          private var _loader:URLLoader;          private var _xml:XML;          public function XmlLoader(path:String){       _loader = new URLLoader();       try{         _loader.load(new URLRequest(path));       }catch(e:Error){         trace("error in loading the XML file")       }       _loader.addEventListener(Event.COMPLETE,onLoadXml);     }          private function onLoadXml(event:Event):void{       //trace("xml loaded")       _xml = XML(URLLoader(event.target).data)       dispatchEvent(new Event(Event.COMPLETE));     }            public function get xml():XML{       return _xml;     }   } }

这个类接收XML文件的路径，尝试载入它。xml被载入以后，类将会dispatch一个事件，以便创建XmlLoader实例的类能够知道载入已经完成了，我们可以继续了。（这是一个非即时的操作，所有我们需要一个事件机制）。
请注意：有一个事件监听来监听载入的操作，还有一个事件的派遣-main 来接收该事件。第一个市内置的，第二个是同其他的类来连接。载入了xml数据以后，XmlLoader 的实例会保存该数据然后通过其他的类中的一个指定的getter函数来获得它。另一个应该注意到的是try & catch
来处理一些特定的错误事件，这样可以防止一个错误信息在运行中发送给用户。

第二个类：parser
解析的工作是非常的简单的，-获得一个xml对象，然后分割成行，每一行对应一个数字。在完成了划分以后，这个类的一个实例会保存数组中的行以便其他的类能够读取它。这也是由一个getter函数来完成的。_rows数组是一个二维数组。根据xml文件，其中的每一个单元都被描述成一行，每行都有若干的数字。
接收xml文件的类的结构如下所示：

package tools {   public class Parser{          private var _xml:XML;     private var _rows:Array;               public function Parser(xml:XML){       _xml = xml;       _rows = new Array();       getRows();     }          private function getRows():void{       // get all rows       var rows:XMLList = _xml.screen.children();       var singleRow:Array;       var rowString:String = rows[i];       for(var i:uint=0;i<rows.length();i++){         rowString= rows[i];         // split numbers in string to cells in singleRow array         singleRow = rowString.split("");         //save singleRow in _rows array;                 _rows.push(singleRow);       }       }          //return an arra of all rows (every row is an array of numbers     public function get rows():Array{       return _rows;     }        } }

为了能让该工作完成，xml文件的结构应该是这样的：

<?xml version='1.0' encoding='UTF8'?> <data>   <screen id="" title="">     <row>111111111111111111111111111111</row>     <row>100000000000000000000000000001</row>     <row>101000000000000000003300000001</row>     <row>101000000000000000000000000001</row>     <row>101111110000001111000000000001</row>     <row>100000000000004400000000000001</row>     <row>100000000000000000000111510001</row>     <row>100000000000000000000000000001</row>     <row>111111111111111111111111111111</row>   </screen> </data>

如果你是其他的结构需要改变一下parser。
Parser和XmlLoader都在一个名为tools的包中。
第三个类：一个视觉上的Screen：

Screen类的实例接收到数组中的数据（Parser类中所解析成的样子）然后根据数组构建一个区块的矩阵。它需要一个两层的for循环。第一层循环遍历所有的行。内部的循环来遍历行里面的所有的数字。内部的for循环每执行一次都创建一个区块，然后将他放到一个数组中（这样做可以让我们以后访问到所有的区块）。
这个类和Tile类都在一个名为"visual"的包中：

package visual {   import visual.Tile;   import flash.display.Sprite;      public class Screen extends Sprite{          private var _screenArray:Array;     private var _tiles:Array;          public function Screen(screenArray:Array){       _screenArray = screenArray;       _tiles = new Array();       var tile:Tile;       var row:Array;              // create matrix       for(var i:uint=0;i<_screenArray.length;i++){         row = _screenArray[i] as Array;         for(var j:uint=0;j<row.length;j++){           // create a new tile and push it to _tiles           tile = new Tile(Number(row[j]),j,i)           addChild(tile)           _tiles.push(tile);         }         }         }          //let other classes get the tiles array.     public function get allTiles():Array{       return _tiles;     }   } }

第四个类：Tile：

最后的visual类是Tile类，它提供单个的区块，具有3个属性：
Type：（代码在XML来描述这一区块）
locationX-描述他在矩阵中的水平位置-数字的位置而不是像素的。
locationY-描述他在矩阵中的垂直的位置。
三个属性都是getter函数。外部的对象可以"ask"每一个区块的属性。我决定使用颜色来区分区块类型的不同。
以下是Tile类的代码：

package visual{   import flash.display.Sprite;      public class Tile extends Sprite{          private var _type:uint;     private var _locationX:uint;     private var _locationY:uint;          // colors of tiles     static private var TILE_TYPES:Array = [0xDDDDDD, 0xFF00AA, 0xCC00CC, 0xCCCC00, 0x3300FF];     private const TILE_SIZE:uint = 10;            public function Tile(type:uint,locationX:uint,locationY:uint){       // get parameters       _type = type;       _locationX = locationX;       _locationY = locationY;       //draw a square       graphics.lineStyle(1,0x000000,0.2);       // different color by type parameter       graphics.beginFill(  TILE_TYPES[_type],1);       graphics.drawRect(0,0,TILE_SIZE,TILE_SIZE);       graphics.endFill();       x=TILE_SIZE*_locationX;       y=TILE_SIZE*_locationY;     }          public function get type():uint{       return _type;     }     public function get locationX():uint{       return _locationX;     }     public function get locationY():uint{       return _locationY;     }   } }

main 类：
最后，我们让所有的东西都运行起来：

package {   import flash.display.Sprite;   import tools.XmlLoader;   import flash.events.Event;   import tools.Parser;   import visual.Screen   public class TileGame extends Sprite{          private var _xmlLoader:XmlLoader;     private var _xmlData:XML;     private var _screenParser:Parser;     private var _screenArray:Array;     private var _screen:Screen;               public function TileGame(){   var url:String = "http://www.avgil.com/as3/tilegame/screen1.xml";       try{       _xmlLoader = new XmlLoader(url);       } catch(e:Error){         trace("couldn't load XML file")       }       // wait till the XmlLoader will finish loading the data       _xmlLoader.addEventListener(Event.COMPLETE,onXmlReady);           }          private function onXmlReady(event:Event):void{       //recieve the XML data from the event       _xmlData = XmlLoader(event.target).xml as XML;       //parse and build a screen from parsed data       _screenParser = new Parser(_xmlData);       _screenArray = _screenParser.rows;       _screen = new Screen(_screenArray);       _screen.x = 50;       _screen.y = 50;       addChild(_screen);     }   } }

需要注意的是在创建了XmlLoader以后，需要等到XmlLoader说"OK-done"才能做起他的事情。
下载Flex的打包文件。
http://www.gotoandplay.it/_articles/2007/10/tileLayout/TileGame.zip