引擎: CocosCreator 3.8.0

环境: Mac

Gitee: oops-game-kit

构建


本篇博客使用oops-game-kit 构建一个新的开发项目, 关于 oopsframework 框架的了解,可参考上篇博客

oops-framework框架 之 初始了解(一)

大概步骤

  1. 使用Git命令克隆项目:
git clone https://gitee.com/dgflash/oops-game-kit
  1. 项目克隆成功后,进入项目目录: oopsgamekit ,根据平台执行命令
// window
执行 update-oops-plugin-framework.bat 克隆与更新框架插件
执行 update-oops-plugin-hot-update.bat 克隆与更新更新插件
执行 update-oops-plugin-excel-to-json.bat 克隆与更新Excel转Json格式插件

// Mac 
执行 update-oops-plugin-framework.sh 克隆与更新框架插件
执行 update-oops-plugin-hot-update.sh 克隆与更新热更新插件
执行 update-oops-plugin-excel-to-json.sh 克隆与更新Excel转Json格式插件

// 最重要的是update-oops-plugin-framework, 这个框架的的主体, 以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
  1. 打开项目目录oops-gamekit 下的 project.json修改 namedescription, 对项目名和描述重新命名, 并注意修改项目目录文件名
{
  "_sourceId": "c30b28da-749e-479b-bcb6-cecd8d7be9e3",
  "creator": {
    "version": "3.8.1"
  },
  "dependencies": {
    "crypto-es": "^1.2.7"
  },
  // 项目描述
  "description": "游戏项目模板",
  // 项目名
  "name": "oops-game-kit",
  "uuid": "00d7d957-a3e8-4ad6-80f4-2fcfb235bca4",
  "version": "3.6.3"
}

注: version可以修改,但建议使用最新

  1. 修改后,打开CocosCreator编译器 导入项目如图所示
    请添加图片描述

  2. 通过项目配置修改屏幕适配即可

目录结构


这里,看下目录结构以便于对模版进行拓展修改:
请添加图片描述

目录结构跟CocosCreator目录结构是类似的, 需要注意的是:

针对node_modules NPM第三方相关,想了解NPM,可参考博客

注:在CocosCreator项目中,node_modules的是被.gitgnore忽略

注: NPM相关使用,可参考博客:Mac 安装使用NPM及常用命令

assets目录

使用CocosCreator开发项目,需要将使用的资源放置assets 文件夹中,编译器才会在资源管理显示出来。

目录下的一般结构是:

oopsgamekit 项目模版与上面是类似的, 但框架拓展了一些东西需要注意:

  1. 游戏启动加载的必备资源需要保证资源配置尽量小些,否则黑屏时间过长
  2. 游戏loading页面加载资源
  3. 选项语言包,自定义资源加载

这些方面需要我们在配置 assets目录资源时候注意。下面将详细说明下。

注意事项


说明之前,注意下:resources.config.json 文件, 它是游戏配置文件

{
  // 主配置信息版本号包名本地存储加密keyiv服务器地址请求超时、帧率等
  "config": {
    "version": "1.0.5",
    "package": "com.oops.game",
    "localDataKey": "oops",
    "localDataIv": "framework",
    "httpServer": "http://192.168.0.150/main/",
    "httpTimeout": 10000,
    "frameRate": 60
  },
  // 多语言配置:语言类型文本资源路径
  "language": {
    "type": [
      "zh",
      "en"
    ],
    "path": {
      "json": "language/json",
      "texture": "language/texture"
    }
  },
  // 自定义Bundle配置
  "bundle": {
    "enable": false,
    "server": "http://localhost:8083/assets/bundle",
    "name": "bundle",
    "version": ""
  }
}

配置文件对应的的脚本是:…/oops-plugin-framework/assets/module/config/GameConfig.ts

export class GameConfig {
  /** 客户端版本号配置 */
  get version(): string { return this._data["config"]["version"]; }
  /** 包名 */
  get package(): string { return this._data["config"]["package"]; }
  /** 游戏每秒传输帧数 */
  get frameRate(): number { return this._data.config.frameRate; }
  /** 本地存储内容加密 key */
  get localDataKey(): string { return this._data.config.localDataKey; }
  /** 本地存储内容加密 iv */
  get localDataIv(): string { return this._data.config.localDataIv; }
  /** Http 服务器地址 */
  get httpServer(): string { return this._data.config.httpServer; }
  /** Http 请求超时时间 */
  get httpTimeout(): number { return this._data.config.httpTimeout; }

  // ...
  constructor(config: any) {
    let data = config.json;
    this._data = Object.freeze(data);

    oops.log.logConfig(this._data, "游戏配置");
  }
}

可根据需要自行去获取

游戏启动加载资源

游戏启动时加载的必备资源,主要有:

主要在 initialize/bll/InitRes.ts中进行。主要代码

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

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

	queue.play();
}

注意:

公共资源是必备的,看下代码相关

// 加载公共资源的路径是在resources/common
private loadCommon(queue: AsyncQueue) {
  queue.push((next: NextFunction, params: any, args: any) => {
    oops.res.loadDir("common", next);
  });
}

注: resources目录下一定要存在common文件夹,放置必备资源

游戏必备资源加载完成后,会调用onComplete 用于显示Loading页面

private onComplete(queue: AsyncQueue, e: Initialize) {
  queue.complete = async () => {
    // 通过UIID,异步打开Loading页面
    var node = await oops.gui.openAsync(UIID.Loading);
    if (node) e.add(node.getComponent(LoadingViewComp) as ecs.Comp);
    e.remove(InitResComp);
  };
}

游戏Loading页面

我们首次运行项目的时候,因为资源较少,或者是放错了资源路径可能出现问题

该页面主要用于加载较大的内容资源,主要实现文件是:

脚本的主要加载逻辑

private loadGameRes() {
  // 多语言提示文本
  this.data.prompt = oops.language.getLangByID("loading_load_game");

  // 加载目录
  oops.res.loadDir("game", 
    // 加载进度回调
  	this.onProgressCallback.bind(this), 
    // 加载完成回调
    this.onCompleteCallback.bind(this)
  );
}

注: resources目录下一定要存在game文件夹,用于放置动态引用的非必备资源

其他


关于多语言或Bundle相关,在后面的文章中会逐渐的说明

最后,将个人项目整理以后的资源目录分享大家
请添加图片描述

再次感谢作者dgflash分享oops-framework框架QQ群: 628575875。

最后,祝大家学习生活愉快!

原文地址:https://blog.csdn.net/qq_24726043/article/details/134742027

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任

如若转载,请注明出处:http://www.7code.cn/show_34438.html

如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱suwngjj01@126.com进行投诉反馈,一经查实,立即删除

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注