一区二区三区在线-一区二区三区亚洲视频-一区二区三区亚洲-一区二区三区午夜-一区二区三区四区在线视频-一区二区三区四区在线免费观看

服務器之家:專注于服務器技術及軟件下載分享
分類導航

node.js|vue.js|jquery|angularjs|React|json|js教程|

服務器之家 - 編程語言 - JavaScript - js教程 - 詳解CocosCreator MVC架構

詳解CocosCreator MVC架構

2022-03-03 16:51houjia159 js教程

這篇文章主要介紹了CocosCreator MVC架構,同學們在制作游戲過程中,盡量使用一些架構,會避免很多問題

概述

這一篇將介紹在游戲客戶端常用的架構MVC架構。一個游戲的MVC如下劃分:

M:1)單例全局的數據中心World,所有游戲模塊的數據在World中有入口,2)各個模塊自己的數據結構。

V:1)通過creator預制體制作的UI界面、場景,2)各個界面顯示邏輯的ViewCtrl

C:1)全局的MainCtrl,2)各個模塊的業務邏輯類ModuleCtrl

具體模塊

先介紹M部分。由于一個模塊的數據,在其他模塊也有訪問的需求,例如好友模塊,在聊天的時候也需要訪問,在排行榜里需要訪問。數據應該有一個單例全局的數據中心類World,所有游戲模塊的數據類在World中有入口。這些數據可以在玩家登錄后從服務器獲取并設置。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
export class World {
    private static instance: World = null;
 
    private _test: TestData = null;
 
    /**
     * 單例模式
     */
    private constructor() {
 
    }
 
    /**
     * 獲取實例
     */
    public static get inst(): World {
        if (!World.instance) {
            World.instance = new World();
        }
 
        return World.instance;
    }
 
    // FOR TEST
    public set test(val: TestData) {
        this._test = val;
    }
 
    public get test(): TestData {
        return this._test;
    }
}

這樣模塊間可以獨立設計自己的數據結構,通過發送消息請求對應模塊的ModuleCtrl更改,通過World讀取。

詳解CocosCreator MVC架構

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
export class TestData {
    private _text: string = null;
 
    public constructor() {
 
    }
 
    public set text(val: string) {
        this._text = val;
    }
 
    public get text(): string {
        return this._text;
    }
}

數據的更新時可以派發消息,界面可以監聽消息做刷新。

下面介紹界面和腳本代碼的關聯。前面篇章中介紹過,cocos creator是基于組件模式。我將每個ui界面都做成一個預制體,每個預制體都可以添加一個腳本組件,用于控制這個界面的顯示邏輯。

詳解CocosCreator MVC架構

詳解CocosCreator MVC架構

在彈窗管理里提到我設計了一個繼承cc.Component的類叫ViewCtrl,所有界面的顯示邏輯類都繼承ViewCtrl,并添加到對應的界面預制體。前面提到數據更新時會派發消息,ViewCtrl監聽數據更新消息,刷新關聯的界面。

?
1
2
3
4
5
const {ccclass, property} = cc._decorator;
 
@ccclass
export default class TestViewCtrl extends ViewCtrl {
}

ViewCtrl只處理界面的顯示邏輯,不處理數據業務邏輯,模塊的數據業務邏輯由該模塊的ModuleCtrl處理。ViewCtrl響應用戶操作,派發消息,ModuleCtrl監聽消息處理。大部分模塊的ModuleCtrl主要做網絡通信,和對本模塊緩存數據的修改。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
export class TestCtrl {
 
    public constructor() {
 
    }
 
    public init(): void {}
 
    public start(): void {
        NotifyCenter.addListener(MSG_TEST_HTTP, (src: any, data: any) => {
            this.testHttp();
        }, this);
    }
 
    public testHttp(): void {
        let data = {
            mod: 1, // 模塊
            cmd: 1, // 命令
        }
 
        let params: HttpReq = {
            path: "",
            method: HTTP_METHOD_GET
        }
 
        MainCtrl.inst.http.sendData(data, params, (data: NetData) => {
            World.inst.test = new TestData();
            World.inst.test.text = "123";
        }, (code: number, reason: string) => {});
    }
}

前面提到,C層還有一個全局單例的MainCtrl。該類主要負責模塊注冊、提供全局的操作接口(例如界面/場景的顯隱)、網絡通信處理。

以上就是詳解CocosCreator MVC架構的詳細內容,更多關于CocosCreator MVC架構的資料請關注服務器之家其它相關文章!

原文鏈接:https://blog.csdn.net/houjia159/article/details/108450381

延伸 · 閱讀

精彩推薦
  • js教程arcgis.js控制地圖地體的顯示范圍超出區域自動彈回(實現思路)

    arcgis.js控制地圖地體的顯示范圍超出區域自動彈回(實現思路)

    這篇文章主要介紹了arcgis.js控制地圖地體的顯示范圍超出區域自動彈回,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借...

    碼尚10562022-01-11
  • js教程js實現簡單放大鏡特效

    js實現簡單放大鏡特效

    這篇文章主要為大家詳細介紹了js實現簡單放大鏡特效,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    一個21歲的老同志9612022-02-13
  • js教程JavaScript實現瀑布流布局的3種方式

    JavaScript實現瀑布流布局的3種方式

    這篇文章主要為大家詳細介紹了JavaScript實現瀑布流布局的3種方式,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    杏子_10247432021-12-20
  • js教程如何在CocosCreator里畫個炫酷的雷達圖

    如何在CocosCreator里畫個炫酷的雷達圖

    這篇文章主要介紹了如何在CocosCreator里畫個炫酷的雷達圖,對Graphics感興趣的同學,一定要看看,并且把代碼實踐一下...

    文弱書生陳皮皮8362022-03-03
  • js教程原生js實現星星閃爍效果

    原生js實現星星閃爍效果

    這篇文章主要為大家詳細介紹了原生js實現星星閃爍效果,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    會做飯的技術男11242022-02-12
  • js教程分享12個Webpack中常用的Loader(小結)

    分享12個Webpack中常用的Loader(小結)

    這篇文章主要介紹了分享12個Webpack中常用的Loader(小結),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友...

    蛙人7852022-02-20
  • js教程原生js實現自定義難度的掃雷游戲

    原生js實現自定義難度的掃雷游戲

    這篇文章主要為大家詳細介紹了原生js實現自定義難度的掃雷游戲,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    清歡灬6532022-01-06
  • js教程JavaScript實現H5接金幣功能(實例代碼)

    JavaScript實現H5接金幣功能(實例代碼)

    這篇文章主要介紹了JavaScript實現H5接金幣功能,本文分步驟通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友...

    AloneSundy4312022-01-22
主站蜘蛛池模板: 亚洲情欲网 | 91在线亚洲精品一区 | 国产偷啪视频一区 | 久久国产乱子伦精品免费不卡 | yellow视频在线观看 | 黑人群性xxx| 2012手机在线中文字幕 | 日韩av线观看 | 失禁尿丝袜vk | 男同巨黄gay小说好爽 | 欧美一区欧美二区 | 亚洲国产第一区二区香蕉日日 | 桃子视频www | 暖暖日本在线观看免费 | 青青青国产手机在线播放 | 毛片免费在线视频 | 国产欧美va欧美va香蕉在线观看 | 91久久青青青国产免费 | 色999| 黑白配高清hd在线视频 | a级毛片毛片免费很很综合 a级黄色视屏 | 国产男女乱淫真视频全程播放 | 蜜臀91| 欧美日韩一区二区三在线 | 99久久精品免费看国产高清 | 福利视频一区青娱 | 青草社区视频 | 精品成人片深夜 | s8sp加密路线和免费路线首页 | 99这里只有精品视频 | 特级一级全黄毛片免费 | boobsmilking流奶水 | 啪啪免费网址 | 99热久久这里只有精品23 | 色综合97天天综合网 | 奇米视频7777 | 69成人影院| 欧美精品一区二区三区久久 | 91桃色网站| 日韩一区二区三区四区区区 | 性一交一无一伦一精一品 |