魔改和上线你的合成大西瓜,最全教程!

魔改和上线你的合成大西瓜,最全教程!

本文是从 0 到 1 的教程,让小白也能够魔改和上线发布属于你的合成大西瓜!

最近,一款名为『 合成大西瓜 』的游戏突然火了!看来真的是大家吃瓜吃太多了,这个小游戏深抓人心!

当然,游戏本身非常有趣,玩法简单,就是俄罗斯方块、2048、水果忍者的结合,控制水果的下落,相同的两个水果会合成更大的水果,然后消除,并发出溅射效果。

玩了一会后,看到朋友圈的晒图,我也安耐不住了,开始思考怎么拿高分。对于程序员来说,最简单的方式就是直接改造程序。

正好在知乎上偶然刷到了一个相关问题,“ 小游戏《合成大西瓜》源代码有吗?”

那就开工吧!

首先去 GitHub 搜索源代码,发现源码已经被曝光的稀巴烂了,然后就下载了一份源代码到本地,摩拳擦掌。

浏览源码后,发现只是魔改一些基础功能的话,不要太简单!

这是我魔改的自定义加分版,轻轻松松千万分!可在线玩:https://dadaxigua.liyupi.com

因此,我们需要在本地搭建一个 web 服务器,以支持 http 协议访问。

最简单的方式就是使用 serve 工具。只需三步,就能使用,已完成的步骤可以直接跳过:

  1. 安装 Node 和 npm

Node 是服务器端运行 Js 代码的引擎;npm 则是依赖包管理工具,可以轻松安装工具和代码类库。

进入 Node 中文网 http://nodejs.cn/download/,下载 Node.js,会自动安装 npm。

安装成功后,进入命令行 cmd,输入命令来判断 npm 是否安装成功:

npm -v

输出版本号,则安装成功:

安装成功
  1. 一行命令安装 serve 工具:

npm i -g serve

  1. 进入源代码目录(我这里是 daxigua),启动 serve:

serve

启动成功后,打开浏览器访问 localhost:5000 即可!

启动成功

动手魔改及原理

在魔改前,我们要先认清游戏过程,然后根据自己要修改的内容去找对应的文件,再做修改。

游戏的过程是:点击鼠标 => 水果下落 => 水果碰撞 => 计算分数 => 展示分数

下面列举几种简单的魔改方式,包括改游戏分数、替换游戏图片、无敌模式、控制水果生成、由大水果合成小水果、让水果更 Q 弹等。

(部分创意源于 B 站 UP GJhuxiao,给大佬跪了!)

1. 改分数

拿到源代码后,怎么最快的定位要修改哪里呢?

通过分析游戏过程,发现改分数有两种实现方式,在计算分数阶段修改,或者直接修改最后要展示的分数。

再简单浏览下项目里的各个文件,发现 project.js 就是影响游戏逻辑的核心文件。

那么很简单,直接在 project.js 中搜索代码。分数对应的英文单词是 "score" ,添加分数的英文单词是 "addScore",搜搜看能不能找到线索。

果然,很快就发现了,分数是由 default.score 变量作为统计值的,有这么一行代码:

a.default.score += this.fruitNumber + 1

显然,"+1" 是参与分数计算的,那我只要把基数 "1" 改为自己定义的数字即可~

// extraScore 可以自己改为任意值
a.default.score += this.fruitNumber + extraScore

当然也可以在进入游戏前让用户自己输入!我在 project.js 开头加入了这样一段代码:

// 让用户输入分数加成
let extraScore;
let extraScoreStr = '';

// 输入有效数字才进入游戏
while (isNaN(extraScore)) {
  extraScoreStr = prompt('请输入分数加成数字', '1').trim();
  extraScore = parseInt(extraScoreStr);
}

效果如下:

这里 B 站 UP GJhuxiao 哥提供了非常好的思路,增加一个条件判断,而不是修改原有判断逻辑,极大地方便大家修改!

4. 控制水果生成

能不能控制下一个水果是什么呢?比如每次都出现大西瓜。

当然,同样的思路,先找到水果生成的逻辑在代码的哪个位置。通过搜索 "fruit"、"create" 等关键字,定位到了这段代码:

先在命令行通过 npm 命令安装 Vercel:

npm install -g vercel

安装完成后,进入 index.html 所在目录(我的是 daxigua),使用 vercel 命令发布网站:

cd daxigua
vercel --prod

然后会让你输入一些选项,比如项目名称、是否修改配置等,一路回车就可以了~

发布成功,会得到一个网址,打开就可以看到游戏啦,还可以把网址分享给别人!

发布成功

最后

通过这个小游戏,我们能够看到大家各种奇思妙想的创意,在乐趣之外,还能学习一些编程小知识,何乐而不为呢?

可惜由于工作,我没有时间去完成自己的其他创意啦,比如水果爆炸、水果围城、反重力 ?

大家还有什么好的创意欢迎在评论区告诉我吧!

以上所有代码和文档都发布到了我的 GitHub,且持续更新~

本站文章资源均来源自网络,除非特别声明,否则均不代表站方观点,并仅供查阅,不作为任何参考依据!
如有侵权请及时跟我们联系,本站将及时删除!
如遇版权问题,请查看 本站版权声明
THE END
分享
二维码
海报
魔改和上线你的合成大西瓜,最全教程!
最近,一款名为『 合成大西瓜 』的游戏突然火了!看来真的是大家吃瓜吃太多了,这个小游戏深抓人心!
<<上一篇
下一篇>>