oops Framwork creator游戏开发框架

环境： Mac

oops Framework

该框架是由gdflas编写，基于cocosCreator 3.x 而实现的开源游戏框架。特点：

• 框架通过插件方式提供，与项目相分离，方便不同版本平滑升级
• 内置模块低耦合， 可根据需要进行删减， 以适应不同类型的游戏
• 封装了常用的功能库，支持动画状态机，行为树等
• 支持ECS， MVVM框架
• 支持屏幕适配，脚本模版创建，Excel的解析，ProtoBuf等

作者提供了两个项目工程:

• oops-framework oops项目实例工程， 可用于学习和研究框架的功能相关
• oops-game-kit oops的游戏开发模版， 可用于开发微信小游戏等项目

前者用于学习和研究，后者用于开发，方便快捷。该框架通过插件的方式提供， 主要有：

• oops-plugin-framework 游戏框架插件
• oops-plugin-hot-update 热更新插件
• oops-plugin-excel-to-json Excel转Json的插件
• oops-plugin-bundle AB包资源路径管理插件

作者针对于oops-framework的学习，提供了很多的资料参考：

哔哩视频教程-dgflash

CSDN博客-dgflash

cocos论坛-dgflash

cocosCreator商城搜索oops也可以找到

感谢作者将该框架开源分享给更多的人使用。

项目安装

以项目实例工程: oops-framework 为例：

1. 打开Gitee的项目工程： oops-framework

2. 复制克隆/下载下的链接， 打开终端命令，项目克隆：

git clone https://gitee.com/dgflash/oops-framework.git

3. 项目下载成功后，先不要通过cocosCreator项目编译器打开项目， 因为项目的主体需要插件的支持， 直接打开，会有各种各样的错误。

4. 终端命令进入到oops-framework的项目目录中， 先执行update-oops-plugin-framework的命令， 用于框架插件的下载：

./update-oops-plugin-framework.sh 

// 如果命令提示错误，类似如下：
// -bash: ./update-oops-plugin-bundle: No such file or directory
// 可以增加 sudo ，它会提示你输入登录密码
sudo ./update-oops-plugin-framework.sh 

// 如果使用sudo后，报错：command not found，那就再运行下命令
chmod u+x update-oops-plugin-framework.sh
sudo ./update-oops-plugin-framework.sh

插件下载成功，会放到项目extensions目录下，其他插件根据需要自行下载

sudo ./update-oops-plugin-bundle.sh
sudo ./update-oops-plugin-excel-to-json.sh
sudo ./update-oops-plugin-hot-update.sh

5. 打开cocosCreator编译器，导入项目并打开，选择资源管理器 -> assets --> main.scene打开，运行游戏：
   

至此项目配置结束。

项目结构

oops-framework的项目目录结构，跟cocosCreator的项目结构 是一样的，只是额外增加了：

• doc 放置了core, ecs, mvvm的配置说明文件，建议学习的时候进行参考
• excel excel表配置文件，用于通过update-oops-plugin-excel-to-json插件转换为json等
• extensions 插件目录
• .bat/.sh 更新指定的插件配置相关，以update-oops-plugin-framework.sh为例：

# 检测是否存在extensions目录，不存在则创建
if [ ! -d "extensions" ]; then
    mkdir extensions
fi
# 进入extensions目录
cd extensions

# 检测是否存在oops-plugin-framework
# 不存在,则克隆； 存在则拉取用于更新
if [ ! -d "oops-plugin-framework" ]; then
    git clone -b master https://gitee.com/dgflash/oops-plugin-framework.git
else
    cd oops-plugin-framework
    git pull
fi

根据相关的.bat/.sh命令，就可以下载或更新插件相关，方便快捷。

框架结构

框架的主要结构在插件oops-plugin-framework中

目录:extensions/oops-framework/assets，主要有：

• core 框架核心技术库相关
• libs 框架可选技术库相关, 可根据项目需要自动剔除
• moudule 通用模块相关

目录结构：

core

common 公共模块相关

audio 音频模块

event 全局事件

loader 资源管理相关

log 日志模块

random 随机管理

storage 本地存储

timer 定时器相关

game 游戏世界类

gui 游戏界面类

layer 多层界面、窗口管理

prompt 公共提示窗口

utils 各类工具

Oop.ts 框架功能访问接口

Root.ts 框架视图层根节点管理组件

libs 框架中可选技术库

animator 可视化动画状态机

animator-effect 动画特效组件

animator-move 动画移动组件

behavior-tree 行为树框架

camera 摄像机控制组件

collection 数据集合处理

ecs ECS框架

gui 界面组件， 比如：红点提示、按钮、标签、多语言等组件

model-view MVVM框架

network 网络模块， 支持Http, WebSocket的请求相关，支持Protobuf

render-texture 渲染纹理组件， 可用于三维模型显示到二维精灵等

module 游戏通用模块

common 公共模块

config 配置模块

基础相关：

• LayerManager.ts UI界面管理， 可用于显示不同的UI页面相关
• ResLoader.ts 资源管理相关， 可用于resources及其他bundle的加载
• TimerManager.ts 时间管理相关，可用于时间的显示及定时器相关
• AudioManager.ts 声音管理相关，可用于音乐音效的播放
• MessageManager.ts 可用于消息的注册和监听相关
• GUI.ts 可用于屏幕匹配相关
• StorageManager.ts 本地存储，支持AES数据加密

组件相关:

• libs/gui/button 按钮相关， 支持点击效果，防连点和长按点击等
• libs/gui/language 多语言相关， 支持Label, Sprite, Spine等
• libs/model-view MVVM组件库相关
• libs/animator-effect 特效管理相关，比如流光效果等

网络相关

• libs/network/HttpRequest.ts Http请求相关
• libs/network/NetManager.ts webSocket请求相关

工具相关

• Logger.ts 日志管理，支持网络层，业务，视图，配置等日志的显示
• RandomManager.ts 随机管理器，支持指定范围内的随机数显示
• core/utils 工具相关，比如：数学运算、字符串、正则、加密、Json加载等
• libs/network/protocol zip压缩相关

项目开发

暂且以示例项目为例， 在项目开发中，注意几点内容：

• 该框架是支持屏幕适配的，通过项目 -> 项目设置 设定宽度和高度后，选择适配屏幕宽度和高度即可，框架那边会进行处理
• 创建脚本时，框架提供了不同模块的模版文件，主要有：

// oops-framework/.creator/asset-templete/typeScript
Module.ts
ModuleBll.ts		// 业务层对象
ModuleModel.ts	// 数据层对象
ModuleTable.ts	// Excel表导出的Json数据相关
ModuleView.ts 	// 视图层对象
ModuleViewVM.ts // MVVM的视图层对象

• assets/script/game/initialize/bll/InitRes.ts 它主要用于项目启动时加载必备的资源，注意：要控制资源的大小，避免加载导致黑屏时间过长

entityEnter(e: Initialize): void {
  var queue: AsyncQueue = new AsyncQueue();

  // 加载自定义资源
  this.loadCustom(queue);
  // 加载多语言包
  this.loadLanguage(queue);
  // 加载公共资源
  this.loadCommon(queue);
  // 加载游戏内容加载进度提示界面
  this.onComplete(queue, e);

  queue.play();
}

• assets/script/game/initialize/view/LoadingViewComp.ts 资源加载进度条，在加载结束后，会通过如下进入设定的主页面

reset(): void {
  setTimeout(() => {
  	// 关闭加载界面
  	oops.gui.remove(UIID.Loading);

		// 打开游戏主界面（自定义逻辑）
		oops.gui.open(UIID.Demo);
	}, 500);
}

• assets/script/game/initialize/view/HotUpdate.ts 热更新相关， 主要的配置文件在resources目录下，分别为project.manifest和version.mainifest

最后祝大家学习oops Framework顺利。