记录第一次在egret项目中使用Puremvc

这几天跟着另一个前端在做一个小游戏，使用的是egret引擎和puremvc框架，这对于我来说还是个比较大的突破吧，特此记录下。

因为在此项目中真是的用到了mvc及面向对象编程，值得学习

---

记录第一次在egret项目中使用Puremvc：

主开发说他在使用puremvc框架时对puremvc框架的使用进行了一些改良

程序中整个puremvc框架的使用思路：

1. View层自己来操作自己，Mediator用来接收和处理通知，在整个框架中任何地方都可以发布全局通知（通过facade单例的 sendNotification 方法），Model只关心数据，即Model层只与程序中所需要的数据层来打交道

具体使用：

1.在egret项目中引入puremvc框架，具体引入方法

Puremvc对应typescript版本的下载地址：puremvc-typescript-standard-framework点击下载，

Egret项目中如需引入puremvc将bin文件夹内三个文件复制到项目中，具体构建第三方库方法可看下官方文档，

2.新建facade单例，具体代码如下：

class AppFacade extends puremvc.Facade implements puremvc.IFacade {

    public constructor() {
        super();
    }

    public static STARTUP: string = "startup";
    //提供静态函数，供外界调用
    public static getInstance(): AppFacade {
        if(puremvc.Facade.instance == null)
        {
            puremvc.Facade.instance = new AppFacade();
        }
        return <AppFacade><any>(puremvc.Facade.instance);
    }

    //该函数 是 该类的初始化函数，创建改类实例后会自动调用改函数
    //注册控制器
    public initializeController(): void {
        super.initializeController();
        RegisterCommond.Register();
    }
    //注册数据模型
    public initializeModel():void
    {
        super.initializeModel();
        RegisterModel.init();

    }
    //注册View视图
    public initializeView():void
    {
        super.initializeView();
        RegisterView.Register();
    }
    public initializeFacade():void
    {
        super.initializeFacade();
    }

}

Facade的类是PureMVC的核心类，负责管理调度PureMVC中的成员交互和运作。一般来说，一个应用中创建一个facade对象就够了。PureMVC中主要有三个角色：Mediator、Command以及Proxy。这三个角色分别对应着我们通常所说的MVC思想中的V（视图）、C（控制器）、M（数据管理器）。它们只有被注册到facade类中才能运作，才有意义。通过调用facade对象的registerMediator、registerCommand或registerProxy方 法可以将它们注册到facade对象中去。一旦被注册到facade对象中去了之后，享用同一注册源的Mediator、Command以及Proxy对 象就可以通过notification（通知）进行彼此之间的通讯，而事件只有事件派发者本人或其显示列表的父容器才能侦听到。使用notification进行通讯是PureMVC最大的便利之处。在一个Mediator、Command或者Proxy对象中使用sendNotification方法可以派发一个notification通知：

sendNotification("MyNotification");

该 方法的首个参数代表该条notification的名字，确保notification的名字的唯一性是减少意外错误的最佳保证。如果你愿意，你可以为该 方法传入第二个参数作为该条notification所携带的数据，可以是一个String, int或者是Object、Array等复杂对象。

3.注册Mediator

class BaseMediator extends puremvc.Mediator{
    public autoClose:Boolean=false;
    private _panelCls:any;
    public body:SkinCell;
    public constructor(mediatorName) {
        super(mediatorName);
    }
    public onRegister(): void {

    }
    public initPanel(): void {

    }
    public get listcloseNotification(): string[]
    {
        return [];
    }
    public get listopenNotification(): string[] {
        return [];
    }

    public listNotificationInterests():string[]
    {
        return [];
    }
    public isOpenNotification(name:string):boolean
    {
        return this.listopenNotification.indexOf(name) != -1;
    }
    public isCloseNotification(name: string): boolean{
        return this.listcloseNotification.indexOf(name) != -1;
    }
    public hasOpen(notification: puremvc.INotification = null): boolean{
        return true;
    }

    public hasClose(notification: puremvc.INotification = null): boolean{
        return true;
    }
    public createUI(notification:puremvc.INotification = null):void{

    }
    public addBody(): void {
        if(this.body && !this.body.parent) {
            GameLayerManager.gameLayer().sceneLayer.addChild(this.body);
        }
    }
    public openPanel(notification:puremvc.INotification = null):void{
        this.createUI(notification);
        this.addBody();
    }
    public closePanel(notification: puremvc.INotification = null): void {
        this.removeBody();
        this.closeMediator(notification);
    }

    public removeBody():void
    {
        if(this.body) {
            this.body.cleanUp();
            this.body=null;
        }
    }
    public handleNotification(notification: puremvc.INotification):void
    {
    }
    public closeMediator(notification):void
    {
        if(this.facade.hasMediator(this.mediatorName)) {
            this.facade.removeMediator(this.mediatorName);
        }
    }
    public resizeHandler():void{
        if(this.body)
        {
            this.body.resizeHandler();
        }
    }
}

及Mediator接收处理通知

public handleNotification(notification:puremvc.INotification): void {
        var name = notification.getName();
        switch(name){
            case StoryMNotify.addNpcdialog:
                (this.body as NpcDialogUI).addDialogView(notification.getBody());
                console.trace();
                break;
            case StoryMNotify.clearNpcdialog:
                (this.body as NpcDialogUI).clearDialogs();
                break;
            case GameNotify.canvasResizeHandler:
                this.resizeHandler();
                break;
        }
    }

PureMvc介绍

参考文章：

http://www.cnblogs.com/ribavnu/p/3874748.html

http://blog.csdn.net/dily3825002/article/details/7333514

http://blog.csdn.net/lyh916/article/details/50058207

---

首先来一张puremvc的经典架构图，起初看起来很复杂，后来才知道其实它只是比一般的mvc框架在架构上多了一个facade实例

Pure MVC 初识

pureMVC框架的目标很明确，即把程序分为低耦合的三层Model、View和Controller，这三部分有三个单例模式类管理，分别是Model、veiw和controller。三者是核心层或说核心角色。
pureMVC中还有一个单例模式类——Facade，Facade提供了与核心层通信的唯一接口，以简化开发程度。它负责初始化核心层，并访问他们的Public方法。Facade是三者的经纪人。该类可以当成抽象类，永远不要被实例化，针对具体程序编写Facade的子类，添加或重写Facade的方法来实现具体应用。

pureMVC的通信是使用观察者模式以一种松耦合方式实现的。

Model保存对Proxy对象的引用，Proxy负责操作数据模型，与远程服务通信存取数据。

View保存对Mediator对象的引用，由Mediator对象来操作具体的视图组件。

Controller保存所有Command的映射，Command类是无状态的，只有在需要时创建。

　　Model保存了对Proxy对象的引用，Proxy负责操作数据模型（调用Json接收相应面板的Mediator中发送的Notification，连接后台接收数据存入相应Vo），与远程服务通信存取数据。model里面一般放着一个view向对应的Proxy和Vo。View保存对Mediator对象的引用。用Mediator对象操作具体的视图组件，包括：显示视图添加事件监听，发送或接收Notification，直接改变组件的状态。

　　Controller保存所有Command的映射。command类是无状态的，只在需要时创建。

　　Command可以获取proxy对象并与之交互，发送Notification，执行其他的command经常用于复杂的或系统范围操作，如应用程序的启动和关闭，应用程序业务逻辑应该在这里实现。

　　Facade类应用了单例模式，负责初始化核心层，并能访问它们的Public方法。

　　Proxy、Mediator和Command可以通过创建的Facade类来相互访问通信。

　　PureMvc通信不采用falsh的Event/EvenDispatch，它是使用观察者模式以以一种松耦合的方式来实现。

　　当View注册了Mediator时，Mediator的listNotifitions的方法会被调用，以数组的形式返回Mediator对象所关心的所有Notification。

proxy发送但不接收Notification

　　Proxy从远程服务器接收到数据，发送Notification告诉系统，或当Proxy数据被更新时发送Notification告诉系统。

　　Facade类应被看做抽象类，永远不要被直接实例化。针对具体应用程序编写具体Facade的子类，添加或重写Facade的方法来实现具体应用。