flex 之 pruMVC 基础事例

flex 之 pruMVC 基础例子
1，添加页面

<?xml version="1.0" encoding="utf-8"?>
<mx:Panel title="Registor" xmlns:mx="http://www.adobe.com/2006/mxml">
	<mx:Metadata>
		[Event('add')]
	</mx:Metadata>

	<mx:Script>
		<![CDATA[
			import mx.controls.Alert;
			import com.superwulei.model.vo.UserVO;
			public static const USER_ADD:String = "add";

			public var user:UserVO;
			/* 添加用户 */
			private function addUser():void {
				user = new UserVO(email.text, password.text);
				dispatchEvent(new Event(USER_ADD));
			}

			private function enableSubmit(u:String, p:String):Boolean {
				return u != '' && p != '';
			}
		]]>
	</mx:Script>

	<mx:Form>
		<mx:FormItem label="email" required="true">
			<mx:TextInput id="email"/>
		</mx:FormItem>
		<mx:FormItem label="password" required="true">
			<mx:TextInput id="password" displayAsPassword="true"/>
		</mx:FormItem>
	</mx:Form>
	
	<mx:ControlBar horizontalAlign="right">
		<mx:Button id="sbumitButton" label="添加"
			 enabled="{enableSubmit(email.text,password.text)}"
			 click="addUser();"/>
	</mx:ControlBar>
</mx:Panel>

添加页面的包装类

package com.superwulei.view
{
	import com.superwulei.ApplicationFacade;
	import com.superwulei.view.components.UserForm;
	
	import flash.events.Event;
	
	import org.puremvc.as3.patterns.mediator.Mediator;

	public class UserFormMediator extends Mediator
	{
		public static const NAME:String = "UserFormMediator";
		
		public function UserFormMediator(viewComponent:Object)
		{
			super(NAME, viewComponent);
			userForm.addEventListener(UserForm.USER_ADD,onAdd);
		}
		
		private function get userForm():UserForm{
			return viewComponent as UserForm;
		}
		
		/* 添加用户监听器 */
		private function onAdd(event:Event):void{
			add();
		}
		/* 添加用户方法 */
		private function add():void{
			trace("chenchaoyang");
			sendNotification("user_added",userForm.user);
		}
	}
}

2,列表删除页面

<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" title="已注册用户">
	<mx:Metadata>
	[Event('delete')]
</mx:Metadata>

	<mx:DataGrid id="userGrid" dataProvider="{users}">
		<mx:Script>
			<![CDATA[
				import mx.formatters.DateFormatter;
				import com.superwulei.model.vo.UserVO;
				import mx.collections.ArrayCollection;
				
				public static const USER_DELETE:String = "delete";
				
				[Bindable]
				public var users:ArrayCollection;
				
				public var selectUser:UserVO;

				private function deleteUser():void{
					selectUser = userGrid.selectedItem as UserVO;
					dispatchEvent(new Event(USER_DELETE));
				}
			]]>
		</mx:Script>
		<mx:columns>
			<mx:DataGridColumn dataField="email"/>
			<mx:DataGridColumn dataField="password"/>
			<mx:DataGridColumn dataField="regDate" width="200"/>
		</mx:columns>
	</mx:DataGrid>
	<mx:HBox textAlign="center">
		<mx:Button id="deleteButton" label="删除" click="deleteUser();"/>
	</mx:HBox>
</mx:Panel>

列表删除页面的封装类：

package com.superwulei.view
{
	import com.superwulei.ApplicationFacade;
	import com.superwulei.model.UserProxy;
	import com.superwulei.view.components.UserList;
	
	import flash.events.Event;
	
	import org.puremvc.as3.patterns.mediator.Mediator;

	public class UserListMediator extends Mediator
	{
		private var userProxy:UserProxy;
		
		public static const NAME:String = "UserListMediator";
		
		public function UserListMediator(viewComponent:Object)
		{
			super(NAME, viewComponent);
			userList.addEventListener(UserList.USER_DELETE,onDelete);
			userProxy = facade.retrieveProxy(UserProxy.NAME) as UserProxy;
			userList.users = userProxy.users;
		}
		
		private function get userList():UserList{
			return viewComponent as UserList;
		}
		/* 删除用户监听器 */
		private function onDelete(event:Event):void{
			deleteUser();
		}
		/*删除用户方法*/
		private function deleteUser():void{
			sendNotification(ApplicationFacade.USER_DELETE,userList.selectUser);
		}
		
	}
}

3,实体类

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);
		}
	}
}

实体类的代理类：

package com.superwulei.model
{
	import com.superwulei.model.vo.UserVO;
	
	import mx.collections.ArrayCollection;
	
	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);
				}
			}
		}
	}
}

4,添加Action

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;

	public class AddUserCommand 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;
			
			if(user.isValid){
				userProxy.addItem(user);
			}else{
				Alert.show("请检查用户名和密码");
			}
		}
		
	}
}

5,删除Action

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);
		}
		 
	}
}

6，注册代理action

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());
		}
	}
}

7,注册视图action

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
		{
			var app:MyPureMVCdemo = notification.getBody() as MyPureMVCdemo;
			/* 注册View */
			facade.registerMediator(new UserFormMediator(app.userForm));
			facade.registerMediator(new UserListMediator(app.userList));
		}
	}
}

8,总注册类

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);
		}
	}
}