cairngorm实例-读取本地xml

框架流程图：

1、先导入cairngorm.swc文件

2、首先是view

<?xml version="1.0" encoding="utf-8"?><mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300" initialize="init()"><mx:Script><!--[CDATA[ import com.adobe.cairngorm.control.CairngormEvent;import com.adobe.cairngorm.control.CairngormEventDispatcher;import com.test.model.MainModelLocator;import com.test.event.ControlEvent;//界面文本框中的数据是来自数据模型MainModelLocator（单列模式）提供，[Bindable]public var mainModel:MainModelLocator = MainModelLocator.getInstance();public function init():void{//界面初始化完成之后，会发出一个需要加载XML的事件ControlEvent.UPLOAD_XML//ControlEvent事件是我们event包中，我们自定义的事件，他继承于CairngormEvent。var evt:ControlEvent = new ControlEvent(ControlEvent.UPLOAD_XML);evt.view = this;//将this(父类Canvas)赋值给evt.view(object类型)CairngormEventDispatcher.getInstance().dispatchEvent(evt);//dispatchEvent(evt)将事件分发后，MainControl进行映射，然后执行command的execute()方法}public function onComplete():void{txtContent.text = mainModel.txtVo.contentStr;}public function upClick(event:Object):void{var evt:ControlEvent = new ControlEvent(ControlEvent.UP_SHOW);evt.view = this;CairngormEventDispatcher.getInstance().dispatchEvent(evt);}public function downClick(event:Object):void{var evt:ControlEvent = new ControlEvent(ControlEvent.DOWN_SHOW);evt.view = this;//CairngormEventDispatcher.getInstance().dispatchEvent(evt)将事件分发后，//····由ForntController进行捕获，并将这个事件与对应处理的命令进行映射：MainControl.asCairngormEventDispatcher.getInstance().dispatchEvent(evt);}]]--></mx:Script><mx:Button id="upBtn" buttonMode="true" x="55" y="242" label="向上翻" click="upClick(event)"/><mx:Button id="downBtn" buttonMode="true" x="275" y="242" label="想下翻" click="downClick(event)"/><mx:TextArea editable="false" id="txtContent" x="55" y="10" width="279" height="200"/></mx:Canvas> 

这里有个ControlEvent，所以插入它的代码

/* CairngormEvent：继承flash.events.Event，其包含一个data成员，用来传递参数数据之用。**/package com.test.event{import com.adobe.cairngorm.control.CairngormEvent;public class ControlEvent extends CairngormEvent {public static var UP_SHOW:String = "com.event.ControlEvent.up_show";public static var DOWN_SHOW:String = "com.event.ControlEvent.down_show";public static var UPLOAD_XML:String = "com.event.ControlEvent.upload_xml";public function ControlEvent(e:String){super(e);//让父类CairngormEvent去执行//CairngormEvent(e);}}}

3、dispatchEvent后是Controler，Controler只是做个中间量

/* Control含三个基类：CairngormEvent、CairngormEventDispatcher和FrontController。（1）CairngormEvent：继承flash.events.Event，其包含一个data成员，用来传递参数数据之用。（2）CairngormEventDispatcher：采用单例模式(Singleton Pattern)，用来广播用户发起的自定义动作事件。（3）FrontController：相当于控制中心，在这里你要做的工作是将事件（CairngormEvent）和命令（Command）之间的映射关系注册在它的成员commands（Dictionary类型）中以后，凡是CairngormEventDispatcher广播出来的事件，首先都会在这里查找，找到对应的event对应的command后，便执行Command的execute()方法。*/package com.test.control{import com.adobe.cairngorm.control.FrontController;import com.test.event.ControlEvent;import com.test.command.DownshowCommand;import com.test.command.UpshowCommand;import com.test.command.GetTxtDataCommand;//控制类MainControl，他继承于FrontController，负责侦听所有的事件。//前端控制器FrontController是Cairngorm事件的唯一监听者，但其不做任何操作，只是集中注册并管理事件（Event）与命今（Command）的映射关系。public class MainControl extends FrontController{public function MainControl(){addCommand(ControlEvent.DOWN_SHOW,DownshowCommand);//若接收到CairngormEventDispatcher过来的事件ControlEvent.DOWN_SHOW，就执行DownshowCommandaddCommand(ControlEvent.UP_SHOW,UpshowCommand);addCommand(ControlEvent.UPLOAD_XML,GetTxtDataCommand);//侦听到有加载XML数据的事件后， 注册命令方法 GetTxtDataCommand}}}

4、Controler把event和command连接了起来，接下里是command：GetTxtDataCommand、DownshowCommand和UpshowCommand

package com.test.command{import com.adobe.cairngorm.business.HTTPServiceDelegate;import com.adobe.cairngorm.business.IResponder;import com.adobe.cairngorm.commands.Command;import com.adobe.cairngorm.control.CairngormEvent;import com.test.view.test;import com.test.model.MainModelLocator;import mx.rpc.events.FaultEvent;import mx.rpc.events.ResultEvent;import service.Service;//GetTxtDataCommand实现Command接口public class GetTxtDataCommand implements Command,IResponder{private var xmlPath:String = Service.XML_PATH+"data.xml";private var view:test;public function GetTxtDataCommand(){}//在execute方法中书写执行代码。创建HTTPServiceDelegate对象加载XMLpublic function execute(e:CairngormEvent):void{view = e.view as test;//不明白//创建HTTPServiceDelegate对象来加载XMLvar http:HTTPServiceDelegate = new HTTPServiceDelegate(this,xmlPath);//关于HTTPServiceDelegate的参数未明白http.send();}//返回的结果由自己来输出。所以GetTxtDataCommand还需要实现Iresponder接口中的result(e:ResultEvent)和fault(e:FaultEvent)的方法public function result(e:ResultEvent):void{ var x:XML = XML(e.result); //将e.result转换为xml格式MainModelLocator.getInstance().txtVo.setXMLData(x); //setXMLData()取得xml的数据，转换为stringview.onComplete(); //onComplete()方法将txtVo.contentStr赋值给lable控件}public function fault(e:FaultEvent):void{}}}

5、Commad要绑定Model里的数据

/*定义了ModelLocator接口，我们只需要实现该接口，把所需要绑定的数据保存在这里。通常我们都采用单例模式（Singleton Pattern）来实现，并按照项目模块进行分类，避免把整个项目的所有数据都保存在一个类文件中。换句话说，ModelLocator是整个系统的数据中心。*****/package com.test.model{ //界面文本框中的数据是来自数据模型MainModelLocator（单列模式）提供， //MainModelLocator中包含了VO包中的数据格式import com.adobe.cairngorm.model.ModelLocator;import com.test.vo.TxtVO;public class MainModelLocator implements ModelLocator{private static var instance:MainModelLocator; // 私有//当应用程序状态改变时，Moel Locator 通过Data Binding方式来通知View改变。[Bindable]public var txtVo:TxtVO = new TxtVO();public static function getInstance():MainModelLocator // 单例模式{ //getInstance()相当于构造函数，创建一个MainModelLocator对象if(instance==null){instance = new MainModelLocator();}return instance;}}}

6、Model里的数据是从VO里得到

package com.test.vo{ //Vo包放置自己定义的数据格式。[Bindable]public class TxtVO{private var _contentStr:String;public function TxtVO(){}public function get contentStr():String{return _contentStr;}public function set contentStr(str:String):void{_contentStr = str;}public function setXMLData(x:XML):void{_contentStr = x.children();//children():XMLList;按 XML 对象的显示顺序列出其子项。}}}

7、business暂时未用到

8、最后是main.mxml，它要调用View中的自定义组件

<?xml version="1.0" encoding="utf-8"?><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"xmlns:Test="com.test.view.*"xmlns:control="com.test.control.*"><mx:Style>Application{font-size:12px;}</mx:Style><control:MainControl/><!--FrontController必须要在你的系统中实例化--><mx:Canvas width="100%" height="100%"><mx:Label x="252" y="10" text="一个展示"/><Test:test id="testContent" x="91" y="38" height="288"/></mx:Canvas></mx:Application>