竹知了很火?于是我用Cocos做了一个

引言

哈喽大家好,我是亿元程序员,一位有着8年游戏行业经验的主程。

不知道 小伙伴们最近有没有留意到,有个叫竹知了的玩具火了起来,小伙伴们小时候有没有玩过?

笔者回想起来,小时候路边摊几块钱就能买到的小玩意儿,声音又响又闹,常常玩不了多久就被大人没收。

如今再想找一件实物,却已经不太容易了。

于是 ,我打算用Cocos 做一个,与此同时,授人以鱼不如授人以渔 ,本期带大家一起看看如何在Cocos中实现一个竹知了的小游戏,大家学会了记得点个免费的小红心,谢谢大家!

注意,本期内容不讨论竹知了背后的故事,只探讨如何快速做一个竹知了的小游戏,仅供学习和参考。

一. 实战前夕

磨刀不误砍柴工,实战之前做足准备:

1. 下载Cocos

打开官网,我们直接点击下载:

跳转之后 再次点击下载,完成CocosDashboard的下载安装。

2. 安装编辑器

打开 CocosDashboard,点击安装->安装编辑器->选择我们合适引擎版本->这里我们选择3.8.7

3. 新建项目

编辑器 安装好之后,我们新建一个名为zhuzhiliao2D空项目:

4. 准备素材

本期游戏素材均通过AI生成,请注意甄别。

我们 找到搭子生成竹知了最关键的两个部件(竹竿和竹知了 )和背景 ,并且放到项目的textures目录下:

二. 场景编辑

1. 界面拼接

首先 ,将我们的图片全部拖到Canvas下:

然后,简单调整一下每个图片的位置:

这个简单,还有吗?

2. 添加组件

接着 分别给竹竿和知了添加碰撞和刚体组件,并且根据自己喜好调整对应的参数:

不知道 怎么添加的小伙伴直接点面板下面的添加组件按钮,在弹出框输入搜索并且选择即可添加:

添加完成 之后,点上方的播放按钮即可看到效果(怎么知了会跑?):

那怎么办?

3. 添加约束

为了 避免知了跑掉,我们需要给它添加一个约束,这里我们用的是距离关节DistanceJoint2D

记得还要调整一下关节的两个锚点到正确的位置:

再次运行,就可以看到知了被约束了:

是不是少了点什么?没错,是绳子!

三. 画绳子

1. 新建脚本

在资源管理器中 右键scripts目录,新建一个脚本:

2. 编辑脚本

用脚本编辑器 打开脚本,添加上方若干个属性,并且在OnLoad方法中添加常用的画线组件Graphics:

然后update方法中简单粗暴地进行画线即可:

3. 添加脚本

添加自定义脚本,我们同样可以直接从下方拖上来,并且设置指定的属性即可:

4. 看看效果

再次运行之后就可以看到绳子了!

四. 交互

竹知了这个玩具的关键的交互就是甩,通过甩竹竿让知了转动起来,下面我们一起来看看。

1. 点击事件

OnEnable方法中添加常用的四个点击事件以及对应的实现:

2. 原理

原理 其实很简单,因为我们用的是Cocos 内置的物理系统,我们只需要和竹竿进行交互即可,其余甩知了相关就交给系统就行,想要详细了解的小伙伴可以翻阅官方文档。

3. 效果演示

完成上次处理即可得到文章开头的效果:

五. 更近一步

看到这里的小伙伴应该发现了,还缺少两个灵魂,由于篇幅问题就简单描述下,小伙伴们可以自行补充:

  • 1. 声音 :知了转起来的时候应该是有声音的,可以通过AudioSource组件实现。

  • 2. 物理操控 :实战是通过按压屏幕甩知了,真正要模拟玩具的话,还要支持甩手机来甩知了,可通过设备重力传感事件Input.EventType.DEVICEMOTION来完成。

结语

小伙伴们都学废了吗?(为避免一些不必要的麻烦,本期就不提供原工程,都在文章里了。)

在哪里 可以学到这么清晰细致的游戏开发思路?关注我,跟上我的节奏!


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

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

推荐文章:

亿元Cocos小游戏实战合集2.0

亿元Cocos小游戏实战合集1.0

老板说最近这款游戏很火让我抄,可是我连玩都玩不明白...

这款值68亿的游戏,你不实战一下吗?安排!

小伙伴说我的拼图游戏用Mask不能合批...

俄罗斯方块谁不会做......啊?流沙版?

最近很火的一个拼图游戏,老板让我用Cocos3.8做一个...

老板说拼图游戏太卷了,让我用Cocos做个3d版本的...

敢不敢挑战用Cocos3.8复刻曾经很火的割绳子游戏?

相关推荐
网安蟹佬霸21 分钟前
区块链与智能合约安全实战:从Solidity审计到DeFi漏洞深度剖析
运维·前端·网络·安全·自动化·区块链·智能合约
念何架构之路25 分钟前
Gin响应渲染
前端·javascript·gin
invicinble30 分钟前
设计网站的底层思路(深刻版本)
前端
三8441 小时前
WordPress REST API 参数校验机制剖析:为什么 author__not_in 无法直接盲注?
服务器·前端·数据库
ITmaster07311 小时前
Vibe Coding 时代:Vue 消失了还是 React 太强?
前端·vue.js·react.js
WebInfra1 小时前
Rspack 2.2 发布:30+ 项性能优化,拥抱 Solid 2.0
前端·javascript·前端框架
额额额对了1 小时前
Linux 进程管理详解:从概念到实战
java·服务器·前端
fatcoder1 小时前
玩转 Redis · Set 篇
前端·redis·后端
爱喝麻油的小哆1 小时前
🐾 Day 5|桌面数字人-接入llm可以对话啦
前端·three.js
我叫黑大帅1 小时前
关于没有对生产者做校验的思考
前端·面试·架构