Cairngorm初学者入门教程 第六节--Cairngorm中Command利用Delegate与Service连接

 

在上一节,我们利用FrontController 去映射 Event与Command

在这一节我们主要针对Command这部分动作做介紹。在RIA应用程序中,不可或缺的部份就是跟后台服务器连接进行数据传递。Command通过Delegate去做Services的部份(包含Remoting,WebServices,…等)

  • Command: 操作Cairngorm Business以及呼叫Cairngorm Delegates,这些回传所取得的资料Command会再将它更新到Model Locator
  • Delegate: 由Command所产生,将远程呼叫(RPC:remote procedure calls[HTTP, Web Services, etc])实例化,并将结果传回给Command。
  • Service:用来定义连接Server端的呼叫(RPC:remote procedure calls[HTTP, Web Services, etc]),来获取远程数据。 
    在Delegate中我们会作一个call service的部份,而Services相关的定义与设定,就纪录在Service Locator。
  • 延续上一个项目,我们修改LoginCommand的部份要通过Delegate去做Remoting,呼叫Server端 login function,去数据库查看判断账号密码是否正确。

    所以我们先在项目中新增business文件夹。

    Cairngorm初学者入门教程 第六节--Cairngorm中Command利用Delegate与Service连接

    新增两个文件,一个是Service.mxml组件。用来定义纪录可以使用的Services。

    因为组件的类型不是內建,所以先随便选一个再改mxml的內容
    这里示范的是使用搭配.NET Remoting的Freeware ” FluorineFx “,可以参考這裡

    代码如下:

     

    <?xml version="1.0" encoding="utf-8"?>
    <cairngorm:ServiceLocator
     xmlns:mx="http://www.adobe.com/2006/mxml"
     xmlns:cairngorm="com.adobe.cairngorm.business.*">
     
        <!-- Login Service -->
        <mx:RemoteObject
         id="Remoting_Services"
         source="Remoting.Services"
         destination="fluorine"
         showBusyCursor="true">
            <mx:method name="login" />
        </mx:RemoteObject>   
     
    </cairngorm:ServiceLocator>

     另一个是LoginDelegate.as类,用来连接Service,并将取得的资料回传给Command。

     

    代码如下:

     

    package org.rianotes.CairngormSample.business
    
    {
    
        import com.adobe.cairngorm.business.ServiceLocator;
    
      
    
        import mx.rpc.IResponder;
    
      
    
        import org.rianotes.CairngormSample.vo.User;
    
      
    
        public class LoginDelegate {
    
      
    
            private var responder:IResponder;
    
            private var service:Object;
    
      
    
            public function LoginDelegate(responder:IResponder) {
    
      
    
                this.responder = responder;
    
      
    
                //透過ServiceLocator取得連接Service的方式
    
                this.service = ServiceLocator.getInstance().getRemoteObject("Remoting_Services");
    
      
    
            }
    
      
    
            public function login(loginAttempt:User):void{
    
                //這部份要跟Server端Remoting Service 的名字相同傳入值型態也要相同
    
                var call:Object = service.login(loginAttempt);
    
      
    
                //處理伺服器的傳回值
    
                call.addResponder( responder );
    
      
    
            }
    
      
    
        }
    
    }
    

     

     为了传送账号和密码,所以也要针对Value object作修改

    User-Value object

    package org.rianotes.CairngormSample.vo
    
    {
    
        //.NET 那邊User.cs的 namespace
    
        [RemoteClass(alias="Remoting.Objects.User")]
    
        public class User
    
        {
    
            public var UserID:String;
    
            public var Password:String;
    
            public var Email:String;
    
      
    
            public function User(){
    
      
    
            }
    
      
    
        }
    
    }
     然后在LoginCommand中加入Responder要用到的result,fault function

     

    代码如下:

    package org.rianotes.CairngormSample.commands
    
    {
    
        import com.adobe.cairngorm.commands.ICommand;
    
        import com.adobe.cairngorm.control.CairngormEvent;
    
      
    
        import mx.controls.Alert;
    
        import mx.rpc.IResponder;
    
      
    
        import org.rianotes.CairngormSample.business.LoginDelegate;
    
        import org.rianotes.CairngormSample.events.LoginEvent;
    
        import org.rianotes.CairngormSample.model.ViewModelLocator;
    
      
    
        //加入IResponder 的Interfac才會呼叫result,falut ↓↓↓           
    
        public class LoginCommand implements ICommand , IResponder{
    
      
    
            public var model:ViewModelLocator = ViewModelLocator.getInstance();
    
      
    
            public function LoginCommand(){
    
      
    
            }
    
      
    
            //ICommand Interface function
    
            public function execute(event:CairngormEvent):void{
    
      
    
                var loginEvent:LoginEvent = event as LoginEvent;
    
          
    
                var delegate:LoginDelegate = new LoginDelegate(this);
    
                delegate.login(loginEvent.loginAttempt);
    
      
    
            }
    
      
    
            //delegate.login 成功取得回傳時做的function
    
            public function result( event :Object):void{
    
                if(event.result == true)
    
                {
    
                    model.workflowState = ViewModelLocator.MAIN_SCREEN;
    
                }else
    
                {
    
                    mx.controls.Alert.show("請確認帳號密碼是否正確!?");
    
                }
    
            }
    
      
    
            //delegate.login 失敗時做的function
    
            public function fault( event :Object):void{
    
                trace("連線錯誤")
    
            }
    
        }
    
    }
    

     LoginView.mxml也要做部分修改,代码如下:

    <?xml version="1.0" encoding="utf-8"?>
    <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"
     horizontalAlign="right" xmlns:components="org.rianotes.CairngormSample.view.components.*">
        <mx:Script>
            <![CDATA[
                import org.rianotes.CairngormSample.vo.User;
                import org.rianotes.CairngormSample.events.LoginEvent;
                import org.rianotes.CairngormSample.model.ViewModelLocator;
                [Bindable]
                private var model:ViewModelLocator = ViewModelLocator.getInstance();
     
                private function login(e:MouseEvent):void{
                    var user:User = new User();
                    user.UserID = ti_UserID.text;
                    user.Password = ti_Password.text;
     
                    var loginEvent:LoginEvent = new LoginEvent(user);
     
                    //發送Login Event
                    loginEvent.dispatch();    
                }
     
            ]]>
        </mx:Script>
        <mx:Form borderStyle="solid" width="100%">
            <mx:FormItem label="UserID :" width="100%">
                <mx:TextInput id="ti_UserID" width="100%"/>
            </mx:FormItem>
     
            <mx:FormItem label="Password: " width="100%">
                <mx:TextInput id="ti_Password" width="100%"/>
            </mx:FormItem>
        </mx:Form>
    
        <mx:Button label="Login" click="login(event)" />
    </mx:VBox>
      最后我们在Main.mxml中加入Service

    代码如下:

    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application 
     xmlns:mx="http://www.adobe.com/2006/mxml" 
     xmlns:view="org.rianotes.CairngormSample.view.*"
     layout="absolute" xmlns:control="org.rianotes.CairngormSample.control.*" xmlns:business="org.rianotes.CairngormSample.business.*">
     
        <mx:Script>
            <![CDATA[
                import org.rianotes.CairngormSample.model.ViewModelLocator;
                [Bindable]
                private var model:ViewModelLocator = ViewModelLocator.getInstance();
            ]]>
        </mx:Script>
     
        <!--Cairngorm FrontController :讓app中擁有SampleController-->
        <control:SampleController id="controller" />
     
        <!--Cairngorm Services-->
        <business:Services id="services" />
     
        <mx:ViewStack id="vsMain" width="100%" height="100%"
         selectedIndex="{model.workflowState}">  
     
            <!--第0個View-->
            <view:LoginView />
     
            <!--第1個View-->
            <view:MainView />
        </mx:ViewStack> 
    </mx:Application>
     

     

    你可能感兴趣的:(应用服务器,xml,Web,.net,Adobe)