mota-js/docs/start.md
2017-12-16 00:16:55 +08:00

9.2 KiB
Raw Blame History

快速上手

在这一节中,将详细介绍做一部塔的流程。现在,让我们来做一部单层塔!

前置需求

你需要有满足如下条件才能进行制作:

  • Windows 8以上操作系统Windows 7需要安装.Net Framework 4.0。(能打开同目录下的“地图生成器.exe”即可
  • 任一款现代浏览器。强烈推荐Chrome。
  • 一个很好的文本编辑器。推荐带有高亮染色、错误提示等效果。例如WebStormVSCode或者至少也要Sublime Text。
    VSCode下载地址,群里的群文件中也有,强烈推荐之。)
  • RPG Maker XP任一个魔塔样板推荐魔塔样板7630

只要满足了上述条件,你就可以开始做自己的塔啦!

新建剧本

类似于RMXP本塔每层楼都是一个“剧本”剧本内主要定义了本层的地图和各种事件。主函数将读取每个剧本并生成实际的地图供游戏使用。

我们打开 libs/floors/ 目录这个目录是所有剧本的目录。我们需要指定一个楼层名例如MT1然后我们可以将MT0.js(模板)复制重命名为为MT1.js,并使用文本编辑器打开。

新建剧本

然后将楼层名改为MT1floorId改名为MT1title可以改成任意内容将在切换楼层时进行显示比如可以改成“1层小塔”

具体样板文件的每个要素都有详细的注释。我们最终的任务其实是,将每个楼层的剧本(地图&事件)给写完即可。

换句话说,只需要简单的复制操作,我们就可以新建一个剧本了。

绘制地图

遗憾的是我们的样板是没有像RMXP那样有着很好的UI界面供大家直接进行绘图可视化操作的。然而我们仍然可以利用已有的RMXP和魔塔样板绘制好地图然后利用目录中的“地图生成器”来转成样板所识别的格式。

首先我们打开RMXP和魔塔样板来到绘制地图页面。

绘制地图

然后,任意绘制一张地图。

在这里我们就以1层小塔的地图为例。你也可以任意绘制自己的地图。

绘制地图

(我把原塔素材改成了经典样式,但是本质上是一样的。)

请注意,我们无需编辑任何事件。只需要让地图“看起来长成这个样子”就行。

当绘制好需要的地图后我们打开Windows自带的“截图工具”并将整个地图有效区域截图下来并将其复制到剪切板。

绘制地图

截图时请注意:只截取有效游戏空间内数据并且有效空间内的范围必须是13x13。如果地图小于13*13请用星空或墙壁填充到13x13

确认地图的图片文件已经复制到剪切板后我们打开工具中的“地图生成器”并点“加载图片”。大约1-2秒后可以得到地图的数据。

生成地图

如果有识别不一致的存在即生成的地图和实际的地图不符则需要在左边的输入框内实际手动修改然后再点“图片生成”即可。有关每个数字对应的图块名称请参见images目录下的meaning.txt

!> 注1地图生成器默认只支持经典素材。如果有自定义素材需求例如原版的1层小塔那种素材请参见自定义素材
!> 注2请确保截图范围刚好为13x13并且保证每个位置的像素都是32x32。

经过确认生成的地图和原始地图保持一致后点击“复制地图”然后粘贴到刚刚剧本文件里的maps中。

地图数组

通过这种在RMXP中画图截图复制再用地图生成器识别的方式我们成功将我们需要的地图变成了样板可识别的格式。

录入数据

有了地图后,我们下一步需要做的就是录入数据。数据主要包括如下几种:

  • 勇士初始的属性
  • 全局变量宝石效果、全局Flag等
  • 怪物数据(每个怪物的攻防血金币经验等等)

下面依次进行说明。

我们打开data.js文件,这里面定义了各种全局属性和勇士初始值。

我们可以将本塔标题改名为“1层小塔”

游戏的唯一标识符叫onefloor然后可以直接修改勇士的各项初始数据.

!> name作为游戏的唯一标识符必须进行修改否则可能会导致存档等出现问题。

初始数据

!> 请注意勇士的初始位置一栏x为横坐标y为纵坐标x为从左到右第几列y为从上到下第几行均从0开始计算。

修改完初始化信息后,接下来我们需要修改道具的信息(比如宝石加攻防的数值,血瓶加生命的数值等)。还是在这个data.js文件往下拉找到values一项并进行相应的设置

修改数据

然后再设置一些系统Flag以进行游戏。继续将data.js往下拉我们注意到本塔是存在魔防的不存在经验因此我们可以简单地将enableMDef改为trueenableExperience改成falseenableDebuff改成false。

同理,本塔的破墙镐只能破面前的墙壁,因此pickaxeFourDirections需要改成false

系统标志

其他的几项暂时不会被涉及到,因此不用考虑。

全局变量修改完毕后,我们需要告诉主函数加载该楼层。打开main.js该文件和index.html同级找到this.floorIds将其值改为楼层ID即MT1。

修改楼层数据

最后一步就是录入怪物数据。打开enemys.js文件依次输入你在本塔内使用到的所有怪物的攻防血的数据。其中怪物的特殊属性special项与该文件下面的getSpecialText对应。

怪物数据

只需要修改自己用到的怪物属性即可,其他没有用到的怪物完全无所谓。

做完后保存所有文件然后右键选择使用chrome浏览器打开index.html,就能立刻看到自己的塔并开始游戏啦!是不是很简单呢!

保存

压缩与发布

当你将上述步骤完成后,你实际上已经做出来了一个魔塔,并且可以发布给大家进行游戏了。 目前而言发布有如下几种方式:

  • 离线版本:直接将游戏文件夹打包,放到百度网盘等地方供用户下载;用户下载到本地后直接使用浏览器打开index.html进行游戏。
    • 手机端的部分浏览器如chrome也支持本地网页可以下载到手机然后直接打开进行游戏。
  • 在线版本:将游戏放到某个服务器上,大家在线联网游戏。

离线版本的好处是:先全部下载后再游戏,无需考虑流量的问题,也可以支持高清音乐的播放。坏处是:没办法在多平台之间迁移,无法及时获得游戏更新(需要重新下载),而浏览器打开本地文件有丢失存档的风险。
在线版本的好处是:随时随地可以玩,可以多平台接档,还可以在后台看到一些统计信息,可以随时对游戏进行更新;坏处是需要一个服务器,且还要考虑到用户流量的问题。

在此我们只讨论在线版本。当你决定发布游戏时强烈建议先将JS代码进行压缩以节省可能的IO请求以及网络流量。直接打开同目录下的“JS代码压缩工具”进行压缩即可。

压缩完毕后,你还需要将main.js中的useCompress从false改为true这样方才只会加载压缩后的文件。

如果你需要发布到服务器上且你没有服务器,可以直接将本塔发给我(艾之葵),我会给负责你部署上去的。我的服务器至少能保证两年内有效。

然后就是发布帖子、链接二维码,能让任何人在任何时候任何平台上都能进行游戏啦!是不是很简单呢!

注意事项和常见FAQ

  1. 截图请务必刚好截取13x13的图片并需要保证每个位置必须为32x32像素。一般无放缩的RMXP符合条件。
  2. 游戏的唯一标识符name请务必修改。如果不修改可能会导致存档出现异常。
  3. 别忘了main.js中要修改floorIds指明所用到的所有楼层哦~

下面是几个常见的FAQ

Q: 为什么截图识别不出来?

A: 请保证刚好为13x13且每个位置必须32x32像素。如果不确定可以保存你的截图右键属性查看详细信息看像素的宽高是不是在416左右。多少几十像素都是没关系的。

图片大小

Q: 打开游戏时卡死在了xxx.js加载完毕无法进入游戏。

A: 最大的可能是因为少了逗号或者反括号等等。一般而言VSCode都会有错误提示你哪里少了东西。

如果没有可以采用如下方式debug

Ctrl+Shift+I 打开Chrome的控制台找到Console。

如果出现了语法错误,会有红色提示 Unexpected xxx 找到后面文件名和行号打开使用VSCode检查该处是否存在问题即可。

检查错误

==========================================================================================

继续阅读下一章:元件说明