pureMVC 之基本使用

阅读更多

  pureMVC是flex的轻量级框架。下面是实例。
一，视图组件页面
1，添加用户页面：UserForm.mxml

	
		[Event('add')]
	
	
		
	
	
		
			
		
		
			
		
	
	
	
		
	

2，用户用表页面UserList.mxml

	
	[Event('delete')]


	
		
			
		
		
			
			
			
		
	
	
		
	

3,主页面（包含添加用户页面，和用户列表页面）MyPureMVCdemo.mxml

二：注册组件
1,总注册组件

package com.superwulei {
	import com.superwulei.controller.StartupCommand;
	
	import org.puremvc.as3.patterns.facade.Facade;

	public class ApplicationFacade extends Facade {
		public static const STARTUP:String      = "startup";
		public static const USER_ADD:String     = "user_added";
		public static const USER_DELETE:String  = "user_delete";

		//提供静态函数，供外界调用
		public static function getInstance():ApplicationFacade 
		{
			if (instance == null)
			{
				instance = new ApplicationFacade();
			}
			
			return instance as ApplicationFacade;
		}

		public function startup(app:Object):void 
		{
			sendNotification(STARTUP, app);
		}

		//该函数 是 该类的初始化函数，创建改类实例后会自动调用改函数
		//改函数主要是用来 注册控制器，代理等操作。
		override protected function initializeController():void 
		{
			super.initializeController();
			
			trace("呵呵，我是第一执行的函数，我很牛");
			registerCommand(STARTUP, StartupCommand);
		}
	}
}

2，启动时自动注册组件

package com.superwulei.controller
{
	import com.superwulei.ApplicationFacade;
	
	import org.puremvc.as3.patterns.command.MacroCommand;

	public class StartupCommand extends MacroCommand
	{
		override protected function initializeMacroCommand():void{
			/*
			添加子命令
			*/
			addSubCommand(ModelPrepCommand);
			addSubCommand(ViewPrepCommand);
			/* 注册添加、删除用户命令 */
			facade.registerCommand("user_added",AddUserCommand);
			facade.registerCommand("user_delete",DeleteUserCommand);
		}
	}
}

3,注册proxy组件

package com.superwulei.controller
{
	import com.superwulei.model.UserProxy;
	
	import org.puremvc.as3.interfaces.INotification;
	import org.puremvc.as3.patterns.command.SimpleCommand;

	public class ModelPrepCommand extends SimpleCommand
	{
		override public function execute(notification:INotification):void
		{
			/* 注册Model */
			facade.registerProxy(new UserProxy());
		}
	}
}

4,注册视图组件

package com.superwulei.controller
{
	import com.superwulei.view.UserFormMediator;
	import com.superwulei.view.UserListMediator;
	
	import org.puremvc.as3.interfaces.INotification;
	import org.puremvc.as3.patterns.command.SimpleCommand;

	public class ViewPrepCommand extends SimpleCommand
	{
		override public function execute(notification:INotification):void
		{
			//获取主页面 作为 app变量
			var app:MyPureMVCdemo = notification.getBody() as MyPureMVCdemo;
			/* 注册添加用户的视图 和 用户列表视图 */
			facade.registerMediator(new UserFormMediator(app.userForm));
			facade.registerMediator(new UserListMediator(app.userList));
		}
	}
}

三：控制器组件
1，添加用户控制器

package com.superwulei.controller
{
	import com.superwulei.model.UserProxy;
	import com.superwulei.model.vo.UserVO;
	
	import mx.controls.Alert;
	
	import org.puremvc.as3.interfaces.INotification;
	import org.puremvc.as3.patterns.command.SimpleCommand;

	/*
	此类是添加用户的处理类，对于此类的执行机制的理解是至关重要的。
	1，此类继承SimpleCommand，一旦facade接收到对应此类的通知名称时候会自动调用此类的execute函数
	2，execute函接受一个参数INotification，这个参数的getBody函数返回的是 发送通知时候传递的参数。
	*/
	public class AddUserCommand extends SimpleCommand
	{
		override public function execute(notification:INotification):void
		{
			//注意参数的getBody饭回来的是 调用者传递的参数。
			//回顾一下，这个肯定是UserFormMediator 中add方法中传递过来的参数 user，而这个user也就是页面上添加用户时候
			//封装的user
			var user:UserVO = notification.getBody() as UserVO;
			
			//此时调用facade中的proxy类处理添加用户
			//为什么facade能找到这个proxy类呢，对了，之前我们已经在StartupCommand 中已经注册了，是否还急的
			//addSubCommand(ModelPrepCommand);而ModelPrepCommand中自动执行函数中进行了proxy的注册，你看是不是
			//facade.registerProxy(new UserProxy());
			var userProxy:UserProxy = facade.retrieveProxy(UserProxy.NAME) as UserProxy;
			
			if(user.isValid){
				//代理类执行 添加用户操作
				//特别注意：也许你会问，就算UserProxy添加了一个用户，那么为什么下面的列表中就会显示这个用户了呢。
				//你是否还记得当年在facade中注册视图的时候初始化UserListMediator，初始化这个视图的时候有一句
				//userList.users = userProxy.users; 明白了吧。
				userProxy.addItem(user);
			}else{
				Alert.show("请检查用户名和密码");
			}
		}
		
	}
}

2,删除用户组件

package com.superwulei.controller
{
	import com.superwulei.model.UserProxy;
	import com.superwulei.model.vo.UserVO;
	
	import org.puremvc.as3.interfaces.INotification;
	import org.puremvc.as3.patterns.command.SimpleCommand;

	public class DeleteUserCommand extends SimpleCommand
	{
		override public function execute(notification:INotification):void
		{
			var user:UserVO = notification.getBody() as UserVO;
			var userProxy:UserProxy = facade.retrieveProxy(UserProxy.NAME) as UserProxy;
			userProxy.deleteItem(user);
		}
		 
	}
}

四：代理类
1，实体类：

package com.superwulei.model.vo {

	public class UserVO {

		public var email:String = '';            //电子邮件
		public var password:String = '';         //密码
		public var regDate:Date;                 //注册日期

		public function UserVO(email:String, password:String) {
			this.email = email;
			this.password = password;
			this.regDate = new Date();
		}

		/*
		验证用户信息
		email：以单词字符开始，以.cn结尾
		password：     长度大于等于6位
		*/
		public function get isValid():Boolean {
			var emailRegExp:RegExp = /^\w+[@]\w+(.com)$/;
			return (emailRegExp.test(this.email) && this.password.length >= 6);
		}
	}
}

2,代理类

package com.superwulei.model
{
	import com.superwulei.model.vo.UserVO;
	import mx.collections.ArrayCollection;
	import mx.rpc.remoting.RemoteObject;
	import org.puremvc.as3.patterns.proxy.Proxy;

	public class UserProxy extends Proxy
	{
		public static const NAME:String = 'UserProxy';
		
		public function UserProxy()
		{
			super(NAME,new ArrayCollection());
		}
		
		public function get users():ArrayCollection{
			return data as ArrayCollection;
		}
		
		/* 添加项 */
		public function addItem(item:Object):void{
			users.addItem(item);
		}
		
		/* 删除项 */
		public function deleteItem(item:Object):void{
			var user:UserVO = item as UserVO;
			for(var i:int = 0; i < users.length; i++){
				if(users[i].email == user.email){
					users.removeItemAt(i);
				}
			}
		}
	}
}