别再看碎片的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游戏开发中的贴花效果

相关推荐
hboot4 小时前
别再被 TS 类型冲突折磨了!一文搞懂类型合并规则
前端·typescript
在西安放羊的牛油果4 小时前
浅谈 import.meta.env 和 process.env 的区别
前端·vue.js·node.js
鹏北海4 小时前
从弹窗变胖到 npm 依赖管理:一次完整的问题排查记录
前端·npm·node.js
布列瑟农的星空4 小时前
js中的using声明
前端
薛定谔的猫24 小时前
Cursor 系列(2):使用心得
前端·ai编程·cursor
用户904706683574 小时前
后端问前端:我的接口请求花了多少秒?为啥那么慢,是你慢还是我慢?
前端
深念Y4 小时前
仿B站项目 前端 4 首页 顶层导航栏
前端·vue·ai编程·导航栏·bilibili·ai开发
dragonZhang4 小时前
基于 Agent Skills 的 UI 重构实践:从 Demo 到主题化界面的升级之路
前端·ai编程·claude
王林不想说话4 小时前
提升工作效率的Utils
前端·javascript·typescript
weixin_584121435 小时前
vue内i18n国际化移动端引入及使用
前端·javascript·vue.js