只要是java程序員都會喜歡flex的.

在這裏想表達的是flex是一種面對對象的語言，我是一個java程序員，由於這點我真的很喜歡flex。
一個簡單的例子。通常對某個事物進行Edit,View,Add的操作會在一個頁面文件編寫代碼。
因爲不同操作的頁面都差不多。
當View時頁面不可編輯，
當Edit時頁面會填充之前對象的信息，
當Add時頁面會是等待用戶填充信息的。
Edit和Add可能會有Save Button,而View就不會有。
Edit和Add可以編輯，而View不能編輯。
Edit和View頁面有對象的信息，而Add是空白信息，等待用戶填寫。
面對這些我們該如何設計呢？

(我畫了UML圖搞了半天,沒貼上來.呵呵,博客新手來着)
這裏我們需要一個父頁面，佈局，相同的頁面元素(save,reset按扭等)放到父頁面。
還有一些類似的操作和事件啊如reset(),saveOrUpdate(),validate()放到父頁面,子頁面可以重寫.


這裏先編寫一個父類 PageItem.mxml，將一些子頁面都會用到的屬性,方法放在裏面。

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas
	xmlns:mx="http://www.adobe.com/2006/mxml"
	width="100%" 
	height="100%"
        creationComplete="init();"
>	
//自定義一些共有的事件
	<mx:Metadata>
	 	[Event(name="javaeye_addBean", 			type="com.javaeye.events.DetailsSectionEvents")]
	 	[Event(name="javaeye_saveBean", 		type="com.javaeye.events.DetailsSectionEvents")]
	 	[Event(name="javaeye_updateBean", 		type="com.javaeye.events.DetailsSectionEvents")]
      //省略...
	</mx:Metadata> 
	<mx:Script>
	<![CDATA[
        //import some class we need.

        //表示頁面狀態的常數
        public static const ADD_MODE:String = "toAdd";
        public static const EDIT_MODE:String = "toEdit";
	public static const VIEW_MODE:String = "toView";

        //頁面佈局相同,並且很多相同頁面元素控件,子頁面繼承使用。在此未提及
       //Box Content
	public var javaeye_boxContent:Array;
	//Box Buttons
	public var javaeye_boxButtons:Array;

        /////////////////////////////////
	// PAGE MANIPULATION FUNCTIONS //
	/////////////////////////////////
	/** function called upon creationComplete */
	protected function init():void
	{}

       	/** enable or disable the appropriate components 
       	  * according to pageState */
       	public function javaeye_changePageState(pageState:String):void
	{
		this.pageState = pageState;
		changeButtons(pageState);
	}	
	public function javaeye_getPageState():String
	{
		return this.pageState;
	}
	/** hide or show the appropriate action buttons
       	 * in detail page according to pageState */
       	protected function changeButtons(pageMode:String):void
	{}
        //這裏還有一些方法，saveOrUpdateItem,restForm(),validateForm().頁面佈局,頁面元素 省略...
    ]]>
	</mx:Script>
</mx:Canvas>

自定義事件類 DetailsSectionEvents

package com.javaeye.events
{    
	import flash.events.Event;

	public class DetailsSectionEvents extends Event
	{
            //Event Type
	    public static const SAVE:String   = "javaeye_saveBean";
	    public static const UPDATE:String   = "javaeye_updateBean";
            //省略...            

	    private var bean:Object;

	    public function DetailsSectionEvents(type:String, bean:Object=null)
	    {
	        super(type,true);
	        this.bean = bean;
	    }

	    override public function clone():Event
	    {
	        return new DetailsSectionEvents(type, bean);
	    }
	    //控制器監聽並接受到事件時，可以得到當前的對象
	    public function cme_getBean():Object
	    {
	    	return this.bean;
	    }
	}
}

只要是正對某個對象View,Add或Edit的頁面,都繼承PageItem頁面。

<?xml version="1.0" encoding="utf-8"?>
//繼承了PageItem類
<pageItem:PageItem
	xmlns:mx="http://www.adobe.com/2006/mxml" 
>

	<mx:Script>
		<![CDATA[
			override public function javaeye_changePageState(flag:String):void
			{
				super.javaeye_changePageState(flag);

				if(flag==PageItem.ADD_MODE)
				{	
                                   //設置Add狀態時頁面元素的狀態,visible and 	includeInLayout 等		
				}else if(flag==PageItem.EDIT_MODE)
				{
                                   //設置Edit狀態時頁面元素的狀態,
				}
				else  if(flag==PageItem.VIEW_MODE)
				{
                                   //設置view狀態時頁面元素的狀態,
				}
			}				

			override protected function changeButtons(flag:String):void
			{
	 			if(flag==DetailPageItem.VIEW_MODE)
	 			{
                                        //設置控件是否可見,是否加載
				 	showUIComponent(btnDone,false);
				 	showUIComponent(btnReset,false);
	 			}
	 			else if(flag==DetailPageItem.ADD_MODE||flag==DetailPageItem.EDIT_MODE)
	 			{
	 				showUIComponent(btnDone,true);
				 	showUIComponent(btnReset,true);
	 			}
			}

                        //save 按鈕點擊時出發的事件
			override protected function saveOrUpdateItem():void
			{
                           //將頁面的信息填充到form中
                           Object formObj = fillObject();
                           //拋出事件,並且將Bean傳遞.control通過事件類型對Bean進行不同操作。
                            dispatchEvent(new DetailsSectionEvents(DetailsSectionEvents.SAVE,formObj));
                        }

		]]>
	</mx:Script>

      <pageItem:cme_boxContent>
		<mx:HBox width="100%" paddingRight="22" verticalGap="5" horizontalGap="5">
			//頁面元素繼承並擴展父類的.省略....
		</mx:HBox>	
      </pageItem:cme_boxContent>
	<pageItem:cme_boxButtons>
                //按鈕繼承ButtonItem.mxml.
		<navigation:ButtonItem id="btnDone" javaeye_type="save" click="saveOrUpdateItem();" />	
	 	<navigation:ButtonItem id="btnReset" javaeye_type="reset" click="reset();" />
	</pageItem:cme_boxButtons>

這裏涉及到了繼承和多態。等我辭工後,想仔細認真學習下設計模式,並將他運用到自己的flex工程中...
flex面對對象的編程思想,還有flex那種絢麗的效果.我非常看好和喜歡她!!