奎特尔星球

超级浣熊Cocos引擎10年老用户，精通Cocos全家桶Cocos-iPhoneCocos2d-xCocos2d-html5Cocos2d-jsCocos Creator2011年开始写...

「超级浣熊」SVG矢量绘图组件，大神又增加新的应用场景啦！成功在Cocos Creator引擎中实现了汉字笔画临摹功能，请看下面视频：昨天在交流群中，大家讨论了一些关于SVG的应用场景，...

1. 前言自去年7月开始踏上自由职业这条路10个月后，也就是今年3月~7月 Shawn 又加入到一家初创培训公司上班，而现在 Shawn 现又开始自由职业了！上半年这段时间倍受煎熬，要感谢安晓辉老师与知识星球中的大佬，通过他们分享的经历、经验、心得让我内心能不断触摸到希望，坚持做到早起、学习、写作，我也将这段时间学习到的心得分享给大家。2. 时间测量在还未进入安老师的星球的时候，就在 Gi...

《组件与节点》一篇我们讲了，组件与节点的关系是：组件为节点赋能我们看一个组件赋予节点能力的例子：观看视频：https://v.qq.com/x/page/w07083iv83b.html我们将组件化思维再扩展到人，也可说程序员为美术、策划赋能，同时美术、策划又为程序员腾挪出宝贵的时间，从而形成一种良形循环。1. 教程源码大家听 Shawn 说了很多，但不少美术、策划或者是 Co...

我们已经学习了有段时间的 Cocos Creator 组件开发了，组件化开发到底有是什么？Shawn这阵子思绪不断，同时将自己的理解应用于实际项目中，颇有心得，在这里做一个分享。1. 理解节点与组件的关系有经验的同学，一上手就能想到「装饰模式」，我们看下定义：**装饰模式（Decorator）**动态地给一个对象添加一些额外的职责，就增加功能来说，装饰模式比生成子类更为灵活。再看一下装...

接上次教程中的内容，讲到功能型组件与控制型组件，这里再简单回顾一下他们的要点：功能型组件：以装饰宿主节点为己任，常用的有Sprite、Labe、Widget属于这类。控制型组件：管理和控制子孙节点，比如：ScreollView、ToggleContainer，它们内部是由多个子孙点节点组合而成。今天分享我在组件编码上一点经验，供大家参考。1. 功能型组件设计思路核心：以装饰宿主节...

Demo演示视频：视频地址：https://v.qq.com/x/page/p0713nsrnr1.html本视频的工程已经上传github，CreatroPrimer仓库physics分支，传送地址：https://github.com/ShawnZhang2015/CreatorPrimer/tree/physics紧接上篇我们的物理投篮游戏，这次介绍一下Cocosc Creator的...

Cocos Creator的核心是组件化，如何编写出高质量的组件代码值得程序员们不断探索，Shawn今天分享一点组件编码的心得供大家参考：“怎样才是一个合格的组件？”。1. 组件编码常见问题Shawn在2年的Cocos Creator项目经验和案例中总结了两条组件编码问题：滥用properties属性：把暴露到编辑器上的组件属性当成成员变量的一种实现方式；或将properties属性当成访...

我们前面讲了组件化开发的一些思路以及Cocos Creator的最佳工作流。但真正要做到界面与逻辑分离，开发人员与设计师高效协作，并不是一朝一夕之事，Shawn会在这条道路上继续前行，也希望大家能多多支持。今天我们介绍一个比之前稍微复杂点的Demo，先看一段演示视频：视频地址：https://v.qq.com/x/page/p0713nsrnr1.html本视频的工程已经上传github，...

继续物理小游戏，我们先回顾一下CreatorPrimer仓库中提供的五个组件脚本：使用这5个组件脚本，可以构建非常有趣的物理小游戏，下面我们对这5个自定义组件做一个简单介绍：PhysicsManager： 物理引擎管理器，使用它无需编程即可开启\关闭物理引擎，并提供刚体的着色调试开关。2. PhysicsVelocity: 物理速度控制组件，提供了一个force函数方便使用cc.Bu...

1. 回顾《ShaderHelper组件速递》一篇我们介绍了ShaderHelper组件的使用，以及如何定义一个shader程序并添加到ShaderHelper组件的program枚举属性中，这里我们再简单回顾下shader模板对象定义：/** * shader模板 **/const renderEngine = cc.renderer.renderEngine;const rende...

前面两篇我们介绍了物理投篮小游戏的界面布局、物理组件的基本使用方法，从今天开始进入编程篇的内容。难度在逐渐加深，为了不给大家造成阅读负担，程序篇会分成多次来讲，每篇教程尽量简单，就算没有编程基础，跟着源码、注释、讲解、视频，相信也能帮助大家快速上手Cocos Creator物理引擎。视频地址：https://v.qq.com/x/page/p0713nsrnr1.html源码地址：https...

1. LoadPrefab组件预制件嵌套可以将复杂UI界面模块化，让每一个界面模块可以独立运行，也可以组合使用，开篇之前先看个视频演示：点击链接播放：https://v.qq.com/x/page/a0802vglsp9.html不知道大家是否还记得之前的一篇教程《CreatorPrimer|加载预制件》，我们在这篇教程中提供的LoadPrefab组件中增加一行特殊代码就能实现预制件的嵌套...

Shawn 这两天在学习 Creator3D 的官方案例，由于是刚接触 Creator3D 很多东西在没弄清楚之前还是以简单的编辑器介绍为主，先了解一下3D场景的基本操作： 观查场景：按住鼠标右键以自己为原点可以上下左右观查场景； 场景漫游：按住鼠标右键，通过键盘 W\S\A\D 键 可以在场景中上下左右移动，Q键垂直下降，E键是垂直上降； 聚焦物体：又击层级管理器中的3...

之前的飞机大战一我们实现了地图场景的滚动和简单的直上直下的子弹的发射，在之前的基础上，对线性发射器做了简单的修改，实现了如下效果：下面我来就介绍一下，实现上面效果是如何实现的，先看视频：1、子弹角度计算这里为子弹发射器增加了一个rotation属性用于控制子弹发射的角度，但是如何计算子弹的飞行终点坐标呢？不好意思，请允许我重新翻开初中的数学关于三角函数章节，通过直角三角形中，角度与...

前两天在Cocos官方公众号上学习了「大掌教」的Cocos Creator 2.x Camera教程，总算是对摄像机组件有了一个初步的认识。乘热打铁，Shawn即刻就使用Camera摄像机练习了一个飞机游戏的，目前主要实现3个功能：无限滚动背景控制飞机移动子弹发射下面是游戏视频：视频地址：https://v.youku.com/v_show/id_XNDA4NDAxODMyNA==...

Shawn之前只是从感性的一面了解Cocos Creator 2.0在性能更好，增加部分3D效果的支持，同时API有一些变化。随着对Cocos Creator 2.x的实践，以及引擎组大神们的指导，对Cocos Creator 1.x和2.x有了新的了解和认识，在此将这次学习内容与大家分享。1. 1.x与2.x的渲染区别Cocos Creator 1.x 是在cocos2d-js基础上增加了...

在集合类游戏中，不论是大厅还是子游戏都会涉及到版本的更新，在开发调试阶段，检查更新是否生效的一个直观的方法就是观察版本号的变化，因此版本号的显示是游戏中不可缺少的细节，特别是集合类游戏。1. 熟悉manifest这里我们使用 Cocos Creator 提供的 AssetsManager 热更新框架所要求的 project.manifest 它是一个JSON格式的配置文件：{ "v...

这两天正在愁公众号写点什么，打开微信看到uikiller老用户「悦雨」遇到了一个问题：地图拖动与子节点触摸事件产生冲突，表现为在子节点上拖动，地图不能动一句话不太好描述问题，在征得「悦雨」同意后，将这次交流的内容截图出来：在与「悦雨」的交流过程中，我用ScrollView + TileMap + Button花了五分钟做了一个小测试，将TiledMap放在ScrollView中，在...

《飞机大战（一）》介绍摄像机实现地图的滚动和子弹组件的设计；在此基础上《飞机大战（二）》增加了子弹的角度直线发射以及动态角度更新能力，用于实现如：散弹、螺旋扫射等华丽的子弹表现。本次教程分享的是 Cocos Creator 引擎碰撞检测系统，使玩家的子弹能够击中敌人，让我们的游戏可以真正玩起来！子弹预制件子弹发射器 LineEmitter，用于控制子弹的飞行路径，子弹自身的表现则由预制体 B...

今天把ShaderHelper组件重新整理，代码已经上传到github，地址：https://github.com/ShawnZhang2015/ShaderHelper说实话Shawn对Shader也是刚刚起步，目前只会依葫芦画瓢，根据论坛中panda、Colin、小叔叔等大佬们的教程和源码结合自己的使用体验，编写了ShaderHelper组件，请先看使用方法：点击此处播放1. Shad...

手新引导框架，自动化测试框架，先看一段视频：点击此处观看视频在线预览体验注意，在电脑上预览才能体验自动引导功能！Shawn 刚开始只是为了完成新手引导功能点，同时要求引导代码要做非入侵式，尽量对游戏代码零干扰。1. 步骤指令当引导框架完成后，发现引导的配置工作效率低下，非程序员非项目程序员，上手困难，于是又在引导框架中增加了步骤指令机制，使引导配置尽可能地JSON化，而非JS化。引...

在游戏中实现节点的可拖动是一个比较常见情况，比如：可以给小朋友做一个将果皮投进垃圾箱的教学练习、角色换装、物品包裹界面等。在Cocos Creator中实现一个可拖动组件，只需对目标节点拖拽配置就能让节点任意移动，这对策划、美术人员来说是不是很有杀伤力！1. 创建测试场景在实现一个组件代码之前最好新建一个测试场景，组件代码在测试场景中通过了基本测试之后再放入正式环境使用。而且在组件完成后，测试...

游戏预览是开发中的一个重要环节，Cocos Creator游戏引擎基于JavaScript语言有着丰富强大的预览调试能力，这次我们介绍预览调试相关的技术，了解一下这方面的知识相信对你也非常有帮助。1. 游戏预览Cocos Creator是跨平台的游戏开发引擎，从类别上主要分为Nativet和H5两大平台，游戏预览也分为这两大模式：浏览器、模拟器。我们可以从Cocos Creator主窗口上选择...

利用async.js编写异步动画

「英雄」是舞者，「安可心」是舞步！Cocos2d的动画编程，特别另类的编程教程！

有不少人对奎特尔了解的不多，梦想成为一名优秀创世之主。但想要入侵奎特尔，表面上看起来容易，但稍有不注意容易迷失。Shawn在奎特尔星球上呆了有大半年了，再加上之前在奎特尔的兄弟星球cocos2d-js上开垦了三年，略有心得，愿与你分享。

紧接上篇《奎特尔星球|雷神之锤(上)》，我给大家介绍了雷神之锤—uikiller的基本用法，有人说长按功能可以取名为蓄力攻击、重击，我觉得还真是可以的，但就是感觉招数名字不够大气。在这里还要给大家道个歉，上篇中我说了这一样句话: uikiller只有一行需要要被主动调用的函数：uikiller.bindComponent不好意思，在这里我可能隐瞒了大家，除了uikiller.bindCompo

这次换一种方式聊聊Creator的UI开发，目的是想让学习那么枯燥，如果你是一个爱玩游戏的朋友相信你会很有感觉。一、奎特尔星球在奎特尔星球上，有着无数的英雄，身怀绝世魔力，在创世之主的统之下维护着奎特尔世界的安定与和平。 1. Node英雄传cc.Node是构建“奎特尔”星的基石，上至星体下至尘埃，无处不在，无论是可见的或不可见的，都由有他们默默的在支撑着。 上图层级管理器和场景编辑器中，我们看

奎特尔星球上有一件绝世神兵，就像是一把雷神之锤，在它的号令之下指挥着节点、组件和触摸事件，从而大量减少冗余代码与编辑器上的设置，他就是uikiller。uikiller指挥着英雄与魔灵杀敌无数，他的前身曾经在cocos2d-js星球上服役，名为UILoader。经过我潜心的改进，来到了奎特尔星球。一、雷神之锤 uikiller只有一行需要要被主动调用的函数：uikiller.bindCompone

自从开始写protobufjs的分享教程，就开始坚持不懈的在CocosCreator论坛上自吹自擂，无意见被CocosCreator制作人南塔斯大神看到了。一不小心收到南大神的论坛私信，询问我可否将protobuf的使用制作成Creator的插件，并邀我将插件入驻Creator付费商店。收到消息的第一时间，我异常兴奋。第一是我的经验分享竟能受到Creator官方大神的关注；其次是居然还可以入驻付

通过前面两篇我们探索了如何在creator中使用protobuf，并且让其能正常工作在浏览器、JSB上，最后聊到protobuf在js项目中使用上的一些痛点。这篇博文我要把这些痛点一条一条地扳开，分析为什么它让我痛，以及我的治疗方案。

不修改源码让protobufjs适应多平台我们上一篇《在cocos creator中使用protobufjs（一）》讲解了通过修改源码的方案，让protobufjs能正常运行在jsb环境上。这个方案适合将protobufjs源码直接放到项目中，而我们使用npm来管理三方库的方式，这种方案就显得不太优雅。

本教程是帮助大家在cocos creator中如何使用protobufjs，以及解决protobufjs在原生环境下不能正常工作的问题。

我们之前讲过要在Creator原生环境下使用protobufjs，使用伪装者的方式模拟nodejs的fs\path模块可以完美解决问题。但随着Creator1.7的到来，Shawn也尝了下鲜，但发现在creator**模拟器环境**下，原来的伪装方案失效了。一、疑犯追踪1. 调试神器追踪Bug这个问题，不得不大赞一下Creator1.7提供的新的底层JS引擎，它使得在原生jsb环境上的调试手段、效率

pb杀手通过一段时间的Creator插件学习与protobufjs源码的理解，再结合Creator项目经验，终于完成了第一版插件。在制作插件的过程中，插件的命名是最让我纠结的，因为我在曾经的项目中大量使用xxxHelper，编写了不少辅助工具。这次为了让我的第一个Creator插件看起来很牛逼一点点的感觉，我脑子冒出killer的字样，随后我就叫他：pbkiller。我先让pb

Cocos Creator游戏开发主要是使用JavaScript语言，这里向大家推荐Visual Studio Code和Webstorm两款JavaScript神级编辑器。这两款编辑器的安装都很简单，这里主要介绍在Cocos Creator项目中如何调整编辑器配置，以提升开发效率。

使用CocosCreator已经一年了，在此期间一直在摸索，如何才是组件化编程的最优实践。Shawn属于半野生的路子，水平不高，但不时会陷入一些问题瞎琢磨。我根据自己的经验，总结了一套组件化编程模型：法宝与结界模型。但在介绍法宝、结界组件模型之前，先回顾一下控件和组件的概念。一、控件与组件在Cocos2d-x/lua/js的年代，UI元素都以控件类的形式存在。只有cc.Node的子类才能在界...

1. 前言早在8月24日，公众号收到网友「Vincent」的留言，提醒我uikiller库在Cocos Creator 2.0上有错！惊出一身冷汗，怎么忘记这个事了。晚上回到家，迅速启动Cocos Creator 2.0打开uikiller工程，确实是有问题，还好问题不严重，立马做了修改并推送到github仓库增加了v2分支，在此感谢「Vincent」提醒！虽然uikiller的使用者并不多，...

有朋友在公众号留言，提出「奎特尔星球」上的文章对于初学者路径不清晰，不知道按怎么的顺序阅读。其实「奎特尔星球」公众号上的文章还是有轨迹可寻的，总体框架如下图所示： 借这位朋友的提醒，Shawn将从2017年9月公众号开张时的文章、教程、视频做了一个归类整理，为初入Creator和奎特尔的朋友提供一个参考。一、基础&综合&经验此分类的内容比较宽泛，不仅限于Co...