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

引言

哈喽大家好,我是亿元程序员,最近有小伙伴求助笔者:

亿哥,是这样的,最近不是有一个比较火的拼图游戏吗?

很多 直播间都在播这款游戏,老板看到后,让我用Cocos3.8做一个...

这个拼图游戏,看似简单,实际上好像也不难,但是我不知道怎么下手,可以帮忙分析一下怎么实现吗?

好巧不巧,笔者也看到了这款游戏,正准备蹭下热点,并且加入到我的小游戏合集当中去。

言归正传 ,本期带大家一起来看看,如何在Cocos游戏开发中,实现一个目前很火的拼图游戏

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

什么是拼图游戏?

拼图游戏是一种将碎片化的组件拼接成完整图案的益智类游戏,核心玩法是让玩家通过观察、推理和动手操作,把打乱的零散拼块组合成预设的目标图像。

玩过拼图游戏的小伙伴都知道,游戏的过程是把散的图还原成一幅完整的图片。

但是,在开发这款游戏的第一步,我们需要把一幅完整的图片打散。

打散图片

看到这里,有小伙伴可能就跃跃欲试:

打散图片这个我懂!让美术妹子按照比例等比切割出来,然后把散图丢给我就好了,嘿嘿!

美术妹子:"我谢谢你!"

这样操作也不是不行,但是大概率会被美术妹子吐槽一番。

因为 很多时候,拼图的难度是由拼图的片数决定,图片输出时,并不能马上决定是拆成多少张,假如输出了3*3,结果策划觉得不合适又要改成4*4,这样美术妹子又得返工了,显然不合理。

于是,我们需要将完整的图片,在游戏中动态切割成指定数量的散图,这样才能减少美术的工作量。

动态纹理分割

拼图游戏中的动态纹理分割就是根据传入的纹理图片,按照指定的行列数动态切割并创建对应的拼图块。

在Cocos游戏开发中,通常可以通过以下几步:

1. 通过Rect 根据纹理需要拆解的数量,计算并通过行列指定裁剪区域。 2. 创建SpriteFrame 精灵帧,将纹理和裁剪区域赋值给它。 3. 将精灵帧 赋值给Sprite

这样 我们就成功将图片变成了拼图碎片,那怎么拼回去呢?

如何判断拼图完成

我们拼图拆分后,通常需要将碎片打散,打散前,我们需要记录拼图的正确顺序。

然后可以通过随机函数将拼图打散。

由于是随机打散,有可能打散后拼图已经差不多完成,导致游戏性降低。

因此我们可以通过随机多次并判断,直到拼图足够散,甚至我们可以通过配置去固定拼图的初试顺序,保证难度一致。

最后玩家通过拖拽拼图和指定拼图交换,直到所有拼图碎片都回到正确的位置之后,即可通关游戏。

既然如此简单,那这款游戏凭什么火?

与普通拼图不同的点

1. 拼图合并

当拼图局部拼正确时,会自动合并成一块整体,拖动时变成整体移动。

合并 的逻辑也比较简单,当相邻的拼图(左右、上下)处在同一行或者同一列时,他们的行或者列相差1则可以进行合并。

合并只需要将合并的拼图块分成同一个组,表示已经合并。

移动的时候 ,根据组ID拿到所有的拼图块,移动的时候整体按照偏移移动即可。

2. 拼图整体交换

由于上面的合并规则,移动时可能不再是一换一,而是多换多,从而导致拼图被"挤走"替换。

整体交换的逻辑相对复杂一点,需要找到拼图被挤走后,填充到哪个空位。

核心代码如下:

3. 其他

除了上述玩法规则的创新以外,其实还有很多其他火的特点。

  • 游戏简单 :拼图游戏适合下至3岁小孩、上至80老人都能很好的入手。
  • 反馈清晰:由于拼图自动合并成块的规则,玩家可以清晰地看到游戏的完成进度,吸引路人。
  • 适合直播 :游戏可以开启数字角标模式,方便观众在直播间与主播互动。

结语

拼图游戏和箭头游戏一样,有着天生的直播体质,错过了箭头游戏的小伙伴,可以尝试一下拼图游戏这个赛道哦。

小伙伴们,如果老板让你这么做,你会怎么做?

本文实战完整源码 已集成到亿元Cocos小游戏实战合集,内含体验链接。


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

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

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

推荐文章:

亿元Cocos小游戏实战合集

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

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

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

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

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

Cocos游戏开发中的贴花效果

相关推荐
fanruitian1 小时前
uniapp android开发 测试板本与发行版本
前端·javascript·uni-app
rayufo1 小时前
【工具】列出指定文件夹下所有的目录和文件
开发语言·前端·python
RANCE_atttackkk1 小时前
[Java]实现使用邮箱找回密码的功能
java·开发语言·前端·spring boot·intellij-idea·idea
2501_944525543 小时前
Flutter for OpenHarmony 个人理财管理App实战 - 支出分析页面
android·开发语言·前端·javascript·flutter
李白你好4 小时前
Burp Suite插件用于自动检测Web应用程序中的未授权访问漏洞
前端
刘一说5 小时前
Vue 组件不必要的重新渲染问题解析:为什么子组件总在“无故”刷新?
前端·javascript·vue.js
徐同保5 小时前
React useRef 完全指南:在异步回调中访问最新的 props/state引言
前端·javascript·react.js
刘一说6 小时前
Vue 导航守卫未生效问题解析:为什么路由守卫不执行或逻辑失效?
前端·javascript·vue.js
一周七喜h7 小时前
在Vue3和TypeScripts中使用pinia
前端·javascript·vue.js
weixin_395448917 小时前
main.c_cursor_0202
前端·网络·算法