MODEL-View-PresenterMVP)模式在FLEX下的开发实例

好久没有写点文字了。最近有个项目要求立足于RIA。之前想自己用DELPHI+REMOBJECTS,但不理想。于是我选择了FLEX来搞。先前的DELPHI、C#相互沟通的博文已经说过了各种开发语言的共性，这次也不例外，高举我的MVP大旗，直接开战。（AS3的语法和JAVA、C#、DELPHI都有很相似之处勒，呵呵。其实我还很陌生）。先搞一个老外的例子来修正，开发思路依旧按照Jeremy Miller的来搞。

 

例子很简单，一个1+1的算术

 

package com.vinoth.MVP.view
{
	public interface IAddView
	{
		
		function set Number3(value:String):void;
		
		function get Number1():Number;
		function get Number2():Number;  
		
		function set Addbuttonclicked(value: Function): void;
		
	}
}



package com.vinoth.MVP.presenter
{
	
	import com.vinoth.MVP.view.IAddView;
	
	public class AdditonPresenter
	{
		import mx.controls.Alert
		
		public var _view:IAddView
		
		[Bindable]
		public var totalValue:Number
		
		public function addData():void{
			
			totalValue = Number(_view.Number1+_view.Number2);
			_view.Number3 = String(totalValue);
		}
		
		public function AdditonPresenter(view:IAddView)
		{
			_view = view;
			_view.Addbuttonclicked = addData;
			
		}

	}
}


<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
				         layout="vertical"
						 verticalAlign="middle"
						 backgroundColor="white"
						 viewSourceURL="srcview/index.html"  
						 creationComplete="init()">
	
	<mx:Script>
		<![CDATA[
			import com.vinoth.MVP.view.AdditionForm;
			
			import com.vinoth.MVP.presenter.AdditonPresenter;
			
			import mx.containers.VBox;
			
			private const MAX_CHILDREN:uint = 5;
			
			public function init():void{
				var additionForm:AdditionForm = new AdditionForm();
				additionForm.percentHeight = 100;
				additionForm.percentWidth = 100;
				accordion.addChild(additionForm)
				new AdditonPresenter(additionForm);
			}
			
		]]>
	</mx:Script>
	
	<mx:ApplicationControlBar dock="true">
		
		<mx:Button label="Add child"
				    />
		<mx:Button label="Delete child"
				    />
	</mx:ApplicationControlBar>
	
<mx:Accordion id="accordion" width="400" height="300" />
</mx:Application>

 

<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" width="350" height="200" 
	implements="com.vinoth.MVP.view.IAddView" creationComplete="init()"
		 backgroundColor="#A0D2FD" backgroundAlpha="0.5" title="Addition of Two Numbers">
	
	<mx:Script>
		<![CDATA[
			
            private var _addbuttonclicked: Function;
			
			private function init():void{
			    btnadd.addEventListener(MouseEvent.CLICK,buttonclick);		
			}
			
			public function get Number1():Number {
				return Number(_Number1.text);
			}
			
			public function get Number2():Number{
				return Number(_Number2.text);
			}
			
			public function set Number3(value:String):void{
				_Number3.text = value; 
			}
			
			public function set Addbuttonclicked(value: Function): void{
				_addbuttonclicked = value;
			}
			
			public function buttonclick(evt:MouseEvent):void{
				_addbuttonclicked();	
			}
						
		]]>
	</mx:Script>
	
	<mx:Form width="100%" height="50%">
		<mx:FormItem label="Number One" width="100%">
			<mx:TextInput id="_Number1" editable="true" width="100%" restrict="0-9"/>
		</mx:FormItem>
		<mx:FormItem label="Number Two" width="100%">
			<mx:TextInput id="_Number2" editable="true" width="100%" restrict="0-9"/>
		</mx:FormItem>
	</mx:Form>
	<mx:HBox width="100%">
		<mx:Label text="Result" />
		<mx:Label width="100%" id="_Number3" />
		<mx:Button id = "btnadd" label="Add" />
	</mx:HBox>
</mx:Panel>