【EasyFramework】非常简单易懂的通用大厅框架!!

EasyFramework (原通用大厅框架)

真机视频演示

在线web试玩(无预加载模式)

https://test.t9ai.com/ccc/commonlobby/

文档链接

https://t9ai.com/doc/web/#/683888977/151457623


1.框架特色

*** 上手简单,无需单独import脚本,统一全局管理(类似于cc.框架通过GF.控制)               
*** 修改便捷,全代码驱动绑定创建面板        
*** 简单易懂,采用mvc架构设计                                
*** 功能示例齐全,详细示例及代码教程                                             
*** 代码注释齐全,vscode智能提示跳转                                          
*** 全bundle管理主包资源及子包资源,独立热更管理                                  

2.框架介绍

2.1.主目录

├── _AddContent //添加到项目中的独立内容,内有独立md说明教程
├── _Extend //扩展工具,可自定义一些小脚本 
├── _HotUpdate //热更相关教程及工具,内有独立md说明教程
├── _Native //ios与android原生相关修改文件,如内付费,分享,截屏,横竖屏切换等,内有独立md说明教程
├── _PublishRes //原resources模式下资源管理(用bundle后弃用)
├── _Server //简易服务端搭建脚本http与websocket示例代码,内有独立md说明教程
├── @type //d.ts 说明文件 
├── assets //资源(官方目录)
├── build //构建(官方目录) 
├── easy-framework //框架源码 
├── extensions //扩展包(官方目录) 
├── native //原生打包相关(官方目录)
├── node_modules //node扩展包如:crypto-js,proto等
├── README.md //框架说明

2.2.资源目录

├── assets //资源(官方目录)
│   ├── Acti //活动根目录
│   │   ├── Acti5001 //对应活动编号资源脚本目录
│   │   │   ├── Font //字体
│   │   │   ├── Image //图片
│   │   │   ├── Prefab //预制件
│   │   │   ├── Spine //spine动画文件
│   │   ├── Acti5002 //...
│   │   ├── Acti5003 //...
│   │   ├── Acti5004 //...
│   │   ├── Acti5005 //...
│   │   └── ...
│   ├── AppStartScene //app入场场景
│   │   ├── MainLoading //app入场场景绑定加载脚本
│   ├── MiniSubitem //大厅中的小icon目录
│   │   ├── MiniSubitem_1001 //大厅中游戏对应的小icon动画
│   │   │   ├── Prefab //预制件
│   │   │   ├── Spine //spine动画文件
│   │   ├── MiniSubitem_1002 //...
│   │   ├── MiniSubitem_1003 //...
│   │   ├── MiniSubitem_1004 //...
│   │   └── ...
│   ├── resources //暂只老的热更manifest文件放在此目录(官方目录)
│   ├── Subitems //子游戏根目录
│   │   ├── Subitem_1001 //子游戏1
│   │   │   ├── Font //字体
│   │   │   ├── Image //图片
│   │   │   ├── Prefab //预制件
│   │   │   ├── Spine //spine动画文件
│   │   ├── Subitem_1002 //子游戏2
│   │   ├── Subitem_1003 //子游戏3
│   │   ├── Subitem_1004 //子游戏4
│   │   ├── Subitem_1005 //子游戏5
│   │   ├── Subitem_2001 //子游戏类型2的1号(2开头可配置为竖版)
│   │   └── ...
│   ├── Sys   // 系统打在包里的文件(默认主包内)
│   │   ├── Res //资源
│   │   │   ├── Common //通用资源
│   │   │   │   ├── Font //字体
│   │   │   │   ├── Image //图片
│   │   │   │   ├── Prefab //预制件
│   │   │   │   ├── Spine //spine动画文件
│   │   │   ├── Debug //调试资源
│   │   │   │   ├── Font //字体
│   │   │   │   ├── Image //图片
│   │   │   │   ├── Prefab //预制件
│   │   │   │   ├── Spine //spine动画文件
│   │   │   ├── Loading //加载资源
│   │   │   ├── MainHUD //主页通用上下仪表盘资源
│   │   │   ├── MainPage //主页资源
│   │   │   ├── Setting //设置资源
│   │   │   ├── Subitem //子游戏资源
│   │   │   ├── SubitemHUD //子游戏通用上下仪表盘资源
│   │   │   ├── TipBox //提示框资源
│   │   ├── Src //脚本
│   │   │   ├── View //视图脚本 (对应Res中的绑定视图脚本)
│   │   │   │   ├── Debug //调试相关脚本
│   │   │   │   ├── Loading //加载相关脚本
│   │   │   │   ├── MainHUD //主页hud上下仪表盘脚本
│   │   │   │   ├── MainPage //主页脚本
│   │   │   │   ├── Setting //设置脚本
│   │   │   │   ├── SubitemHUD //子游戏hud上下仪表盘脚本
│   │   │   │   ├── TipBox //提示框脚本
│   │   │   │   └── ...

参考如上assets中的资源结构设计,资源目录结构为大厅类游戏设计,非大厅类游戏同样可以使用,目录介绍:

1.Sys即是System系统目录,一般包里的资源,再里面Res、Src文件夹分别表示资源与脚本,Res再根据功能区分文件夹(如:Common通用、MainHUD 主页仪表盘、MainPage 主页页面、Setting设置、Subitem子游戏通用、SubitemHUD子游戏HUD内容等),功能文件夹内再区分为Font、Images、Prefab、Spine等具体分类文件夹。
2.Subitems 即是需要热更的子游戏内容,即大厅里每个点开的游戏内容。
3.MiniSubitems 子游戏大厅,随时下载随时加载。
4.Acti 即是需要热更的活动内容,如每日任务、每日签到、集邮集卡等。

2.3.框架功能

├── assets //资源(官方目录)
├── ....
├── easy-framework //构建后会打包到assets/main的bundle包里
│   ├── Ctr //控制器
│   │   ├── AudioCtr.ts //音频控制器,功能:将游戏音频分为音乐与音效两类,播放音乐与播放音效,暂停、恢复、停止、自动销毁
│   │   ├── BundleCtr.ts //bundle控制器,检测bundle包资源是否存在,load某个bundle,删除bundle控制器
│   │   ├── CompressionCtr.ts //压缩控制器,压缩文件及解压
│   │   ├── DownloaderCtr.ts //下载控制器,下载文件
│   │   ├── EncryptionCtr.ts //加密控制器,各种加密方式封装,常用ecs,base64,md5加密等
│   │   ├── EventCtr.ts // 事件控制器,初始化注册事件、发射事件、销毁事件
│   │   ├── HotupdateCtr.ts //老热更控制器(官方),设计分为一键检查,一键更新
│   │   ├── LoadingCtr.ts //loading控制器,自动控制遮罩始终只存在一个,例:多条通讯触发时,仅存在一个遮罩,当最后的通讯完成时遮罩自动删除
│   │   ├── LocalDataCtr.ts //存储本地数据控制器,自动加密内容解析json
│   │   ├── LogCtr.ts //输出控制器,用于普通打印、警告、错误颜色识别
│   │   ├── MultipleLanguagesCtr.ts //多国语言控制器 (目前示例添加了ZH、TW、JP、EN 后期可自行扩展添加)
│   │   ├── NativeCtr.ts //原生控制器,调用底层中转
│   │   ├── NetworkCtr.ts //网络控制器,用于http通讯,websocket通讯
│   │   ├── NewHotupdateCtr.ts //新热更控制器,实现主包与子包的独立热更新1.一键检查 2.一键更新 3.断点续传 4.主包与子包独立更新 5.某个子包可随主包发布 6.多线程下载
│   │   ├── ObjectPoolCtr.ts //对象池控制器,主流游戏一般用spine或prefab创建加载动画,为了首次加载卡顿使用对象池控制
│   │   ├── PanelCtr.ts //面板管理控制器,通过设定GD_PanelOrder将游戏UI分为Bottom、Middle、Top、Mask四种层级,每个层级再设置不同前后顺序。3D部分层级,自动回复暂停隐藏面板
│   │   ├── PayCtr.ts //支付控制器,目前已调通ios支付类目,如:购买一次性商品,一次性商品恢复购买,购买消耗品,订阅
│   │   ├── PlatformCtr.ts //平台控制器再封装,防止官方二次修改字段方便维护修改
│   │   ├── PrefabCtr.ts //prefab控制器,一般常用的播放完prefab动画完成回调封装
│   │   ├── RemoteCtr.ts //远程控制器,远程加载图片,远程加载spine
│   │   ├── ResCtr.ts //资源管理控制器,同步异步加载资源
│   │   ├── SceneCtr.ts //场景控制器,大厅游戏一般分为切主场景和切子场景,这里统一管理
│   │   ├── ScreenCtr.ts //屏幕控制器,子游戏若为竖版,横版切为竖版逻辑,刘海屏适配
│   │   ├── ShareCtr.ts //原生等平台分享控制器,目前已调通ios原生,原生代码在项目目录_Native中 
│   │   ├── SingletonCtr.ts //单例控制器
│   │   ├── SpineCtr.ts //spine控制器,常用创建spine,播放动画后回调
│   │   ├── StoreReviewCtr.ts //商店app评分控制器 原生调用商店app对应的评分控制器
│   │   ├── TimeCtr.ts //时间戳控制器,时间显示控制器
│   │   ├── TipBoxCtr.ts //提示框控制器
│   │   ├── Tool //常用工具类,注意都是静态函数,无须getInstance()
│   │   ├── UICtr.ts //UI控制器,如动态改变图片,获取节点名二次封装
│   ├── Extra //扩展
│   │   ├── JsZip //js压缩解压
│   ├── Model //配置
│   │   ├── GD_3DPanelOrder.ts //3d面板层级配置
│   │   ├── GD_Compression.ts //压缩类型
│   │   ├── GD_Config.ts //GameData配置,设计尺寸,安全显示尺寸
│   │   ├── GD_Event.ts //Event枚举
│   │   ├── GD_PanelOrder.ts //2d面板层级配置
│   │   ├── GD_Resources.ts //老的resources管理资源(已废弃)
│   │   ├── GD_URLConfig.ts //url配置
│   └── AppReg.ts //框架引导器

2.4.热更新设计

远程端资源配置结构:(脚本发布后会自动生成在版本号文件夹下)

├── _HotUpdate //热更相关教程及工具,内有独立md说明教程
│   ├── 1.MainBundleMode //cocos官方的主包更新脚本
│   ├── 2.MainAndSubitemMode //新主包与子包独立更新脚本
│   │   ├── Config  
│   │   │   ├── Config.json //对应自动发布配置
│   │   ├── PublishHistory  //版本发布历史目录
│   │   │   ├── IOS  //平台
│   │   │   │   ├── 2024.09.09.11.00.39.429  //版本号,默认日期
│   │   │   │   │   ├── assets  //资源
│   │   │   │   │   │   ├── Acti_5001  //子包活动
│   │   │   │   │   │   │   ├── Acti_5001_Project.manifest  //热更新文件清单
│   │   │   │   │   │   │   ├── Acti_5001_Version.manifest  //热更新版本
│   │   │   │   │   │   │   ├── ...子包Acti_5001资源
│   │   │   │   │   │   ├── Sys  //主包
│   │   │   │   │   │   │   ├── Sys_Project.manifest  
│   │   │   │   │   │   │   ├── Sys_Version.manifest  
│   │   │   │   │   │   │   ├── ...主包资源
│   │   │   │   │   │   ├── Subitem_1001  //子包子项目
│   │   │   │   │   │   │   ├── Subitem_1001_Project.manifest  
│   │   │   │   │   │   │   ├── Subitem_1001_Version.manifest  
│   │   │   │   │   │   │   ├── ...子包Subitem_1001资源
│   │   │   │   │   │   ├── Subitem_1002  //子包子项目
│   │   │   │   │   │   │   ├── Subitem_1002_Project.manifest  
│   │   │   │   │   │   │   ├── Subitem_1002_Version.manifest  
│   │   │   │   │   │   │   ├── ...子包Subitem_1002资源
│   │   │   │   │   │   ├── ...  
│   │   │   │   │   ├── src //脚本
│   │   │   ├── Android  
│   │   │   │   ├── ... //结构同上
│   │   ├── publish_mainAndSubitemBundle.js //自动发布脚本,自动按照config配置发布,“构建”后执行此脚本一键发布  
│   │   └── README_MainAndSubitemModeHotupdate.md //主包子包模式热更使用说明 


发布成功会自动将随主包出去的文件移至如下目录(如Sys为主包,但Subitem_4001也跟随打到主包中):

├── build (官方目录)
│   ├── ios (ios目录)
│   │   ├── data
│   │   │   ├── assets
│   │   │   │   ├── LocalManifest(新热更打在包里的manifest文件-新热更会自动将包内资源存在这里)
│   │   │   │   │   ├── Sys_Project.manifest(主包热更新文件)
│   │   │   │   │   ├── Sys_Version.manifest(主包版本文件)
│   │   │   │   │   ├── Subitem_4001.manifest(子包随主包出去热更新文件)
│   │   │   │   │   └── Subitem_4001.manifest(子包随主包出去热更新版本文件) 

app中存储结构设计:

├── blackjack-remote-asset(可取写目录) 
│   ├── Temp(临时下载缓存目录)
│   │   ├── assets(资源目录)
│   │   │   ├── Sys(主包目录)
│   │   │   │   ├── Sys_Project.manifest(主包热更新文件)
│   │   │   │   ├── Sys_Version.manifest(主包版本文件)
│   │   │   │   └── ....该包的热更文件
│   │   │   ├── Subitem_1001(子包1001目录)
│   │   │   │   ├── Subitem_1001_Project.manifest(Subitem_1001热更新文件)
│   │   │   │   ├── Subitem_1001_Version.manifest(Subitem_1001版本文件)
│   │   │   │   └── ....该包的热更文件
│   │   │   └── .... 其他子包
│   ├── Cache(真实读取目录)
│   │   ├── assets(资源目录)
│   │   │   ├── Sys(主包目录)
│   │   │   │   ├── Sys_Project.manifest(主包热更新文件)
│   │   │   │   ├── Sys_Version.manifest(主包版本文件)
│   │   │   │   └── ....该包的热更文件
│   │   │   ├── Subitem_1001(子包1001目录)
│   │   │   │   ├── Subitem_1001_Project.manifest(Subitem_1001热更新文件)
│   │   │   │   ├── Subitem_1001_Version.manifest(Subitem_1001版本文件)
│   │   │   │   └── ....该包的热更文件
│   │   │   └── .... 其他子包

3.框架教程示例展示

可通过路径/assets/Sys/Src/View/Debug/DebugFramework.ts查看,功能可在网页预览项目中查看如何使用。

网络、动态加载、面板控制、原生调用示例:




事件、音频、缓存池、横竖屏切换示例:

多国语言、下载zip解压、热更示例:



新热更示例:



大厅Demo展示


子游戏内容:

普通2d子弹摇杆追踪


2d+3d世界


横竖屏切换,竖版游戏


其中子项目开源地址在:
https://gitee.com/yeshao2069/CocosCreatorDemos/

大厅框架中综合了几个有代表性的实例,如shader、子弹追踪、裁剪图片、横版切竖版,这里针对大厅做了些许适配修改。

设计架构都免费共享了,可供参考学习。
有需要源码的可在 Cocos Store 中下载。 :grinning:

8赞

mark!!!

通用框架学习

学习学习 :+1:

大佬牛逼666

mark!!!

就喜欢分享开源的大佬

我还以为框架现在开源了

哦,原来浪费表情。好久不做cocos了,只是偶尔回来逛逛摸鱼

v1.2更新内容 2024-2-2

1.增加大量头部注释,删除没用的注释没用的引用保持代码整洁
2.音效ID独立控制某个音效状态
3.增加竖版大厅演示
4.增加免费游戏资源
5.兼容3.8.2
6.微信小游戏平台测试功能基本正常

v1.3更新内容 2024-3-1

1.控制器注释完善
2.框架调用改为通过window.GF来获取,原GF仍可使用
3.添加编写代码时的注释及自动跳转,代码智能提示
4.部分控制器命名修改,更容易理解
5.删除静态调用,改用slt统一简单调用

v1.4更新内容 2024-5-7

1.新增Node2DPanels独立控制2d面板层
2.增加调试边缘框方便适配测试,正式版发布把测试prefab清空即可
3.简化屏幕适配传参
4.调通原生平台与web平台屏幕适配,增加面板贴边处理,新增刘海屏适配
5.hud上下锚点修改,更友好于适配
6.ios平台屏幕旋转新增ios16以上屏幕旋转新写法
7.最新xcode iap引用改用绝对路径,再次调通ios分享、保存图片、内付费
8.升级到3.8.3

v1.5更新内容 2024-7-5

Add:
1.新增加密控制器,base64,xor+base64,aes加密演示,增加npm install crypto-es 加密库 node_modules/crypto-es 
2.新增localDataCtr本地存储控制器,自动解析json存储并返回json, 自动绑定加密功能,绑定字段自动绑定json记录绑定加密方法  
3.新增tipbox增加滑动列表便于文字扩展的显示 
4.新增键盘按钮识别测试调试脚本 DebugKeyCode 通过框架打开的可自动绑定键盘a b c d等按键方便调试 
5.新增进子游戏及返回大厅的动态加载资源页面,显示百分比,加载完毕后瞬间打开,可自行修改Prefab_ResLoading    
6.新增全局化网络通讯loading遮罩,网络通讯会有一个loading动画有且仅同时存在一个,如网络通讯希望先有透明遮罩再隔1s再弹出遮罩可自行修改Prefab_Loading.prefab的表现动画 
7.新增大厅滑动位置的记忆功能    
8.新增多国语言控制器、配置表及示例 
9.新增游戏热更读取自定义配置并调通  删除本地配置 
10.新增当配置了自动隐藏底层面板,该面板打开时将自动隐藏该面板以降低drawcall 
11.新增一键下载热更新,反复热更新测试demo 

Fix: 
1.修改全局调用由window.GF改为GF.AudioCtr...去调用,老写法windows.GF..仍兼容  
2.修改原CallFunc全部改为CallBack,之前老脚本可全局搜索批量替换一下 
3.修正web端CORS policy: No ‘Access-Control-Allow-Origin’ header 无法加载远程图片问题修正 

v1.6更新内容 2024-8-30

Add:
0.升级到3.8.4
1.新增panel控制器“抢占式”面板打开功能 
2.新增一键刷新所有当前panel多国语言的功能,新增bundle模式即跟随包走的多国语言配置,支持{0}{1}{2}占位符 
3.新增下载控制器、压缩控制器,通过url下载zip到本地,本地读取后利用jszip压缩解压压缩包内容并动态取到其中txt文本及图片,添加演示demo 
4.子游戏独立下载功能 
    4.1.热更指定包一键检查  
    4.2.热更指定包一键更新  
    4.3.断点续传  
    4.4.主包与子包独立更新  
    4.5.某个子包可随主包发布  
    4.6一键将版本打到包中 

5.新增了单例控制器管理所有框架中的控制器 
6.新增播放音乐相关在演示中 
7.新增框架控制器key说明,避免压缩代码直接取class的name重名导致覆盖的bug 
8.tool新增常用方法 
9.自动发布也要拷贝src的文件夹与assets文件夹并列 

Fix:
1.md文件介绍修改图片改为文字,后续以文字说明修改为准 
2.为了与框架名字区分,名字改为easy-framework,意思为很容易开发的框架,表示入手简单,独立了框架内容到与asset平级外的文件夹中统一管理 
3.修正订阅付费不支持非数字的bug 
4.修正ios native分享url分享错误的bug 
5.框架控制器改为继承单例类好统一管理 
6.代码重新排版优化 
7.创建资源时isAsync参数改为了isNoAwait,需全局替换一下,为了之后更容易理解异步同步改为 “不需要等待” 默认为false即需要等待,正常都是先进入场景前预加载所需资源,注意编辑器有bug缓存的资源有时会显示未加载(真机原生测试正常) 
8.修正预加载过的资源再初始化仍有延迟的bug   bundle.load 与 bundle.get
9.升级到3.8.4屏幕切换不对的bug  原 screen.on("window-resize", this.resetScreenSize, this);要改为window.addEventListener("resize", this.resetScreenSize.bind(this, "resize"));  
10.修正示例中调用c无效的bug  

v1.7更新内容 2024-10-30

Add:
1.加载bundle时增加不预加载资源  (网页模式,随用随加载,界面ui会逐步出现)
2.新热更下载压缩zip支持,调通 
3.音频增加重复音乐检测 
4.新增辅助小工具,检查大图,压缩图片,删除meta,pdf导图片,重命名文件为有规律的文件名,重置图片大小为appstore的大小,video转图片脚本 

Fixed:
1.修改语法糖,修正vscode 函数this不提示的问题 
2.修正没有读到本地的manifest不能进入对应子游戏的bug,增加提示 
3.app中存储结构设计 目录结构纠正 
4.android及ios完全调通热更并测试

v1.8更新内容 2024-12-21

Add:
1.新增_Extend/ExcelToJson  导表工具,可导出excel分表(标签表)
2.新增_Extend/linkProject.js 软链接新项目脚本,n个项目公用一套框架脚本,多项目框架脚本共用方案
3.新增_Extend/renameToLowerCase.js 某个根目录文件夹下的所有文件首字母改为小写,目前项目是unity命名法,文件夹与脚本名首字母都是大写,如果习惯觉得改成小写方便,可通过脚本改为小写
4.新增竖版调试分辨率预览边界框
5.教程新增“项目内全局管理参考”,优化文件夹结构,新增@Reg表示注入全局变量管理文件方便理解增加
6.资源加载增加assignPreLoadTypeList只预加载指定的类型提高预加载速度
7.新增后台自动下载子游戏说明 
8.新增子游戏基类继承设计知识库
9.新增本地key数据控制
10.新增等待队列控制器,用于控制多个任务执行。之前的单包下载统一改为多包中分支下载,加入各种阶段情况下下载失败的回调
11.新热更增加多线程多包检测,多包异步下载功能
12.新增清理Cache文件夹包manifest中不存在文件的接口
13.音频控制器新增本地存储音乐音效开关
14.热更增加下载失败重试次数,重试20次自动返回失败
15.增加热更路径打包到main.js中的hook插件,新热更增加对loading场景页面等支持

Fixed:
1.继续完善panelctr中注释示例
2.去掉@type文件,改为都在easy-framework文件夹中
3.优化目录结构,去除Res与Src直接将资源放入bundle文件夹中方便理解
4.修正panelOn时promise嵌套延迟的bug,有多国语言panelon时,后面bundle获取为null的bug,多国语言改为本地存储
5.修正bundleLoad指定preload类型的报错的bug
6.新热更增加没网返回null判断
7.网络失败去除遮罩,资源管理器sp被剔除后的支持
8.热更打包优化显示 

已更新至1.8,补充下更新内容记录

1赞
框架在线web预览

https://t9ai.com/ccc/easyframework/

框架文档链接(架构免费分享)

https://www.t9ai.com/doc/web/#/683888977/151457616

框架实战项目1:“烦恼解决大师” 最新用框架做的新上架的三端同步大厅demo

均已上架,功能测试正常

1、ios平台链接:

https://apps.apple.com/cn/app/trouble-solver/id6738347198

2、安卓googleplay链接:

https://play.google.com/store/apps/details?id=com.rutangnetwork.fannaojiejuedashi

3、微信小程序:

该app用到技术与详细介绍文档:

https://www.t9ai.com/doc/web/#/683888977/151457666

需要此大厅框架的可点击购买(花钱买时间,踩了不少坑,大佬看看架构自己敲敲也没问题 :grinning:

->->>>>>>> Cocos Store

mark 只能说一句牛批