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

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

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
主站蜘蛛池模板: 亚洲XXX午休国产熟女屁 | 青草青视频 | 蜜桃影像传媒推广 | 卫生间被教官做好爽HH视频 | 男人女人日皮视频 | 久久无码人妻AV精品一区 | 王晶经典三级 | 国产精品成人免费观看 | 青青青草免费 | 跪在老师脚下吃丝袜脚 | 华人亚洲欧美精品国产 | 精品国产人成亚洲区 | 天码毛片一区二区三区入口 | 极端 成熟 性别 视频 | 嫩草影院地址一地址二 | 男人香蕉好大好爽视频 | 欧美男男xxx激情做受 | 色综合久久日韩国产 | 男人曰女人 | 免费观看欧美成人h | 国产高清视频网站 | 2018高清国产一道国产 | 成人男女网免费 | 日韩精品免费一区二区三区 | 精品久久久久亚洲 | 精品一久久香蕉国产线看播放 | 亚洲日韩男人网在线 | 草草在线影院 | 四虎国产精品免费入口 | 精品一区二区三区五区六区七区 | 欧美性一级交视频 | 午夜影院c绿象 | 欧美成人aletta ocean | 天天做天天爱天天爽综合网 | 99精品观看 | 日韩亚洲一区中文字幕在线 | 99久久国产亚洲综合精品 | 欧美一区二区不卡视频 | 国产自拍偷拍自拍 | 91插插插插| 1314酒色|