别再看碎片的Cocos开发教程了,这份可能是全网最细打螺丝教程

引言

哈喽大家好,今天笔者做了一个重要决定:

把我的打螺丝游戏核心玩法(源码+教程)全部分享给大家。

**《打螺丝》**这款游戏,成功把现象级的"进厂"概念,从网络热梗拉到了游戏中去。

它通过 简单、解压的玩法,让小伙伴们可以上班摸鱼时打、下班休闲时打、睡觉前再打两把,成为了一款非常受欢迎的轻量级游戏。

目前在小游戏畅玩榜上,依旧可以看到它及其各种变种玩法的身影,证明了其核心机制的生命力。

言归正传 ,今天给大家介绍一下如何在Cocos Creator3.8.7中实现打螺丝游戏的核心玩法,学废的小伙伴帮忙点个赞和爱心,让更多的小伙伴也学废。

本文源工程在文末获取,小伙伴们自行前往。

一. 螺丝

螺丝是可交互的核心物件。它的实现需要包含以下特性:

1.物理属性

需要 添加 RigidBody2D (刚体)和 CircleCollider2D(碰撞体),使其能产生物理效果与木板发生碰撞。

2.抓取与移动

抓取的实现比较简单,分别准备按下和拔起两种状态的图片。

通过监听点击事件,分别在按下和拔起的状态下隐藏和显示对应的图片即可。

效果如下:

移动的实现也比较简单,先拔起螺丝,然后点击对应没有阻挡的螺丝孔时,按下螺丝并且移动到新的孔位。

效果如下:

移动的难点在于动态移除旧关节,移动到新孔位生成新的关节,下面我们会在关节中介绍。

3.动画效果

螺丝无法移动时播放震动动画,给予用户视觉反馈。震动效果我们可以通过Tween动画实现。

效果如下:

二.螺丝孔

螺丝孔是螺丝的"归宿",通常固定在墙上。

关于螺丝孔,最主要是要知道点击时,点击的是哪个孔,我们只需要给孔添加点击事件即可。

但是很多情况下,孔会被木板遮挡,所以我们可以选择遍历所有孔通过距离找到我们需要的孔。

此外,我们想要判断木板上的孔是否遮挡螺丝孔,我们可以通过两个圆的圆心距离在合适的阈值范围内进行判断。

代码如下:

三.木板

木板是整个游戏的承载基础,上面通常会有若干个孔,螺丝通过它把木板固定在墙上。

1.物理属性

螺丝一样,需要添加 RigidBody2D (刚体)和 BoxCollider2D(碰撞体),使其能产生物理效果。

2.位置判断

我们的螺丝是否能移动到某个螺丝孔,很大层度取决于孔是否被木板阻挡,因此我们需要进行判断。

首先 是木板与孔的位置判断。需要分成2步判断:

  • 1.判断孔与木板是否相交
  • 2.判断孔是否在木板内

代码如下:

四.关节

在Cocos游戏开发中的物理系统,想要一个物体围绕某个点旋转,我们可以使用铰链关节。

关于关节的使用,我们通常需要指定它连接的节点,以及节点的相对位置。

例如,在木板上,我们需要添加两个关节节点,方便在代码中找到指定的关节,和它的相对位置。

这样我们就可以得到木板受重力影响的运动效果:

上面提到的关节的动态添加:

五.效果演示

关卡1:

关卡2:

结语

以上就是我的打螺丝游戏核心玩法的全部分享。

不知道小伙伴们都学废了吗?

本文实战源码 可通过阅读原文获取,内含体验链接。


我是"亿元程序员",一位有着8年游戏行业经验的主程。在游戏开发中,希望能给到您帮助, 也希望通过您能帮助到大家。

AD:笔者线上的小游戏《打螺丝闯关》《贪吃蛇掌机经典》《重力迷宫球》《填色之旅》《方块掌机经典》大家可以自行点击搜索体验。

实不相瞒,想要个爱心 !请把该文章分享给你觉得有需要的其他小伙伴。谢谢!

推荐文章:

亿元Cocos小游戏实战合集

Cocos游戏如何接入安卓穿山甲广告变现?

你知道和不知道的微信小游戏常用API整理,赶紧收藏用起来~

Cocos游戏如何快速接入抖音小游戏广告变现?

如何在CocosCreator3.8中实现割绳子游戏效果

如何在CocosCreator3.8中实现动态切割模型?

Cocos游戏开发中的贴花效果

相关推荐
程序员清洒4 分钟前
Flutter for OpenHarmony:GridView — 网格布局实现
android·前端·学习·flutter·华为
VX:Fegn08957 分钟前
计算机毕业设计|基于ssm + vue超市管理系统(源码+数据库+文档)
前端·数据库·vue.js·spring boot·后端·课程设计
0思必得016 分钟前
[Web自动化] 反爬虫
前端·爬虫·python·selenium·自动化
LawrenceLan26 分钟前
Flutter 零基础入门(二十六):StatefulWidget 与状态更新 setState
开发语言·前端·flutter·dart
秋秋小事1 小时前
TypeScript 模版字面量与类型操作
前端·typescript
2401_892000521 小时前
Flutter for OpenHarmony 猫咪管家App实战 - 添加提醒实现
前端·javascript·flutter
Yolanda941 小时前
【项目经验】vue h5移动端禁止缩放
前端·javascript·vue.js
广州华水科技3 小时前
单北斗GNSS形变监测一体机在基础设施安全中的应用与技术优势
前端
EndingCoder3 小时前
案例研究:从 JavaScript 迁移到 TypeScript
开发语言·前端·javascript·性能优化·typescript
阿珊和她的猫4 小时前
React 路由:构建单页面应用的导航系统
前端·react.js·状态模式