js游戏框架合集


Cocos.js概述

Cocos.js概述,主要源自chatgpt:

Cocos.js 是一款基于 Cocos2d-x 引擎的 JavaScript 游戏开发框架,主要用于创建跨平台的移动端游戏。它结合了 Cocos2d-x 引擎的高性能和跨平台特性以及 JavaScript 语言的便捷性和灵活性。

Cocos2d-x 是一个成熟的开源游戏引擎,用 C++ 编写,支持多平台开发,包括 iOS、Android、Windows 等。Cocos.js 则是针对 JavaScript 开发者提供的一个封装层,使他们能够使用 JavaScript 语言进行游戏开发。

Cocos.js 提供了一系列的游戏开发工具和组件,包括场景管理、动画系统、精灵管理、物理引擎、UI 系统等,使开发者能够方便地构建游戏场景、处理用户输入、管理游戏对象等。此外,Cocos.js 还支持 JavaScript 的模块化开发,使开发者能够更好地组织和管理代码。

Cocos.js 的特点

  1. 跨平台支持:可以使用一套代码开发游戏,并在多个平台上运行,包括 iOS、Android、Windows 等。
  2. 高性能:Cocos2d-x 引擎具有优秀的性能表现,能够实现流畅的游戏体验。
  3. JavaScript 开发:使用 JavaScript 语言进行开发,无需学习额外的编程语言。
  4. 丰富的功能:提供了丰富的游戏开发工具和组件,方便开发者构建各种类型的游戏。
  5. 社区支持:Cocos.js 拥有活跃的开发者社区,提供技术支持和资源分享。

分类

Cocos Creator

Cocos Creator:是一个位于Cocos2d-x之上的GUI编辑器。Cocos Creator 内部已经包含完整的 JavaScript 引擎和 cocos2d-x 原生引擎,不需要额外安装任何 cocos2d-x 引擎或 Cocos Framework,

Creator 3.0 统一了 2D 与 3D 的开发工作流,进一步优化了性能,完善了品质

特性:

Cocos2d-x

Cocos2d-x:是游戏引擎。它支持c ++,JavaScript和Lua。2D 和 3D。

希望将旧的 Cocos2d-JS 游戏直接运行到 Cocos Creator 上:由于两者的 API 并不是100%兼容,所以这点是做不到的。

特性:

Cocos Creator

注意: Creator 在 2.4.4 和 3.0.0 版本升级才对M1 芯片的 mac 电脑适配。

官网:安装和启动 + 注册个人账户

然后再editor选项栏下载一个编辑器

然后我们可以在社区下载一些看起来很酷的项目(需要注意他对应的creator编辑器 版本)

然后打开项目后进行 预览和调试 进行查看

官方还提供了几个新手操作时间实例,可以看这里:

整体上看和我们正常开发web 3d很像,比如创建场景,创建cube啊,只是这些从写代码转移到了gui界面

左上角负责gui部分,快速添加 / 删除 mesh

左下角负责编写代码,和我们正常的项目目录一样(添加脚本用typescript,且需要注意,Cocos Creator 中脚本名称就是组件的名称,这个命名是大小写敏感的!如果组件名称的大小写不正确,将无法正确通过名称使用组件!)

这对于一些简单的动画来说,无疑是福音

编写动画效果

通过一般代码,我们可以制作一些比较呆板的动画效果,比如x、y、z轴位移,如何添加一些比较灵性的动画呢?

Cocos Creator 内置了通用的动画系统用以实现基于关键帧的动画。除了支持标准的位移、旋转、缩放动画和帧动画之外,还支持任意组件属性和用户自定义属性的驱动,再加上可任意编辑的时间曲线和创新的移动轨迹编辑功能,能够让内容生产人员不写一行代码就制作出细腻的各种动态效果。

动画系统

然后在对应的节点脚本上,导入 + 使用对应的动画

import {  Animation } from 'cc';
//动画
@property({type: Animation})
public BodyAnim: Animation | null = null;

对应的动画函数执行

if (this.BodyAnim) {
  if (step === 1) {
    this.BodyAnim.play('onStep');
  } else if (step === 2) {
    this.BodyAnim.play('twoStep');
  }
}

游戏管理器(GameManager)

一般来说,场景内会有不同功能,不同类型的节点,这些节点存放在场景里面我们可以将其视为我们游戏最要的数据部分。而很多情况下我们需要动态的生成、访问、删除这些节点。虽然在 Cocos Creator 里面我们可以通过 find 方法来查找这些节点,但实际上由于 find 方法需要访问场景内的所有节点,查找的命中率很低,这会造成大量的性能浪费。因此在开发中,我们一般会做一些单独的脚本,使用他们来管理场景内的 某一类 节点,或 某一些 数据,我们可以称他们为 管理器

举个例子,我们有很多角色,我们游戏可能需要不断的创建新的角色,删除某些已经死亡的角色,查询某些角色的状态,那么我们可以创建一个名为 ActorManager 的类来作为角色管理器,使其支持这些功能。

预制件(Prefab)

预制件用于存储一些可以复用的场景对象,它可以包含节点、组件以及组件上的数据。由预制件生成的实例既可以继承模板的数据,又可以有自己定制化的数据修改。

详情

像这样创建一个prefab文件,将将预制件资源从 资源管理器 拖拽到 层级管理器 ,然后再从prefab文件夹中拖动到场景即可

游戏库对比合集

3D探索——Web 3D哪家强?(主要是threejs和Layabox)

案例合集

cocos官网案例:https://docs.cocos.com/creator/manual/zh/cases-and-tutorials/


文章作者: Hello
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 Hello !
 上一篇
git基本命令符 git基本命令符
版本控制它是一种软件开发过程中,管理我们对文件、目录、或工程等内容的修改历史、方便我们查看更改历史记录,备份以便恢复以前的版本软件工程技术。简单来说就是用于管理多人协同开发项目的技术 SVN:集中式版本控制、所有版本存在服务器上,需要连网才
2021-03-01 Hello
下一篇 
babel babel
1.babel介绍小概 polyfill:polyfill主要抚平不同浏览器之间对js实现的差异,比如一些es6的语法,通过polyfill注入代码,使得es5也能正常运行api Core-js:它是JavaScript 标准库中最流行也
2021-02-07
  目录