flex Cairngorm 例子

1.   View(主界面,或调用界面):mxml文件
       <?xml version="1.0" encoding="utf-8"?>
       <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml "
                xmlns:control="CairngormDemo.business.control.*">               //  注意这个导入不能少

       <mx:Script>
       <![CDATA[
                import CairngormDemo.business.events.LoginEvent;
                import CairngormDemo.vo.UserVO;
                import CairngormDemo.model.LoginModelLocator;
  
                import mx.controls.Alert;
                import com.adobe.cairngorm.control.CairngormEventDispatcher;
   
                private function LoginHandle():void {
                       if (this.username.text.length == 0 || this.password.text == null){
                               Alert.show("用户名不能为空!","错误");
                       } else if (this.password.text.length == 0 || this.password.text == null){
                               Alert.show("密码不能为空!","错误");
                       } else {
                              var user:UserVO = new UserVO();
                              user.username = this.username.text;
                              user.password = this.password.text;
   
                              var ev:LoginEvent = new LoginEvent(user);                       //  触发事件(有一个参数)
                              CairngormEventDispatcher.getInstance().dispatchEvent(ev);            //  通过Cairngorm的事件跳转
                       }
                }
            ]]>
       </mx:Script>
       <control:LoginControl id="front"/>                 // 这个也不能少,跟最上面的那个导入的包一致
 
       <mx:Panel width="350" height="250" layout="absolute" horizontalCenter="25" verticalCenter="18" fontSize="13">
                <mx:Label x="39" y="25" text="用户名:"/>
                <mx:Label x="39" y="73" text="密 码:"/>
                <mx:TextInput x="119" y="23" id="username"/>
                <mx:TextInput x="119" y="71" id="password" displayAsPassword="true"/>
 
               <mx:Button x="39" y="121" label="登录" fontSize="12" click="LoginHandle()"/>
       </mx:Panel>
       </mx:Application>

       2.  当通过CairngormEventDispatcher.getInstance().dispatchEvent(ev); 时间分发后,由Fornt Controller进行捕获,并讲这个事件与对应处理的命令进行映射,代码如下:
       package CairngormDemo.business.control{

               import com.adobe.cairngorm.control.FrontController;
               import CairngormDemo.business.commands.LoginCommand;
               import CairngormDemo.business.events.LoginEvent;
 
               public class LoginControl extends FrontController {              //  继承于ForntController
                      public function LoginControl(){
                             super();
                             addCommand(LoginEvent.LOGIN_EVENT,LoginCommand);   // 通过addCommand方法映射
                      }
              }
       }
 
       3.   监听登录的事件,代码如下:
       package CairngormDemo.business.events {

                import CairngormDemo.vo.UserVO;
                import com.adobe.cairngorm.control.CairngormEvent;

                public class LoginEvent extends CairngormEvent {              //  注意不是继承一般的Event事件
                       public static const LOGIN_EVENT:String="LoginEvent";
                       public var user:UserVO = null;
 
                       public function LoginEvent(user:UserVO) {
                             super(LOGIN_EVENT);
                             this.user = user;                    //  保存参数
                       }
                }
       }
 
       4.   每个事件对应一个命令,代码如下:
      package CairngormDemo.business.commands {
              import CairngormDemo.business.delegates.UserDelegate;
              import CairngormDemo.business.events.LoginEvent;
 
              import com.adobe.cairngorm.commands.Command;
              import com.adobe.cairngorm.control.CairngormEvent;
              import mx.rpc.IResponder;
 
              public class LoginCommand implements Command, IResponder {
                     public function execute (event:CairngormEvent ):void{             //  通过这个方法接受事件
  
                            var userDelegate:UserDelegate = new UserDelegate(this);   // 委托给UserDelegate 处理具体
                            var loginEvent:LoginEvent = event as LoginEvent;
                            userDelegate.Login(loginEvent.user);         //  调用委托中的方法,这里有一个参数
                     }
 
                     // 返回的结果进行处理   
                    public function result(data:Object):void{
                            var result:String=data.toString();
                            if(result=="OK"){   
                                   Alert.show("登录成功!");
                            } else {   
                                   Alert.show("登录失败!");
                            }   
                    }   
       
                    //  处理过程出错时的处理   
                   public function fault(info:Object):void{   
                           Alert.show(info+"");   
                   }   
              }
      }
      注:上面的代码是在与后台进行交互的时候需要委托处理,在不需要与后台交互时,直接使用execute方法进行处理业务。
 
      5.  代理主要是通过Services来跟后台交互,此处只是简单的处理了一下,如下:
      package CairngormDemo.business.delegates {
             import mx.rpc.IResponder;
             import CairngormDemo.model.LoginModelLocator;
             import CairngormDemo.vo.UserVO;
 
             public class UserDelegate {
 
                    private var responder:IResponder;
 
                   public function UserDelegate(responder:IResponder ) {
                          this.responder = responder;  
                   }
 
                   public function Login(user:UserVO):void {          //  获取事件传递的参数,然后进行简单的验证
                         var result:Object;
                         if (user.username=="lzc" && user.password=="123"){   
                                result="OK";   
                         } else {   
                                result="Fail"   
                         }   
                         responder.result(result);
                   }
             }
      }
     
      6.  剩下一个VO类了,只是一个简单的类,存放了用户名、密码两个属性。
      package CairngormDemo.vo {
             public class UserVO {
                    public var username:String;
                    public var password:String;
             }
      }
 
      7.  除了上面讲述的,还剩下一些这个列子没有用到,比如:ModelCrontal,它是一个单例模式,保证系统中只有一个类的实例,节省了内存资源。此外,它还保存了将在系统用到的一些结构,比如:存放临时数据的实体等等。
     package CairngormDemo.model {
            import com.adobe.cairngorm.model.ModelLocator;
            import CairngormDemo.vo.UserVO;
 
            [Bindable]
            public class LoginModelLocator implements ModelLocator {
                   private static var loginModelLocator:LoginModelLocator;         //  私有
 
                   public static function getInstance():LoginModelLocator {        //  单例模式
                          if (loginModelLocator == null) {
                                  loginModelLocator = new LoginModelLocator();
                         }
                         return loginModelLocator;
                   }
 
                   public var NowUser:UserVO = new UserVO();     //  用于保存当前登录用户信息的变量
            }
     }      

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值