![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CocosCreator
一枚小工
从事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 · 937 阅读 · 0 评论 -
Cocos Creator | 飞刀大乱斗开发教程系列(二)!
预览效果具体内容■ 这一期,主要讲解主页中间人物效果的实现。也就是,在下方列表选择不同人物,上方显示不同的人物,播放不同的效果,即下图的效果实现,此部分也是采用预制 Prefab 进行实现。 英雄Hero预制组成■ 英雄预制 Hero 主要四部分组成:旋转的光、大小变化的光球、英雄本身、英雄的武器。这四部分,都会根据英雄的不同等级,动态的更换对应的纹...原创 2020-01-02 18:06:00 · 768 阅读 · 1 评论 -
Cocos Creator | 飞刀大乱斗开发教程系列(一)!
预览效果具体内容■ 这一期,主要讲解主页下方列表选项如何实现。也就是游戏开始后,加载所有现有的英雄列表,这一功能的实现,如下图部分。 ■ 列表使用 ScrollView 实现,横向滚动,设置好上下左右的边距、选项之间的间距,内容部分使用 Layout 来做自动排版,最终列表显示内容,如上图所示即可。■ 重点是列表中的英雄预制体。预制体一共有三种状态:已解锁、...原创 2019-12-31 18:06:00 · 570 阅读 · 0 评论 -
游戏素材怎么找?1 分钟教你获取一套漂亮的游戏素材!
使用工具工具有两个:1. Chrome 浏览器;2. Chrome 扩展程序;安装方法安装方法有两种:一、直接到 Chrome 扩展程序商店,在线搜索 SaveAllResources,点击安装;二、下载导出的扩展,本地导入安装具体步骤如下:1. 获取扩展程序。关注公众号,发送【资源下载】;2. 本地修改。下载后的文件解压,修改cr...原创 2019-12-20 14:41:36 · 9222 阅读 · 2 评论 -
Cocos Creator | 开红包小游戏实现翻开效果,有代码!
游戏预览游戏玩法▌游戏开始后,点击开抢,屏幕中会出现9个未开启的红包,点击任一红包,翻开随机金额的红包,直到翻开所有红包,游戏结束,可以照此继续下去。 游戏介绍▌游戏主要分 2 部分,游戏主逻辑 ( Game ) 和红包预制逻辑 ( Card ),游戏逻辑主要控制红包布局和点击后的逻辑处理 (包括红包动画的播放),红包预支逻辑主要控制红包...原创 2019-12-20 14:32:54 · 798 阅读 · 0 评论 -
Cocos Creator | 疯抢红包小游戏,有代码!
游戏预览游戏玩法▌游戏开始后,红包从屏幕中 4 个轨道,随机往下掉落,点击屏幕进行游戏,点中红包以后,随机出现金额奖励。游戏中,只要有一个红包漏掉,掉落到屏幕外面,游戏结束。游戏介绍▌游戏主要有 2 个场景,游戏首页(home)和游戏中(game),游戏结算使用一个层级显示,游戏过程中,隐藏结算根节点,游戏结束以后,显示结算根节点,更新游戏数据信息。...原创 2019-12-20 14:27:39 · 1079 阅读 · 0 评论 -
类跑酷游戏“忍者跳跃”的 Cocos Creator实现
游戏的样子?游戏玩法?地面运动时点击屏幕,控制英雄左右跳动,躲避飞镖和柱子,撞到飞镖减血,吃到蛋糕加血,撞到柱子游戏结束。游戏逻辑?游戏主要分为开始界面和游戏中界面,初始进入游戏开始界面,点击开始,进入游戏界面进行游戏。开始界面,就是一些图片和按钮的布局,摆放好位置,做好适配,关联按钮点击事件,响应跳转到游戏界面即可。游戏中,一开始出现引导,点...原创 2019-11-13 14:22:26 · 1818 阅读 · 0 评论 -
Cocos Creator下JavaScript实现1024游戏
效果预览获取代码关注公众号,发送【1024】获取代码。游戏介绍●Github上的代码,不能进行合并操作,修改以后,功能类似2048,空白块赏随机位置,生成2,可以往左、右、上、下滑动,数字会朝着指定方向运动,相邻元素如果相同,则合并。游戏代码参考:https://github.com/potato47/1024工程结构介绍●游戏分3个场景...原创 2019-10-25 09:37:39 · 517 阅读 · 0 评论 -
等了那么久,终于等到新游戏啦!大炮英雄Cocos Creator实现,关注获取代码!
游戏预览开始场景搭建开始场景 摆放一个背景图,在背景图上添加背景地面、开始按钮、4个角色选择按钮、游戏logo。创建游戏脚本 1.实现开始按钮的回调,点击开始按钮,跳转到游戏场景。跳转场景方法如下:cc.director.preloadScene('playScene',function(){ cc.direct...原创 2019-10-17 13:25:11 · 334 阅读 · 0 评论 -
Cocos Creator源码和教程分享
由于受论坛修改时间限制,后续不能修改的情况下,开新帖分享新源码和教程。https://forum.cocos.com/t/cocoscreator/80131https://forum.cocos.com/t/cocoscreator/83015关注微信公众号公众号,根据提示获取完整游戏源码和游戏开发教程。以上是已有游戏源码,由于游戏项目较多,后期还会不定期更新,需...原创 2019-08-02 13:54:37 · 4159 阅读 · 1 评论 -
CocosCreator下JavaScript 快速开发推箱子游戏,附代码
游戏总共分为4个功能模块:-开始游戏(menuLayer)-关卡选择(levelLayer)-游戏(gameLayer)-游戏结算(gameOverLayer)Creator内组件效果如下: 游戏开始默认显示menuLayer,游戏中,通过控制各个层级的显示和隐藏,实现不同模块的切换。例如开始游戏,点击开始以后,触发回调函数,切换到游戏关卡选择界面,...原创 2019-08-14 10:34:23 · 822 阅读 · 0 评论 -
Cocos Creator下JavaScript实现动物同化,附代码
游戏玩法游戏目标是将游戏区域的动物全部同化成同一种动物。游戏从左上角开始,从右边点击需要变成的目标动物头像,如果被同化动物周围包含了点击的动物,则所有被同化动物都变成点击选中的动物,完成一次同化,然后逐渐扩大左上角的同化区域,直到所有动物变成同一种。游戏效果游戏主要有两个界面,游戏开始界面和游戏中界面。以下是游戏开始时界面:以下是进行游戏时显示的动态效果效果...原创 2019-09-25 17:12:18 · 325 阅读 · 0 评论 -
Cocos Creator下JavaScript实现左右跳游戏,附代码
1. 玩法说明 游戏开始后,点击屏幕左右两侧,机器人朝左上方或右上方跳一步,如果下一步有石块,成功得1分,否则游戏结束。2. 模块介绍 游戏场景分为2个:主页场景(home)、游戏场景(game)。主页场景(home)作为游戏入口,没有其他功能,单纯提供游戏入口。游戏场景(game)实现游戏玩法以及游戏逻辑控制,界面如下:游...原创 2019-09-25 18:07:36 · 718 阅读 · 0 评论 -
Cocos Creator里使用JavaScript加载远程图片
根据默认图片的大小和位置,显示远程图片,只需要把组件挂载在Sprite上,需要更新的时候,调用以下方法即可。只有url调用如下:userHead.getComponent('ImageUrl').loadUrl(url);知道图片类型调用如下(如微信头像):userHead.getComponent('ImageUrl').loadUrl(url,'png');实现核...原创 2019-10-15 09:42:17 · 976 阅读 · 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 · 5477 阅读 · 2 评论 -
Cocos Creator下JavaScript打地鼠游戏开发详解
原理游戏分为两部分:game.js:控制地鼠的出现和敲打地鼠的判断。mouse.js:控制地鼠运动动作。1、游戏中共有9个地鼠,随机获取0~8之间的一个数,用来显示相应的地鼠。2、地鼠运动,用moveTo方法控制地鼠移动效果:3、锤子敲打地鼠,我们采用全屏监听。当手指点击到某个区域时,触发点击事件,其中用到了两个关键方法:1、node.convertToWorl...原创 2019-10-14 21:05:48 · 618 阅读 · 0 评论 -
Cocos Creator下JavaScript实现数钱小游戏,附代码
游戏效果游戏源码关注微信公众号,获取完整游戏源码原创 2019-09-25 14:54:26 · 1039 阅读 · 0 评论 -
Cocos Creator下JavaScript实现口红机,附代码
原理 转盘、发射的口红、转盘上的口红添加三个不同的碰撞体; 发射的口红和转盘,转盘上的口红和发射的口红碰撞体能发生碰撞; 发射的口红与转盘碰撞时,在指定(根据转盘旋转的角度)位置添加口红; 发射的口红与转盘上的口红发生碰撞,游戏失败。 效果游戏代码关注微信公众号,获取游戏源码...原创 2019-09-25 14:56:58 · 1031 阅读 · 0 评论 -
CocosCreator | 列表组件ListComponent
获取源码 关注微信公众号,发送【列表】获取源码。使用场景 游戏中经常会做列表类型的功能,例如游戏记录、排行榜,涉及到的数据很多,如果使用自带的ScrollView,会需要创建很多列表项组件,效率会很低,也很影响性能,由于工作中使用到的比较多,就封装了一个组件ListComponent,大致实现原理如下: 在列表可见区域内,创建列表项Unit,列表...原创 2019-09-25 15:00:21 · 2164 阅读 · 0 评论 -
Cocos Creator下JavaScript一步一步实现重力球游戏,附代码
『 游戏玩法』 通过手机陀螺仪,调整手机,让球从上一层的间隔中落到下一层,楼层会不断上涨,如果球碰到上方或者下方的火焰,游戏结束。『 游戏预览』『 开发工具』 1. CocosCreator 2.1.2 2. VisualStudio Code『 参考API』 1. PhysicsManager 2. SystemEvent...原创 2019-09-26 09:28:37 · 2423 阅读 · 0 评论 -
Cocos Creator发布H5游戏,做项目构建流程定制
游戏实现 主要介绍游戏玩法,具体实现,参考游戏源码。玩法是:游戏开始后,通过虚拟摇杆控制猴子在屏幕左右方向跳动,屏幕上随机出现香蕉,过一段时间后消失,猴子吃到香蕉得分,如果等到香蕉消失时,猴子仍旧没吃到,则游戏结束。1. 定制项目构建流程定制项目自带的文件 游戏中,有时候需要做一些定制要求,如启动页面布局修改、添加Logo等,还比如游戏资源需要做CDN...原创 2019-09-26 09:30:01 · 3540 阅读 · 0 评论 -
Cocos Creator下JavaScript模拟射箭效果,附代码
获取代码关注微信公众号,发送【射箭】获取代码效果预览操作方法点击屏幕,屏幕出现起始位置标志的圆点,不松开手指,滑动屏幕,控制力度和方向,移动距离越大,弓箭拉伸效果越大,松开以后,箭将沿着结束点到起始点方向射出去。弓箭拉伸效果实现原理弓箭所有内容放置在一个空节点weapon上,控制逻辑挂在weapon上,实现逻辑的控制。要注意几个节点的锚点,根据...原创 2019-09-29 15:21:07 · 1285 阅读 · 1 评论 -
Cocos Creator下JavaScript模拟砸金蛋3d旋转效果,附代码
获取代码关注微信公众号,发送【砸蛋】获取代码效果预览使用说明点击add,添加蛋到盘子上,蛋的数量后台可配置;点击move,让蛋在盘子上转动起来;点击stop,让蛋停止转动。蛋旋转效果实现椭圆定义平面内与两定点、的距离的和等于常数()的动点P的轨迹叫做椭圆。即:其中两定点、叫做椭圆的焦点,两焦点的距离叫做椭圆的焦...原创 2019-09-30 14:45:13 · 1142 阅读 · 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 · 1306 阅读 · 0 评论