Cocos
关注
分享
扫一扫
一枚小工
从事Cocos相关游戏开发多年，使用过Cocos的Cocos2d-x和Cocos Creator。现阶段，主要在Cocos Creator环境下使用JS和TS进行项目开发。19年7月份开始，想做一些技术方面的分享，于是以“一枚小工”的笔名创建了个人公众号，分享一些完整游戏项目以及开发过程中使用到的一些技术点，主要是针对Cocos Creator的，语言可能是JS，也可能是TS，目前分享出来的几个完整游戏有左右跳、动物同化、重力球、大炮英雄、推箱子、打地鼠等游戏，提供技术讲解的同时，免费提供完整工程源码，希望对打算或在从事Cocos Creator开发的伙伴，有所帮助，如有兴趣，欢迎关注交流。
展开
-
Cocos Creator | 挤水果小游戏实现 ( 一 )
点击上方蓝字关注我预览效果玩法介绍■ 具体玩法，可以搜微信小游戏【挤水果】，只实现了部分功能。游戏开始后，点击屏幕，出现标尺，松开后，水果上的水滴滴落到杯子中。这一期讲解三部分的实现：1. 标尺显示的控制；2. 水滴从水果上掉落；3. 水杯的接水滴实现。标尺的控制■ 原游戏玩法中，类似，按下屏幕...原创 2020-01-13 18:29:28 · 983 阅读 · 0 评论 -
Cocos Creator | 飞刀大乱斗开发教程系列（二）！
预览效果具体内容■ 这一期，主要讲解主页中间人物效果的实现。也就是，在下方列表选择不同人物，上方显示不同的人物，播放不同的效果，即下图的效果实现，此部分也是采用预制 Prefab 进行实现。 英雄Hero预制组成■ 英雄预制 Hero 主要四部分组成：旋转的光、大小变化的光球、英雄本身、英雄的武器。这四部分，都会根据英雄的不同等级，动态的更换对应的纹...原创 2020-01-02 18:06:00 · 824 阅读 · 1 评论 -
Cocos Creator | 飞刀大乱斗开发教程系列（一）！
预览效果具体内容■ 这一期，主要讲解主页下方列表选项如何实现。也就是游戏开始后，加载所有现有的英雄列表，这一功能的实现，如下图部分。 ■ 列表使用 ScrollView 实现，横向滚动，设置好上下左右的边距、选项之间的间距，内容部分使用 Layout 来做自动排版，最终列表显示内容，如上图所示即可。■ 重点是列表中的英雄预制体。预制体一共有三种状态：已解锁、...原创 2019-12-31 18:06:00 · 644 阅读 · 0 评论 -
游戏素材怎么找？1 分钟教你获取一套漂亮的游戏素材！
使用工具工具有两个：1. Chrome 浏览器；2. Chrome 扩展程序；安装方法安装方法有两种：一、直接到 Chrome 扩展程序商店，在线搜索 SaveAllResources，点击安装；二、下载导出的扩展，本地导入安装具体步骤如下：1. 获取扩展程序。关注公众号，发送【资源下载】；2. 本地修改。下载后的文件解压，修改cr...原创 2019-12-20 14:41:36 · 9477 阅读 · 2 评论 -
Cocos Creator | 开红包小游戏实现翻开效果，有代码！
游戏预览游戏玩法▌游戏开始后，点击开抢，屏幕中会出现9个未开启的红包，点击任一红包，翻开随机金额的红包，直到翻开所有红包，游戏结束，可以照此继续下去。 游戏介绍▌游戏主要分 2 部分，游戏主逻辑 ( Game ) 和红包预制逻辑 ( Card )，游戏逻辑主要控制红包布局和点击后的逻辑处理 (包括红包动画的播放)，红包预支逻辑主要控制红包...原创 2019-12-20 14:32:54 · 858 阅读 · 0 评论 -
等了那么久，终于等到新游戏啦！大炮英雄Cocos Creator实现，关注获取代码！
游戏预览开始场景搭建开始场景 摆放一个背景图，在背景图上添加背景地面、开始按钮、4个角色选择按钮、游戏logo。创建游戏脚本 1.实现开始按钮的回调，点击开始按钮，跳转到游戏场景。跳转场景方法如下：cc.director.preloadScene('playScene',function(){ cc.direct...原创 2019-10-17 13:25:11 · 369 阅读 · 0 评论 -
CocosCreator下JavaScript 快速开发推箱子游戏，附代码
游戏总共分为4个功能模块：-开始游戏（menuLayer）-关卡选择（levelLayer）-游戏（gameLayer）-游戏结算（gameOverLayer）Creator内组件效果如下： 游戏开始默认显示menuLayer，游戏中，通过控制各个层级的显示和隐藏，实现不同模块的切换。例如开始游戏，点击开始以后，触发回调函数，切换到游戏关卡选择界面，...原创 2019-08-14 10:34:23 · 891 阅读 · 0 评论 -
Cocos Creator下JavaScript模拟射箭效果，附代码
获取代码关注微信公众号，发送【射箭】获取代码效果预览操作方法点击屏幕，屏幕出现起始位置标志的圆点，不松开手指，滑动屏幕，控制力度和方向，移动距离越大，弓箭拉伸效果越大，松开以后，箭将沿着结束点到起始点方向射出去。弓箭拉伸效果实现原理弓箭所有内容放置在一个空节点weapon上，控制逻辑挂在weapon上，实现逻辑的控制。要注意几个节点的锚点，根据...原创 2019-09-29 15:21:07 · 1347 阅读 · 1 评论 -
CocosCreator | 列表组件ListComponent
获取源码 关注微信公众号，发送【列表】获取源码。使用场景 游戏中经常会做列表类型的功能，例如游戏记录、排行榜，涉及到的数据很多，如果使用自带的ScrollView，会需要创建很多列表项组件，效率会很低，也很影响性能，由于工作中使用到的比较多，就封装了一个组件ListComponent，大致实现原理如下： 在列表可见区域内，创建列表项Unit，列表...原创 2019-09-25 15:00:21 · 2273 阅读 · 0 评论 -
Cocos Creator下JavaScript实现动物同化，附代码
游戏玩法游戏目标是将游戏区域的动物全部同化成同一种动物。游戏从左上角开始，从右边点击需要变成的目标动物头像，如果被同化动物周围包含了点击的动物，则所有被同化动物都变成点击选中的动物，完成一次同化，然后逐渐扩大左上角的同化区域，直到所有动物变成同一种。游戏效果游戏主要有两个界面，游戏开始界面和游戏中界面。以下是游戏开始时界面：以下是进行游戏时显示的动态效果效果...原创 2019-09-25 17:12:18 · 360 阅读 · 0 评论 -
Cocos Creator下JavaScript实现左右跳游戏，附代码
1. 玩法说明 游戏开始后，点击屏幕左右两侧，机器人朝左上方或右上方跳一步，如果下一步有石块，成功得1分，否则游戏结束。2. 模块介绍 游戏场景分为2个：主页场景（home）、游戏场景（game）。主页场景（home）作为游戏入口，没有其他功能，单纯提供游戏入口。游戏场景（game）实现游戏玩法以及游戏逻辑控制，界面如下：游...原创 2019-09-25 18:07:36 · 761 阅读 · 0 评论 -
Cocos Creator里使用JavaScript加载远程图片
根据默认图片的大小和位置，显示远程图片，只需要把组件挂载在Sprite上，需要更新的时候，调用以下方法即可。只有url调用如下：userHead.getComponent('ImageUrl').loadUrl(url);知道图片类型调用如下(如微信头像）：userHead.getComponent('ImageUrl').loadUrl(url,'png');实现核...原创 2019-10-15 09:42:17 · 1033 阅读 · 0 评论 -
Cocos Creator内，JavaScript与TypeScript的相互调用
1. 两个测试库文件JSLib和TSLib1.1 js测试库文件JSLibconst js = { libname: 'JSLib', name: '一枚小工JS', print(){ console.log(this.name); },}export default js;1.2 ts测试库文件TSLibexport defa...原创 2019-10-15 09:39:49 · 5773 阅读 · 2 评论 -
Cocos Creator下JavaScript打地鼠游戏开发详解
原理游戏分为两部分：game.js：控制地鼠的出现和敲打地鼠的判断。mouse.js：控制地鼠运动动作。1、游戏中共有9个地鼠，随机获取0~8之间的一个数，用来显示相应的地鼠。2、地鼠运动，用moveTo方法控制地鼠移动效果：3、锤子敲打地鼠，我们采用全屏监听。当手指点击到某个区域时，触发点击事件，其中用到了两个关键方法：1、node.convertToWorl...原创 2019-10-14 21:05:48 · 674 阅读 · 0 评论 -
Cocos Creator使用JavaScript模拟炮弹发射效果
一、预览效果二、设置物理世界属性：1.打开物理系统：cc.director.getPhysicsManager().enabled = true;2.配置重力加速度：cc.director.getPhysicsManager().gravity = cc.v2(0, -980);三、射击角度调整1.全局监听touch事件，事件分为TOUCH_STA...原创 2019-10-11 16:22:43 · 1362 阅读 · 0 评论 -
Cocos Creator下JavaScript模拟砸金蛋3d旋转效果，附代码
获取代码关注微信公众号，发送【砸蛋】获取代码效果预览使用说明点击add，添加蛋到盘子上，蛋的数量后台可配置；点击move，让蛋在盘子上转动起来；点击stop，让蛋停止转动。蛋旋转效果实现椭圆定义平面内与两定点、的距离的和等于常数()的动点P的轨迹叫做椭圆。即：其中两定点、叫做椭圆的焦点，两焦点的距离叫做椭圆的焦...原创 2019-09-30 14:45:13 · 1200 阅读 · 0 评论