Cairngorm 框架试用心得
Cairngorm 框架是Adobe官方发布的Flex 框架,于是从网上下载一下 ver 2.2.1,试用一下。
做了一个试例,(以网上网友的试例为样本,照模样的做了一个)。
从代码的情况看,主要有六大类的代码,其中有MVC,还有事件等。界面如下:
操作方法:录入书名、作者、价格后,单击“添加”按钮,所录入的信息自动的出现在上面的列表中。
为了搞明白运行的过程,我们从外面向里面分析:
第一、 先看界面。
上面的界面,是在主界面是调用的,调用的代码如下:
AddBook.mxml:
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
xmlns:control="com.adobe.cairngorm.book.control.*" xmlns:view="com.adobe.cairngorm.book.view.*"
title="Cairngorm 试用">
<mx:Script>
<![CDATA[
import com.adobe.cairngorm.book.model.AddBookModelLocator;
[Bindable]
public var model:AddBookModelLocator = AddBookModelLocator.getInstance();
]]>
</mx:Script>
<control:AddBookControl id="controller"/>
<view:AddBookView id="addBookView" BookAC="{model.bookAC}" x="53" y="44"/>
</mx:WindowedApplication>
主要的代码有三部分:
(1) 创建Model
public var model:AddBookModelLocator = AddBookModelLocator.getInstance();
(2) 加载控制
<control:AddBookControl id="controller"/>
(3) 加载视图
<view:AddBookView id="addBookView" BookAC="{model.bookAC}" x="53" y="44"/>
设计的视图中,也就是VIEW层,我们需要为它准数据源,用于展示,上面的语句中,BookAC="{model.bookAC} 用来向VIEW提供数据。
上面的代码实现在MVC三部分的整合。所有的一切准备就绪了,就等触发相关的事件。
第二、 看看 BookAC="{model.bookAC}
在实际操作前,先分析一下,向展示层提供的数据是如何得到的。
BookAC="{model.bookAC},说明数据来源于 model, 即AddBookModelLocator:
AddBookModelLocator.as
package com.adobe.cairngorm.book.model
{
import com.adobe.cairngorm.model.IModelLocator;
import mx.collections.ArrayCollection;
public class AddBookModelLocator implements IModelLocator
{
[Bindable]
public var bookAC:ArrayCollection = new ArrayCollection();
private static var addBookModelLocator:AddBookModelLocator;
public static function getInstance():AddBookModelLocator{
if (null == addBookModelLocator){
addBookModelLocator = new AddBookModelLocator();
}
return addBookModelLocator;
}
}
}
在上面的类中,
public var bookAC:ArrayCollection = new ArrayCollection();
提供了存放数据的容器。至于数据是如何得到的,我们暂且不管。
第三、 示例中所有触发是从界面上单击“添加”按钮开发始的,
AddBookView.mxml:
<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" fontSize="12" layout="absolute" width="404" height="348" title="Cairngorm 试用">
<mx:Label x="10" y="217" text="书名" />
<mx:Label x="10" y="245" text="作者"/>
<mx:Label x="10" y="273" text="单价"/>
<mx:TextInput x="59" y="215" id="bookname" width="255"/>
<mx:TextInput x="59" y="243" id="bookauthor" width="255"/>
<mx:TextInput x="59" y="271" id="bookprice" width="255"/>
<mx:Button x="322" y="272" label="添加" click="AddBook();"/>
<mx:DataGrid x="10" y="10" width="364" height="187" dataProvider="{BookAC}">
<mx:columns>
<mx:DataGridColumn headerText="书名" dataField="bookname"/>
<mx:DataGridColumn headerText="作者" dataField="bookAuthor"/>
<mx:DataGridColumn headerText="单价" dataField="bookPrice"/>
</mx:columns>
</mx:DataGrid>
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import com.adobe.cairngorm.book.vo.BookVO;
import com.adobe.cairngorm.book.event.AddBookEvent;
import com.adobe.cairngorm.control.CairngormEventDispatcher;
[Bindable]
public var BookAC:ArrayCollection=null;
public function AddBook():void{
var bv:BookVO = new BookVO();
bv.bookname = this.bookname.text;
bv.bookAuthor=this.bookauthor.text;
bv.bookPrice=this.bookprice.text;
var event:AddBookEvent = new AddBookEvent(bv);
CairngormEventDispatcher.getInstance().dispatchEvent(event);
}
]]>
</mx:Script>
</mx:Panel>
代码的最后两句:
var event:AddBookEvent = new AddBookEvent(bv);
CairngormEventDispatcher.getInstance().dispatchEvent(event);
完成了事件的包装及分发。(生成事件时,已经包含了录入的数据)
public var BookAC:ArrayCollection=null;
提供数据的接收并绑定到控件中。可以联系到前面的
<view:AddBookView id="addBookView" BookAC="{model.bookAC}" x="53" y="44"/>
第四、 AddBookEvent 类分析
从前可以看到,分发事件时,是需要指定分发的事件具体信息的。dispatchEvent只是起个分发的作用。
AddBookEvent.as
package com.adobe.cairngorm.book.event
{
import com.adobe.cairngorm.book.vo.BookVO;
import com.adobe.cairngorm.control.CairngormEvent;
import com.adobe.cairngorm.book.control.AddBookControl;
public class AddBookEvent extends CairngormEvent
{
public var bookVO:BookVO;
public function AddBookEvent(bookVO:BookVO){
super(AddBookControl.EVENT_ADD_BOOK);
this.bookVO = bookVO;
}
}
}
CairngormEvent 类提供一个带参的构造函数,参数是一个实体类:
BookVO.as
package com.adobe.cairngorm.book.vo
{
//图书基本信息
public class BookVO
{
public function BookVO()
{
//TODO: implement function
}
public var bookname:String;
public var bookAuthor:String;
public var bookPrice:String;
}
}
这个类,仅仅用于对数据进行封装,没有其它用途。
super(AddBookControl.EVENT_ADD_BOOK); 用于将消息提交到Cairngorm,交由Cairngorm框架处理。
但是,事件处理时,要用到控制器中对事件的定义:
AddBookControl.EVENT_ADD_BOOK
第五、 AddBookControl 类
AddBookControl.as
package com.adobe.cairngorm.book.control
{
import com.adobe.cairngorm.control.FrontController;
import com.adobe.cairngorm.book.command.AddBookCommand;
public class AddBookControl extends FrontController
{
public static const EVENT_ADD_BOOK:String="addBook";
public function AddBookControl()
{
addCommand(AddBookControl.EVENT_ADD_BOOK, AddBookCommand);
}
}
}
AddBookControl 类是一个控制类,通过addCommand 方法,将事件和 command 关联起来,这样才可以对指定的事件进行监听。
第六、 事件的执行和结果获取
事件的执行和结果获取由 command 来完成:
AddBookCommand.as
package com.adobe.cairngorm.book.command
{
import com.adobe.cairngorm.business.Responder;
import com.adobe.cairngorm.commands.Command;
import com.adobe.cairngorm.control.CairngormEvent;
import com.adobe.cairngorm.book.vo.BookVO;
import com.adobe.cairngorm.book.model.AddBookModelLocator;
import com.adobe.cairngorm.book.business.AddBookDelegate;
import com.adobe.cairngorm.book.event.AddBookEvent;
public class AddBookCommand implements Command, Responder
{
private var model:AddBookModelLocator = AddBookModelLocator.getInstance();
public function execute(event:CairngormEvent):void
{
var delegate : AddBookDelegate = new AddBookDelegate ( this ) ;
var addBookEvent : AddBookEvent = AddBookEvent ( event ) ;
delegate.AddBook(addBookEvent.bookVO) ;
}
public function onResult( event : * = null ):void
{
model.bookAC.addItem(BookVO(event));
}
public function onFault(event : * = null):void
{
//TODO: implement function
}
}
}
在这个类中,execute 和onResult 才是我们想要的。
model.bookAC.addItem(BookVO(event)); 完成了数据的填充,最终提供给界面。
总结
使用 Cairngorm 框架确实能很好的对事件进行封装,如果是多人开发,还是可以的。当然,不足也是明显的,我们也看到,为了实现在一个事件的处理,我们需要增加6个类,这对编码和调试确实压力不小。想象一个,如果有很多的事件,那需要增加多少类?增加多少的工作量?
引用:http://blog.csdn.net/whqcfp/archive/2009/05/11/4168747.aspx