引言
哈喽大家好,我是亿元程序员,一位有着8年游戏行业经验的主程。
不知道小伙伴们最近有没有留意到,有个叫竹知了的玩具火了起来,小伙伴们小时候有没有玩过?
笔者回想起来,小时候路边摊几块钱就能买到的小玩意儿,声音又响又闹,常常玩不了多久就被大人没收。
如今再想找一件实物,却已经不太容易了。
于是,我打算用Cocos做一个,与此同时,授人以鱼不如授人以渔,本期带大家一起看看如何在Cocos中实现一个竹知了的小游戏,大家学会了记得点个免费的小红心,谢谢大家!
注意,本期内容不讨论竹知了背后的故事,只探讨如何快速做一个竹知了的小游戏,仅供学习和参考。
一. 实战前夕
磨刀不误砍柴工,实战之前做足准备:
1. 下载Cocos
打开官网,我们直接点击下载:
跳转之后再次点击下载,完成CocosDashboard的下载安装。
2. 安装编辑器
打开CocosDashboard,点击安装->安装编辑器->选择我们合适引擎版本->这里我们选择3.8.7:
3. 新建项目
编辑器安装好之后,我们新建一个名为zhuzhiliao的2D空项目:
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年游戏行业经验的主程。在游戏开发中,希望能给到您帮助,也希望通过您能帮助到大家。
实不相瞒,想要个赞和爱心!请把该文章分享给你觉得有需要的其他小伙伴。谢谢!
推荐文章:

















