oops-framework框架 之 入门_oops-plugin-excel-to-json使用

安装使用

oops-framework 和 oops-game-kit 的安装和使用时类似的，这里我们以oops-framework 为例：

1. 使用Git命令下载所需要的项目(任选之一即可)

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

注： 下载项目完成后，千万不要直接导入CocosCreator编译器并打开；框架以插件的形式存在，下载的项目没有包含oops-plugin-framework的框架插件，会有着各种各样的报错。

2. 下载成功后，通过终端进入项目目录，执行update-oops-plugin-framework.sh的命令，简要看下命令：

if [ ! -d "extensions" ]; then
    mkdir extensions
fi
cd extensions

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

命令会检测是否存在 extensions 插件目录，如果不存在则进行创建； 然后进入插件目录检测是否存在 oops-plugin-framework 目录，如果不存在则克隆，如果存在则拉取。

以插件这种方式可以保证：

• 项目与框架分离，降低耦合有利于维护拓展
• 通过命令下载或更新，可以保持框架的最新特性和拓展性

主要运行命令：

// windows执行.bat命令, mac执行.sh命令， 以Mac为例：
./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

3. 其他框架插件：热更新，Excel转Json相关，跟步骤2是类似的

// AB包
sudo ./update-oops-plugin-bundle.sh
// Excel转Json
sudo ./update-oops-plugin-excel-to-json.sh
// 热更新
sudo ./update-oops-plugin-hot-update.sh

4. 在主要框架插件下载以后，可通过CocosCreator编译器导入项目打开工程了。资源管理器中的 oops-framework 便是通过项目目录内的命令下载下来的

5. 选择assets 目录下的 main.scene 打开，并运行，可查看效果：
   

到这里就可以学习和使用了。

框架结构

---

了解一个框架的使用，我们需要熟悉它的结构：

大致分为三块：

• core 框架核心技术库相关， 主要是声音、事件、资源加载、本地存储，时间管理、UI管理等
• libs 框架可选技术库相关，主要是ECS框架，MVVM框架、动画管理、网络、渲染等可选库
• moudule 通用模块相关

注：基础框架的大小不到2M，libs相关为低耦合，如果不需要，也可以剔除，用于降低包体大小。

详细目录说明

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/core/Oop.ts中

export class oops {
    /\*\* ----------核心模块---------- \*/
    
    /\*\* 日志管理 \*/
    static log = Logger;
    /\*\* 游戏配置 \*/
    static config = new Config();
    /\*\* 全局消息 \*/
    static message: MessageManager = MessageManager.Instance;
    /\*\* 随机工具 \*/
    static random = RandomManager.instance;
    /\*\* 本地存储 \*/
    static storage: StorageManager = new StorageManager();
    /\*\* 游戏时间管理 \*/
    static timer: TimerManager;
    /\*\* 游戏音乐管理 \*/
    static audio: AudioManager;
    /\*\* 二维界面管理 \*/
    static gui: LayerManager;
    /\*\* 三维游戏世界管理 \*/
    static game: GameManager;
    /\*\* 资源管理 \*/
    static res = new ResLoader();

    /\*\* ----------可选模块---------- \*/

    /\*\* 多语言模块 \*/
    static language: LanguageManager;
    /\*\* HTTP \*/
    static http: HttpRequest = new HttpRequest();
    /\*\* WebSocket \*/
    static tcp: NetManager = new NetManager();
    /\*\* ECS \*/
    static ecs: ECSRootSystem = new ecs.RootSystem();
}

调用对应功能模块的时候，类似代码：

import { oops } from '../../../../../extensions/oops-plugin-framework/assets/core/Oops';

// 调用资源管理器加载
oops.res.load(...);
// 调用UI页面
oops.gui.open(...);
// 调用本地存储
oops.storage.set(...);

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上大数据知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

需要这份系统化资料的朋友，可以戳这里获取

torage.set(…);

> 


[外链图片转存中...(img-WlY9uVvG-1714240660178)]
[外链图片转存中...(img-GUYPlqzn-1714240660179)]
[外链图片转存中...(img-wlvQ6xcJ-1714240660179)]

**既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上大数据知识点，真正体系化！**

**由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新**

**[需要这份系统化资料的朋友，可以戳这里获取](https://bbs.csdn.net/topics/618545628)**