美文网首页
Cocos Creator 入门

Cocos Creator 入门

作者: ilnaw | 来源:发表于2019-11-27 09:13 被阅读0次

什么是Cocos Creator?

  • 是Cocos2d-x引擎 的 JavaScript 实现
  • 是一个一体化的编辑器,包含设计、开发、调试、发布
  • 支持发布游戏到Web、iOS、Android、小游戏、pc等平台

语言

  • JavaScript
  • TypeScript

上手步骤:

  • 安装环境
  • 场景
  • 资源
  • 进阶使用

安装环境

  • 下载cocos creator
  • 下载代码编辑器

    creator中 可以直接添加代码提示、编译任务等 屏幕快照 2019-11-21 下午2.55.57.png

场景

  • 节点、组件
    1.一个场景就是由摄像机和节点组成的
    2.节点类似于一个view,它的属性也是一些最基本坐标、大小、锚点、颜色等
    3.creator特点就是组件化,而承载组件的就是节点

  • 坐标

    1. 屏幕快照 2019-11-21 下午3.12.43.png
    2.锚点默认是(0.5,0.5)
  • 适配
    1.fit height:高度自动撑满屏幕,宽度根据设计分辨率缩放


    屏幕快照 2019-11-21 下午3.22.53.png

    2.fit width :宽度自动撑满屏幕,高度根据设计分辨率缩放


    屏幕快照 2019-11-21 下午3.23.46.png
    1. Widget:对齐挂件,类似于约束
    2. 调整大小: WeChata663b846965363a227d4c341433a0b03.png

      特殊的一些界面还是需要手动根据屏幕宽度计算大小

资源:

场景布置好了就可以放上资源了
创建Node-添加组件-赋予资源

WeChat064a2dd1aa637edc3e1678080f302e09.png

资源分类


WeChat9e9e303b4ab278e4402a26f4bc94c88b.png WeChat1e6d643f9c2c51ca63c17c8080f3b286.png
  • 静态引用


    屏幕快照 2019-11-21 下午3.42.23.png
    屏幕快照 2019-11-27 下午2.09.47.png
  • 动态加载
    需要将资源放到resources文件夹下


    image

    然后通过类似于读取文件的方式读取资源,注意动态加载都是异步的

     cc.loader.loadRes("test assets/prefab", function (err, prefab) {
      var newNode = cc.instantiate(prefab);
      cc.director.getScene().addChild(newNode);
    });
    
    
  • 脚本资源:


    WeChat19da9fc62f5484ff95cff0fb64132d4d.png

进阶使用

  • 热更新
    1.原理
    • 资源的差异性
      通过文件的md5信息来判断文件有改动需要更新
    • 资源的替换
      设置资源搜索路径,全部资源文件都在res、src下
      下载的资源是存在于本地沙盒内

2.流程


WeChat1b657f106f8c192642878becfb5a717a.png
  • 与原生交互
    利用JavaScript反射机制 ,调用 Java 、Objective-C的静态方法
    1.java: 类型签名只支持int、float、boolean、String四种
    2.iOS: respondsToSelector: 和 performSelector: 是反射机制使用的核心 API,苹果审核有一定风险

感受

  • 易上手
  • 支持的sdk较少
  • 插件少
  • 版本更新快、版本兼容性差

相关文章

网友评论

      本文标题:Cocos Creator 入门

      本文链接:https://www.haomeiwen.com/subject/bictwctx.html