Cairngorm 基础

[color=blue]请关注新浪微博 账号：大数据进行时（[url]http://weibo.com/u/3272022684[/url]）[/color]

Cairngorm是指导Flex开发以MVC（Model-View-Control）模式进行的架构框架，它的重点在于给你一个指导性原则，而并非具体实现，它要实现的目的就是提高项目的可维护性和灵活性，和重用（注意是功能上的重用，而非代码级的重用）。

它是一个由多个设计模式组合而成的集合体。

使用它的重点在于遵循它的设计思想，而非使用它的代码。

它解决的问题包括：使用Model保持客户端状态，使用ValueObject方式达到传送数据的目的。

Cairngorm推荐的最佳实践：

1. 将数据模型几种到一个全局的ModelLocator中。ModelLocator应为单例模式避免变量冲突。
2. 在控件中使用数据绑定
3. 合理组织视图，将组件封闭（避免直接对外引用），通过声明组件所需的共有变量（需要能够绑定）从外部接收数据，声明自定义事件来播发组件的业务逻辑。
4. 功能点驱动的开发，以业务逻辑为驱动(用户引发的操作，系统引发的操作，都通过Event派发，然后交给命令执行)。


Cairngorm 示意图(网好找个看看)

1. Model Locator（模型定位器）：存储你的应用中所有的Value Objects（数据）和共享变量在一个位置。和Http的Session对象类似，只是它存储在Flex接口的客户端而不是在中间件应用服务器的服务器端。
2. View（界面）：通过一个或者多个Flex组件（按钮、面板、组合框、Tile等等）组合在一起的一个个命名单元，绑定数据在Model Locator（模型定位器）中，并且产生基于用户操作（点击、滚动、拖拽等）的自定义的Cairngorm事件。
3. Front Controller（前端控制器）：接收Cairngorm事件并映射他们到Cairngorm命令控制器上。
4. Command（命令控制器）：处理商业逻辑，调用Caringorm代理和（或）其它命令。
5. Delegate（代理）：由命令创建，实例化远程过程调用（HTTP、Web Service等等）并且处理命令的返回结果数据。
6. Service（服务）：定义连接远程数据存储的远程过程调用（HTTP、Web Service等等）。

一个例子：

View：

<?xml version="1.0" encoding="utf-8"?>


<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" fontSize="12" creationComplete="init()" xmlns:service="service.*">

<!-- 必须引入RemoteObjectService -->

<service:RemoteObjectService id="DataSerivce"/>

	<mx:Script>
		<![CDATA[
			import cairngorm.vo.UserVO;
			import cairngorm.event.LogonEvent;
			import mx.controls.Alert;
			import mx.rpc.events.ResultEvent;


			private function init() : void{

			}

			/* 普通访问方式 */
			private function onCustomerRS_BClick() : void{

				 this.DataSerivce.CustomerService_RO.addEventListener(ResultEvent.RESULT,onResult); 
				 this.DataSerivce.CustomerService_RO.testPrintln();

			}

			private function onResult(event : ResultEvent) : void{
				Alert.show(event.result.toString());
			}

			/* Cairngorm访问方式  */

			private function onCairngormClick() : void{

				var userVO : UserVO = new UserVO();
				userVO.userName = this.username_TI.text;
				userVO.passwd = this.passwd_TI.text;

				var event : LogonEvent = new LogonEvent(userVO);

				event.dispatch();

			}


		]]>
	</mx:Script>


	<mx:Button id="customerRS_B" x="63" y="30" label="普通J2EE交互" click="onCustomerRS_BClick()"/>
	<mx:Button x="133" y="250" label="Cairngorm 初版" click="onCairngormClick()"/>
	<mx:TextInput id="username_TI" x="133" y="166"/>
	<mx:TextInput id="passwd_TI" x="133" y="205"  displayAsPassword="true"/>
	<mx:Label x="63" y="168" text="username"/>
	<mx:Label x="63" y="207" text="password"/>

</mx:Application>

Event:

package cairngorm.event
{
	import cairngorm.control.UserController;
	import cairngorm.vo.UserVO;

	import com.adobe.cairngorm.control.CairngormEvent;

	import mx.controls.Alert;

	public class LogonEvent extends CairngormEvent//继承 CairngormEvent
	{

		private var _userVO : UserVO;//用户信息，

		public function LogonEvent(value : UserVO)
		{
			this._userVO = value;
			super(UserController.LOGON_EVENT);
		}


		public function set userVO(value : UserVO) : void{
			this._userVO = value;
		}

		public function get userVO() : UserVO{
			return this._userVO;
		}

	}
}

Controller

package cairngorm.control
{
	import cairngorm.command.UserCommand;
	import cairngorm.event.LogonEvent;

	import com.adobe.cairngorm.control.FrontController;

	/* 命令模式，根据不同的String调用不同的Command */

	public class UserController extends FrontController
	{

		/*
		 当然在这里的 LOGON_EVENT 也可以定义在Event中 ，

		 this.addCommand(LogonEvent.LOGON_EVENT ,UserCommand);

		 效果是一样的

		*/
		public static const LOGON_EVENT : String = "logonEvent";

		public function UserController()
		{
			super();
			this.addCommand(LOGON_EVENT,UserCommand);
		}

	}
}

Command

package cairngorm.command
{
	import cairngorm.business.UserDelegate;
	import cairngorm.event.LogonEvent;

	import com.adobe.cairngorm.commands.ICommand;
	import com.adobe.cairngorm.control.CairngormEvent;

	import mx.controls.Alert;
	import mx.rpc.IResponder;

	public class UserCommand implements ICommand, IResponder
	{
		public function UserCommand()
		{
		}

		/*  
		处理Flex业务逻辑，调用代理
		*/

		public function execute(event:CairngormEvent):void
		{
			var logonEvent : LogonEvent = LogonEvent(event);

			var delegate : UserDelegate = new UserDelegate(this);//调用代理

			delegate.logon(logonEvent.userVO);
		}


		/*  
			在result中处理访问服务器后的返回值，
			一般在这里对Model中的数据进行处理，这样在View中就可以动态地改变了
		*/

		public function result(data:Object):void
		{
			if(data.result == true){

				Alert.show("  允许操作 ");

			}else{

				Alert.show("  禁止操作 ");

			}

		}
		/* 
		  当访问J2EE时，出现问题时，调用这个方法
		 */
		public function fault(info:Object):void
		{
		}

	}
}

Business

package cairngorm.business
{
	import cairngorm.vo.UserVO;

	import com.adobe.cairngorm.business.ServiceLocator;

	import mx.rpc.AsyncToken;
	import mx.rpc.IResponder;
	import mx.rpc.remoting.RemoteObject;

	public class UserDelegate
	{

		private var _responder : IResponder;//返回给Command中的信息

		private var _dataService : RemoteObject;//用于调用J2EE接口方法 

		private var _result : AsyncToken; //返回值

		public function UserDelegate(value : IResponder)
		{
			this._responder = value;
			_dataService = ServiceLocator.getInstance().getRemoteObject("CairngormService_RO");
		}

		public function logon(value : UserVO) : void{
			_result = _dataService.testLogon(value);//调用J2EE方法
			_result.addResponder(this._responder);
		}

	}
}

VO

package cairngorm.vo
{
	public class UserVO
	{

		private var _userName : String;//用户名

		private var _passwd : String;//密码

		public function UserVO()
		{
		}

		public function set userName(value : String) : void{
			this._userName = value;
		}

		public function get userName() : String{
			return this._userName;
		}


		public function set passwd(value : String) : void{

			this._passwd = value;
		}

		public function get passwd() : String{
			return this._passwd;
		}

	}
}

ModelLocator:

package cairngorm.model
{
	import com.adobe.cairngorm.model.ModelLocator;

	/* 在这里使用了一个单例模式 */

	public class UserModelLocator implements ModelLocator
	{

		public function UserModelLocator()
		{
		}

		private static var _instance : UserModelLocator;

		public static function getInstance() : UserModel{
			if(_instance == null){
				_instance = new UserModelLocator();
			}

			return _instance;
		}

		/* 

		定义绑定数据，它就相当于一个数据源，在主程序或者Module中声明一个实例

		1、操作它来改变页面中的数据，用户交互好，

		2、并操作数据库，相当于走两条路

		 */




	}
}

MXML文件

<?xml version="1.0" encoding="utf-8"?>
<caringorm:ServiceLocator xmlns:mx="http://www.adobe.com/2006/mxml" 
	xmlns:caringorm="http://www.adobe.com/2006/cairngorm" xmlns:control="cairngorm.control.*">

	<!--
 		 在Application 中必须引入Controller
	-->
	<control:UserController/>

	<mx:RemoteObject id="CustomerService_RO" destination="CustomerRemoteService"/>

	<mx:RemoteObject id="CairngormService_RO" destination="CairngormRemoteService"/>

</caringorm:ServiceLocator>

remote-config.xml文件

<?xml version="1.0" encoding="UTF-8"?>
<service id="remoting-service" 
    class="flex.messaging.services.RemotingService">

    <adapters>
        <adapter-definition id="java-object" class="flex.messaging.services.remoting.adapters.JavaAdapter" default="true"/>
    </adapters>

    <default-channels>
        <channel ref="my-amf"/>
    </default-channels>

    <destination id="CustomerRemoteService">
    	<properties>
    		<source>com.sun.CustomerRemoteObject</source>
    	</properties>
    </destination>

    <destination id="CairngormRemoteService">
    	<properties>
    		<source>com.cairngorm.TestCairngorm</source>
    	</properties>
    </destination>

</service>

J2EE

package com.cairngorm;

import flex.messaging.io.amf.ASObject;

public class TestCairngorm {

	public boolean testLogon(ASObject asObj){

		System.out.println("userName ============= " + asObj.get("userName"));
		System.out.println("passwd ============= " + asObj.get("passwd"));

		return true;//在Flex端仍然是boolean类型
	}

}

下载例子：

[url]http://download.csdn.net/source/1709904[/url]