docs
This commit is contained in:
oc committed
1 parent
b52eefd07a
commit
29432b7a4d
53 files changed
+51
-417
No files matched your search
@@ -0,0 +1,89 @@
|
||||
# V2.0版本介绍
|
||||
|
||||
?> 目前版本**v2.5.4**，上次更新时间：* {docsify-updated} *
|
||||
|
||||
目前样板已经更新到V2.0版本以上，本章将对V2.0的一些内容进行介绍。
|
||||
|
||||
请确保已经看过前面的几个文档（2.0都有部分更新），前面已经描述过的东西这里将不再赘述。
|
||||
|
||||
也欢迎通过看B站的视频教程来具体了解2.0版本的使用方法。
|
||||
|
||||
## 目录结构的改变
|
||||
|
||||
在1.x中，所有数据和逻辑都是一体的，例如怪物数据和怪物伤害计算公式等等。这导致样板的版本更新时会十分不便。
|
||||
|
||||
在2.0中，我们将数据和逻辑进行了分离，拆分成了libs和project两个目录。
|
||||
|
||||
- libs目录为游戏核心库文件，包括一些游戏逻辑等内容
|
||||
- project目录为针对每个塔的目录，是和游戏逻辑是分离的。
|
||||
|
||||
我们只需要修改project目录下的各项内容，而无需去动libs目录（有特殊需求除外）；
|
||||
将来如果想把塔迁移到新的版本上，也只需要迁移project即可。
|
||||
|
||||
另外一点的就是，我们将libs目录中的core.js进行了拆分，从而使每个文件的具体工作更加一目了然，也避免了接近6K行的大文件会导致打开IDE的卡顿问题。
|
||||
|
||||
## 全GUI造塔
|
||||
|
||||
在1.X版本中，我们提供了一个地图编辑器。但是它的功能十分弱，只能进行绘图的功能，实际的各项操作还是需要通过VSCode打开js文件实际进行编写代码。
|
||||
|
||||
但是在2.0中，我们大大拓展了地图编辑器的功能，从而达到了“全GUI造塔”的功能，用户再也不用手动打开任何一个文件进行编辑了。
|
||||
|
||||
GUI界面分为`地图编辑器`，`事件编辑器`和`文本编辑器`。
|
||||
|
||||
!> 即使现在可以全GUI造塔，也强烈建议对1.X的造塔方式进行了解，因为这是一切的基础。
|
||||
|
||||
### 地图编辑器
|
||||
|
||||
地图编辑器分为三个区域，左侧的`编辑区`,中间的`画布区`,右侧的`素材区`。
|
||||
|
||||
画布区下方有切换地图和编辑器模式的下拉菜单,点击`保存地图`后画布的内容才会真正写入到js文件中。
|
||||
|
||||
在素材区点击图块时，会选中该图块，此时tips会显示该图块的信息，编辑区会进入图块属性模式，怪物或物品可以直接在里面编辑数值。如果图块的数字和ID没有被定义，则可以直接在左侧定义，**定义新图块后需要保存并刷新页面后才能生效**。
|
||||
|
||||
在tips中有图块信息时，在画布上点击或拖拽可以把图块画上去，可以使用ctrl+Z撤销操作以及对应的ctrl+Y恢复撤销。擦除方块可以使用素材区最左上角的擦除块。
|
||||
|
||||
点击界面中的空白，tips中的图块信息会被清空，此时再点击画布上的点，则编辑器会进入地图选点模式。此模式下可以编辑改点的`events`,`afterBattle`,`changeFloor`等事件或者是`canMove`来改变各方向的通行状态。
|
||||
|
||||
切换地图会使编辑区进入楼层属性模式，这里可以修改首次到达该楼层时会触发的事件`firstArrive`，楼层显示的名称，默认的前景背景图片，默认天气和色调等等。
|
||||
|
||||
!> 这里不允许编辑楼层的ID，需要修改ID的场合请直接改js文件，并保持三个标识符完全一致。`data.js`中的`floorIds`也需要对应进行修改。
|
||||
|
||||
全塔属性中编辑整个塔为单位的属性，例如起始剧情`startText`，`name`，提供哪些难度，主角的起始属性，全局商店，各种数值以及系统FLAG等。**创建新塔时需要认真编辑这里面的所有选项。**
|
||||
|
||||
脚本编辑模式可以修改常用的需要更改的函数。例如，给不同的难度设置不同的内容`setInitData`，加点`addPoint`，以及修改游戏中的关于界面`drawAbout`等等。
|
||||
|
||||
追加素材模式可以导入一个图片到该标签的画板中，然后依次点击画板中的图块，点追加就可以按顺序把这些图片添加到对应的画布区素材的最下方，**需要刷新来生效**。
|
||||
|
||||
地图编辑模式中可以导入来自地图生成器的地图数组，同时创建新楼层需要在这里通过另存为来实现，可以点清除地图把另存为出的新楼层清空。
|
||||
|
||||
!> 编辑区的表格可以直接修改，推荐通过双击，在事件编辑器和文本编辑器中进行编辑。编辑区中的修改需要点保存才会生效。
|
||||
|
||||
### 事件编辑器
|
||||
|
||||
地图选点中的事件类表格，以及楼层属性中的`firstArrive`和全塔属性的`startText`，在双击时会进入事件编辑器，是由[antlr-blockly](https://github.com/zhaouv/antlr-blockly)生成的图块式的可视化编辑器.
|
||||
|
||||
把左侧的方块拖到面板中，下方就会实时的显示对应的js的代码(以及数值不正确时的提示).
|
||||
|
||||
每个方块点击右键会展开一个菜单，点帮助可以跳转到此文档中对应的内容。利用好复制功能可以极大提高编辑的效率。注释选项请不要使用，编辑器并不会保留这里的注释。
|
||||
|
||||
`template`中提供了一些模板事件，例如战前剧情，打怪开门。
|
||||
|
||||
`显示文章`的两个方块，以及`自动剧情文本`，`选项`和`自定义JS脚本`这5个方块，可以通过双击在文本编辑器中(以多行的方式)编辑其中的文字。
|
||||
|
||||
### 文本编辑器
|
||||
|
||||
事件编辑器之外的内容双击后由文本编辑器来编辑，是有js高亮支持的多行文本编辑器[CodeMirror](https://github.com/codemirror/CodeMirror)，点confirm即可使编辑的文本替换到表格中。
|
||||
|
||||
### 拓展地图编辑器
|
||||
|
||||
> 面向有一定编程基础的用户
|
||||
|
||||
修改`_server/`下的`*comment.js`可以让地图编辑器对自己添加的属性有更好的支持.例如:
|
||||
+ 给`comment.js`中`enemys`加入新的键值对,就可以更方便的给怪物在UI界面中添加对应的值.
|
||||
+ 在`data.comment.js`中把自己添加的内容标记为叶节点,不再在表格中展开到最末端.
|
||||
|
||||
地图编辑器的部分API见`_server/README.md`
|
||||
|
||||
## 部分事件和API更新
|
||||
|
||||
在2.0中，有部分的事件和API存在更新，也增加了包括48x32素材的支持，在这里将不再赘述，请仔细阅读前面的几个文档进行了解。
|
||||
+367
@@ -0,0 +1,367 @@
|
||||
# 附录:API列表
|
||||
|
||||
?> 目前版本**v2.3.3**，上次更新时间：* {docsify-updated} *
|
||||
|
||||
所有系统支持的API都列在了这里。所有可能被用到的API都在前面用\*标记。
|
||||
|
||||
可以在chrome浏览器的控制台中（`ctrl+shift+I`，找到Console）中直接进行调用，以查看效果。
|
||||
|
||||
!> **`main.js`：游戏入口，所有其他JS文件都是被此文件加载。**
|
||||
|
||||
``` js
|
||||
main.init // 初始化
|
||||
main.loaderJs // 动态加载所有核心JS文件
|
||||
main,loaderFloors // 动态加载所有楼层（剧本）
|
||||
main.loadMod // 加载某一个JS文件
|
||||
main.loadFloor // 加载某一个楼层
|
||||
main.setMainTipsText // 加载过程提示
|
||||
window.onresize // 窗口大小变化时
|
||||
main.dom.body.onkeydown // 在界面上按下某按键时
|
||||
main.dom.body.onkeydown // 在界面上放开某按键时
|
||||
main.dom.body.onselectstart // 开始选择时
|
||||
main.dom.data.onmousedown // 鼠标按下时
|
||||
main.dom.data.onmousemove // 鼠标移动时
|
||||
main.dom.data.onmouseup // 鼠标放开时
|
||||
main.dom.data.onmousewheel // 鼠标滑轮滚动时
|
||||
main.dom.data.ontouchstart // 手指在触摸屏开始触摸时
|
||||
main.dom.data.ontouchmove // 手指在触摸屏上移动时
|
||||
main.dom.data.ontouchend // 手指离开触摸屏时
|
||||
main.statusBar.image.book.onclick // 点击状态栏中的怪物手册时
|
||||
main.statusBar.image.fly.onclick // 点击状态栏中的楼层传送器时
|
||||
main.statusBar.image.toolbox.onclick // 点击状态栏中的工具箱时
|
||||
main.statusBar.image.keyboard.onclick // 点击状态栏中的快捷商店时
|
||||
main.statusBar.image.save.onclick // 点击状态栏中的存档按钮时
|
||||
main.statusBar.image.load.onclick // 点击状态栏中的读档按钮时
|
||||
main.statusBar.image.settings.onclick // 点击状态栏中的系统菜单时
|
||||
main.dom.playGame.onclick // 点击“开始游戏”时
|
||||
main.dom.loadGame.onclick // 点击“载入游戏”时
|
||||
main.dom.replayGame.onclick // 点击“录像回放”时
|
||||
main.dom.easyLevel.onclick // 点击“简单难度”时
|
||||
main.dom.normalLevel.onclick // 点击“普通难度”时
|
||||
main.dom.hardLevel.onclick // 点击“困难难度”时
|
||||
```
|
||||
|
||||
!> **`core.js`：系统核心文件。所有核心逻辑处理都在此文件完成。**
|
||||
|
||||
``` js
|
||||
* core.status.floorId // 获得当前层floorId
|
||||
* core.status.thisMap // 获得当前层的地图信息
|
||||
* core.status.maps // 获得所有楼层的地图信息
|
||||
* core.floors // 获得所有楼层的剧本
|
||||
|
||||
// ------ 初始化部分 ------
|
||||
core.init // 初始化
|
||||
core.showStartAnimate // 显示游戏开始界面
|
||||
core.hideStartAnimate // 隐藏游戏开始界面
|
||||
core.setStartProgressVal // 设置加载进度条进度
|
||||
core.setStartLoadTipText // 设置加载进度条提示文字
|
||||
core.loader // 加载图片和音频
|
||||
core.loadAutotile // 加载Autotile
|
||||
core.loadImage // 加载图片
|
||||
core.loadMusic // 加载音频
|
||||
core.isPlaying // 游戏是否已经开始
|
||||
core.clearStatus // 清除游戏状态和数据
|
||||
core.resetStatus // 重置游戏状态和初始数据
|
||||
core.startGame // 开始游戏
|
||||
* core.restart // 重新开始游戏；此函数将回到标题页面
|
||||
|
||||
// ------ 键盘、鼠标事件 ------
|
||||
core.onKeyDown // 按下某个键时
|
||||
core.onKeyUp // 放开某个键时
|
||||
core.pressKey // 按住某个键时
|
||||
core.keyDown // 根据按下键的code来执行一系列操作
|
||||
core.keyUp // 根据放开键的code来执行一系列操作
|
||||
core.ondown // 点击（触摸）事件按下时
|
||||
core.onmove // 当在触摸屏上滑动时
|
||||
core.onup // 当点击（触摸）事件放开时
|
||||
core.getClickLoc // 获得点击事件相对左上角的坐标（0到12之间）
|
||||
core.onclick // 具体点击屏幕上(x,y)点时，执行的操作
|
||||
core.onmousewheel // 滑动鼠标滚轮时的操作
|
||||
|
||||
// ------ 自动寻路代码相关 ------
|
||||
core.clearAutomaticRouteNode // 清除自动寻路路线
|
||||
core.stopAutomaticRoute // 停止自动寻路操作
|
||||
core.continueAutomaticRoute // 继续剩下的自动寻路操作
|
||||
core.clearContinueAutomaticRoute // 清空剩下的自动寻路列表
|
||||
core.setAutomaticRoute // 设置自动寻路路线
|
||||
core.automaticRoute // 自动寻路算法，找寻最优路径
|
||||
core.fillPosWithPoint // 显示离散的寻路点
|
||||
core.clearStepPostfix // 清除已经寻路过的部分
|
||||
|
||||
// ------ 自动行走，行走控制 ------
|
||||
core.stopAutoHeroMove // 停止勇士的自动行走
|
||||
core.setAutoHeroMove // 设置勇士的自动行走路线
|
||||
core.autoHeroMove // 让勇士开始自动行走
|
||||
core.setHeroMoveInterval // 设置行走的效果动画
|
||||
core.setHeroMoveTriggerInterval // 设置勇士行走过程中对事件的触发检测
|
||||
core.moveAction // 实际每一步的行走过程
|
||||
* core.turnHero(direction) // 设置勇士的方向（转向）
|
||||
core.canMoveHero // 勇士能否前往某方向
|
||||
core.moveHero // 让勇士开始移动
|
||||
core.eventMoveHero // 使用事件让勇士移动。这个函数将不会触发任何事件。
|
||||
core.moveOneStep // 每移动一格后执行的事件。中毒时在这里进行扣血判断。
|
||||
core.waitHeroToStop(callback) // 停止勇士的一切行动，等待勇士行动结束后，再执行callback回调函数。
|
||||
core.stopHero // 停止勇士的移动状态。
|
||||
core.drawHero // 绘制勇士。
|
||||
* core.setHeroLoc(name, value) // 设置勇士的位置。name为”direction”,”x”,”y”
|
||||
* core.getHeroLoc(name) // 获得勇士的位置。
|
||||
* core.nextX // 获得勇士面对位置的x坐标
|
||||
* core.nextY // 获得勇士面对位置的y坐标
|
||||
|
||||
// ------ 地图和事件处理 ------
|
||||
* core.openDoor(id, x, y, needKey, callback) // 打开一扇位于 (x,y) 的门
|
||||
* core.battle(id, x, y, force, callback) // 进行战斗；force表示是否强制战斗
|
||||
core.afterBattle // 战斗完毕
|
||||
core.trigger(x,y) // 触发x,y点的事件
|
||||
* core.changeFloor(floorId, stair, heroLoc, time, callback) // 楼层切换。floorId为目标楼层Id，stair可指定为上/下楼梯，time动画时间
|
||||
core.mapChangeAnimate // 地图切换动画效果
|
||||
core.clearMap // 清除地图
|
||||
core.fillText // 在某个canvas上绘制一段文字
|
||||
core.fillRect // 在某个canvas上绘制一个矩形
|
||||
core.strokeRect // 在某个canvas上绘制一个矩形的边框
|
||||
core.drawLine // 在某个canvas上绘制一条线
|
||||
core.setFont // 设置某个canvas的文字字体
|
||||
core.setLineWidth // 设置某个canvas的线宽度
|
||||
core.saveCanvas // 保存某个canvas状态
|
||||
core.loadCanvas // 加载某个canvas状态
|
||||
core.setStrokeStyle // 设置某个canvas边框属性
|
||||
core.setAlpha // 设置某个canvas的alpha值
|
||||
core.setOpacity // 设置某个canvas的透明度
|
||||
core.setFillStyle // 设置某个canvas的绘制属性（如颜色等）
|
||||
* core.drawMap(mapId, callback) // 绘制某张地图。mapId为地图Id，绘制完毕将执行callback回调函数。
|
||||
core.drawAutotile // 绘制Autotile
|
||||
* core.noPassExists(x,y) // 某个点是否不可通行
|
||||
core.noPass // 某个点是否在区域内且不可通行
|
||||
* core.npcExists(x,y) // 某个点是否存在NPC
|
||||
* core.terrainExists(x,y) // 某个点是否存在（指定的）地形
|
||||
* core.stairExists(x,y) // 某个点是否存在楼梯
|
||||
* core.nearStair // 当前位置是否在楼梯边
|
||||
* core.enemyExists(x,y) // 某个点是否存在（指定的）怪物
|
||||
* core.getBlock(x, y, floorId, needEnable) // 获得某个点的block。floorId指定目标楼层，needEnable如果为false则即使该点的事件处于禁用状态也将被返回（否则只有事件启用的点才被返回）
|
||||
core.moveBlock // 显示移动某块的动画，达到{“type”:”move”}的效果
|
||||
core.animateBlock // 显示/隐藏某个块时的动画效果
|
||||
core.showBlock // 将某个块从禁用变成启用状态
|
||||
core.removeBlock // 将某个块从启用变成禁用状态
|
||||
core.removeBlockById // 根据block的索引删除该块
|
||||
core.removeBlockByIds // 一次性删除多个block
|
||||
core.addGlobalAnimate // 添加一个全局动画
|
||||
core.removeGlobalAnimate // 删除一个或所有全局动画
|
||||
core.setGlobalAnimate // 设置全局动画的显示效果
|
||||
core.syncGlobalAnimate // 同步所有的全局动画效果
|
||||
core.drawBoxAnimate // 绘制UI层的box动画
|
||||
core.updateCheckBlock // 更新领域、夹击、阻击的伤害地图
|
||||
core.checkBlock // 检查并执行领域、夹击、阻击事件
|
||||
core.snipe // 阻击事件（动画效果）
|
||||
core.setFg // 更改画面色调
|
||||
* core.updateFg // 更新全地图显伤
|
||||
* core.itemCount // 获得某个物品的个数
|
||||
* core.hasItem // 是否存在某个物品
|
||||
* core.setItem // 设置某个物品的个数
|
||||
* core.removeItem // 删除某个物品
|
||||
* core.useItem // 使用某个物品；直接调用items.js中的useItem函数。
|
||||
* core.canUseItem // 能否使用某个物品。直接调用items.js中的canUseItem函数。
|
||||
* core.addItem // 增加某个物品的个数
|
||||
core.getNextItem // 获得面前的物品（轻按）
|
||||
* core.getItem // 获得某个物品
|
||||
* core.drawTip // 左上角绘制一段提示
|
||||
* core.drawText // 地图中间绘制一段文字
|
||||
|
||||
// ------ 系统机制 ------
|
||||
core.replaceText // 将文字中的${和}（表达式）进行替换
|
||||
core.calValue // 计算表达式的值
|
||||
core.doEffect // 执行一个表达式的effect操作
|
||||
core.splitLines // 字符串自动换行的分割
|
||||
core.unshift // 向某个数组前插入另一个数组或元素
|
||||
core.setLocalStorage // 设置本地存储
|
||||
core.getLocalStorage // 获得本地存储
|
||||
core.removeLocalStorage // 移除本地存储
|
||||
core.clone // 深拷贝一个对象
|
||||
core.formatDate // 格式化时间为字符串
|
||||
core.formatDate2 // 格式化时间为最简字符串
|
||||
core.setTwoDigits // 两位数显示
|
||||
core.debug // 进入Debug模式，攻防血和钥匙都调成很高的数值
|
||||
core.replay // 开始回放
|
||||
core.checkStatus // 判断当前能否进入某个事件
|
||||
core.openBook // 点击怪物手册时的打开操作
|
||||
core.useFly // 点击楼层传送器时的打开操作
|
||||
core.openToolbox // 点击工具栏时的打开操作
|
||||
core.openQuickShop // 点击快捷商店时的打开操作
|
||||
core.save // 点击保存按钮时的打开操作
|
||||
core.load // 点击读取按钮时的打开操作
|
||||
core.openSettings // 点击设置按钮时的打开操作
|
||||
core.autosave // 自动存档
|
||||
core.doSL // 实际进行存读档事件
|
||||
core.syncSave // 存档同步操作
|
||||
core.saveData // 存档到本地
|
||||
core.loadData // 从本地读档
|
||||
core.encodeRoute // 将路线压缩
|
||||
core.decodeRoute // 将路线解压缩
|
||||
* core.setStatus // 设置勇士属性
|
||||
* core.getStatus // 获得勇士属性
|
||||
core.getLvName // 获得某个等级的名称
|
||||
* core.setFlag // 设置某个自定义变量或flag
|
||||
* core.getFlag // 获得某个自定义变量或flag
|
||||
* core.hasFlag // 是否存在某个自定义变量或flag，且值为true
|
||||
core.insertAction // 往当前事件列表之前插入一系列事件
|
||||
* core.lockControl // 锁定状态栏，常常用于事件处理
|
||||
* core.unlockControl // 解锁状态栏
|
||||
* core.isset // 判断某对象是否不为undefined也不会null
|
||||
core.readFile // 读取一个本地文件内容
|
||||
core.download // 下载文件到本地
|
||||
core.copy // 复制一段文字到剪切板
|
||||
* core.playBgm // 播放背景音乐
|
||||
* core.pauseBgm // 暂停背景音乐的播放
|
||||
* core.resumeBgm // 恢复背景音乐的播放
|
||||
* core.playSound // 播放音频
|
||||
core.show // 动画显示某对象
|
||||
core.hide // 动画使某对象消失
|
||||
core.clearStatusBar // 清空状态栏
|
||||
core.updateStatusBar // 更新状态栏
|
||||
core.resize // 屏幕分辨率改变后重新自适应
|
||||
core.domRenderer // 渲染DOM
|
||||
|
||||
// ------ core.js 结束 ------
|
||||
```
|
||||
|
||||
!> **`data.js` 定义了一些初始化的数据信息。**
|
||||
|
||||
!> **`enemys.js` 定义了怪物信息。**
|
||||
|
||||
``` js
|
||||
core.enemys.init // 初始化
|
||||
* core.enemys.getEnemys // 获得一个或所有怪物数据
|
||||
* core.enemys.hasSpecial // 判断是否含有某特殊属性
|
||||
* core.enemys.getSpecialText // 获得所有特殊属性的名称
|
||||
* core.enemys.getSpecialHint // 获得每个特殊属性的说明
|
||||
* core.enemys.getDamage // 获得某个怪物的伤害
|
||||
* core.enemys.getExtraDamage // 获得某个怪物的额外伤害
|
||||
* core.enemys.getCritical // 临界值计算
|
||||
* core.enemys.getCriticalDamage // 临界减伤计算
|
||||
* core.enemys.getDefDamage // 1防减伤计算
|
||||
* core.enemys.calDamage // 具体的伤害计算公式
|
||||
core.enemys.getCurrentEnemys // 获得当前楼层的怪物列表
|
||||
```
|
||||
|
||||
!> **`events.js` 定义了各个事件的处理流程。**
|
||||
|
||||
``` js
|
||||
core.events.init // 初始化
|
||||
core.events.getEvents // 获得一个或所有系统事件类型
|
||||
core.events.startGame // 游戏开始事件
|
||||
* core.events.setInitData // 不同难度分别设置初始属性
|
||||
* core.events.win // 游戏获胜事件
|
||||
* core.events.lose // 游戏失败事件
|
||||
core.evens.gameOver // 游戏结束
|
||||
core.events.afterChangeFloor // 转换楼层结束的事件
|
||||
core.events.doEvents // 开始执行一系列自定义事件
|
||||
core.events.doAction // 执行当前自定义事件列表中的下一个事件
|
||||
core.events.insertAction // 往当前事件列表之前添加一个或多个事件
|
||||
core.events.openShop // 打开一个全局商店
|
||||
core.events.disableQuickShop // 禁用一个全局商店
|
||||
* core.events.canUseQuickShop // 当前能否使用快捷商店
|
||||
* core.events.checkLvUp // 检查升级事件
|
||||
* core.events.useItem // 尝试使用道具
|
||||
core.events.addPoint // 加点事件
|
||||
core.events.afterBattle // 战斗结束后触发的事件
|
||||
core.events.afterOpenDoor // 开一个门后触发的事件
|
||||
core.events.passNet // 经过一个路障
|
||||
core.events.changeLight // 改变亮灯（感叹号）的事件
|
||||
* core.events.afterChangeLight // 改变亮灯之后，可以触发的事件
|
||||
* core.events.afterUseBomb // 使用炸弹/圣锤后的事件
|
||||
* core.events.beforeSaveData // 即将存档前可以执行的操作
|
||||
* core.events.afterLoadData // 读档事件后，载入事件前，可以执行的操作
|
||||
|
||||
// ------ 点击事件和键盘事件的处理 ------
|
||||
core.events.longClick // 长按
|
||||
core.events.keyDownCtrl // 按下Ctrl键时（快捷跳过对话）
|
||||
core.events.clickConfirmBox // 确认框界面时的点击操作
|
||||
core.events.keyUpConfirmBox // 确认框界面时，放开某个键的操作
|
||||
core.events.clickAction // 自定义事件时的点击操作
|
||||
core.events.keyDownAction // 自定义事件时，按下某个键的操作
|
||||
core.events.keyUpAction // 自定义事件时，放开某个键的操作
|
||||
core.events.clickBook // 怪物手册界面的点击操作
|
||||
core.events.keyDownBook // 怪物手册界面时，按下某个键的操作
|
||||
core.events.keyUpBook // 怪物手册界面时，放开某个键的操作
|
||||
core.events.clickBookDetail // 怪物手册属性显示界面时的点击操作
|
||||
core.events.clickFly // 楼层传送器界面时的点击操作
|
||||
core.events.keyDownFly // 楼层传送器界面时，按下某个键的操作
|
||||
core.events.keyUpFly // 楼层传送器界面时，放开某个键的操作
|
||||
core.events.clickViewMaps // 浏览地图界面时的点击操作
|
||||
core.events.keyDownViewMaps // 浏览地图界面时，按下某个键的操作
|
||||
core.events.keyUpViewMaps // 浏览地图界面时，放开某个键的操作
|
||||
core.events.clickShop // 商店界面时的点击操作
|
||||
core.events.keyDownShop // 商店界面时，按下某个键的操作
|
||||
core.events.keyUpShop // 商店界面时，放开某个键的操作
|
||||
core.events.clickQuickShop // 快捷商店界面时的点击操作
|
||||
core.events.keyDownQuickShop // 快捷商店界面时，按下某个键的操作
|
||||
core.events.keyUpQuickShop // 快捷商店界面时，放开某个键的操作
|
||||
core.events.clickToolbox // 工具栏界面时的点击操作
|
||||
core.events.clickToolboxIndex // 选择工具栏界面中某个Index后的操作
|
||||
core.events.keyDownToolbox // 工具栏界面时，按下某个键的操作
|
||||
core.events.keyUpToolbox // 工具栏界面时，放开某个键的操作
|
||||
core.events.clickSL // 存读档界面时的点击操作
|
||||
core.events.keyDownSL // 存读档界面时，按下某个键的操作
|
||||
core.events.keyUpSL // 存读档界面时，放开某个键的操作
|
||||
core.events.clickSwitchs // 系统设置界面时的点击操作
|
||||
core.events.keyDownSwitchs // 系统设置界面时，按下某个键的操作
|
||||
core.events.keyUpSwitchs // 系统设置界面时，放开某个键的操作
|
||||
core.events.clickSettings // 系统菜单栏界面时的点击事件
|
||||
core.events.keyDownSettings // 系统菜单栏界面时，按下某个键的操作
|
||||
core.events.keyUpSettings // 系统菜单栏界面时，放开某个键的操作
|
||||
core.events.clickSyncSave // 同步存档界面时的点击操作
|
||||
core.events.keyDownSyncSave // 同步存档界面时，按下某个键的操作
|
||||
core.events.keyUpSyncSave // 同步存档界面时，放开某个键的操作
|
||||
core.events.clickKeyBoard // 虚拟键盘界面时的点击操作
|
||||
core.events.clickAbout // “关于”界面时的点击操作
|
||||
```
|
||||
|
||||
!> `icons.js` 定义了素材ID和它在图片上的索引的对应关系。
|
||||
|
||||
!> `items.js` 定义了每个道具的名称，以及使用效果。
|
||||
|
||||
``` js
|
||||
core.items.init // 初始化
|
||||
core.items.getItems // 获得所有道具
|
||||
core.items.getItemEffect // “即捡即用类”道具的使用效果
|
||||
core.items.getItemEffectTip // “即捡即用类”道具的文字提示
|
||||
* core.items.useItem // 使用道具
|
||||
* core.items.cauUseItem // 当前能否使用道具
|
||||
```
|
||||
|
||||
!> `maps.js` 定义了数字-ID的对应关系。
|
||||
|
||||
``` js
|
||||
core.maps.loadFloor // 加载某个楼层（从剧本或存档中）
|
||||
core.maps.getBlock // 数字和ID的对应关系
|
||||
core.maps.addEvent // 向该楼层添加剧本的自定义事件
|
||||
core.maps.addChangeFloor // 向该楼层添加剧本的楼层转换事件
|
||||
core.maps.initMaps // 初始化所有地图
|
||||
core.maps.save // 将当前地图重新变成数字，以便于存档
|
||||
core.maps.load // 将存档中的地图信息重新读取出来
|
||||
core.maps.getMapArray // 将当前地图重新变成二维数组形式
|
||||
```
|
||||
|
||||
!> `ui.js` 定义了各种界面的绘制。
|
||||
|
||||
``` js
|
||||
core.ui.closePanel // 结束一切事件和绘制，关闭UI窗口，返回游戏进程
|
||||
core.ui.drawTextBox // 绘制一个对话框
|
||||
core.ui.drawChoices // 绘制一个选项界面
|
||||
core.ui.drawConfirmBox // 绘制一个确认/取消的警告页面
|
||||
core.ui.drawSwitchs // 绘制系统设置界面
|
||||
core.ui.drawSettings // 绘制系统菜单栏
|
||||
core.ui.drawQuickShop // 绘制快捷商店选择栏
|
||||
core.ui.drawBattleAnimate // 绘制战斗动画
|
||||
core.ui.drawWaiting // 绘制等待界面
|
||||
core.ui.drawSyncSave // 绘制存档同步界面
|
||||
core.ui.drawPagination // 绘制分页
|
||||
core.ui.drawEnemyBook // 绘制怪物手册
|
||||
core.ui.drawBookDetail // 绘制怪物属性的详细信息
|
||||
core.ui.drawFly // 绘制楼层传送器
|
||||
core.ui.drawMaps // 绘制浏览地图界面
|
||||
core.ui.drawToolbox // 绘制道具栏
|
||||
core.ui.drawSLPanel // 绘制存档/读档界面
|
||||
core.ui.drawThumbnail // 绘制一个缩略图
|
||||
core.ui.drawAbout // 绘制“关于”界面
|
||||
core.ui.drawHelp // 绘制帮助界面
|
||||
```
|
||||
@@ -0,0 +1,7 @@
|
||||
|
||||
- [快速上手](start)
|
||||
- [元件说明](element)
|
||||
- [事件](event)
|
||||
- [个性化](personalization)
|
||||
- [V2.0版本介绍](V2.0)
|
||||
- [附录：API列表](api)
|
||||
+222
@@ -0,0 +1,222 @@
|
||||
# 快速上手
|
||||
|
||||
?> 目前版本**v2.3.3**，上次更新时间：* {docsify-updated} *
|
||||
|
||||
在这一节中，将详细介绍做一部塔的流程。现在，让我们来做一部单层塔！
|
||||
|
||||
## 前置需求
|
||||
|
||||
你需要有满足如下条件才能进行制作：
|
||||
|
||||
- Windows 8以上操作系统；Windows 7需要安装.Net Framework 4.0。（能打开同目录下的“启动服务.exe”即可）
|
||||
- Chrome浏览器。其他浏览器可能会导致本地服务器产生闪退等现象。
|
||||
- 一个很好的文本编辑器。推荐带有高亮染色、错误提示等效果。例如：WebStorm，VSCode，或者至少也要Sublime Text。
|
||||
- （[VSCode下载地址](https://code.visualstudio.com/)，群里的群文件中也有，强烈推荐之。）
|
||||
- **2.0版本可以不需要，但是仍然强烈推荐有一个，从而能对H5造塔有更深的了解。**
|
||||
|
||||
只要满足了上述条件，你就可以开始做自己的塔啦！
|
||||
|
||||
## V2.0的使用
|
||||
|
||||
目前版本已经更新到V2.0，在2.0版本中，我们可以进行全GUI造塔。
|
||||
|
||||
下面的文档主要是讲如何通过代码编辑的方式来造，仍然强烈建议进行阅读从而有着一定的了解。
|
||||
|
||||
如果想直接知道如何在V2.0造塔，可以直接参见[V2.0版本介绍](V2.0)的说明，或者看[B站视频教程](http://www.bilibili.com/video/av17608025/)。
|
||||
|
||||
## 启动HTTP服务
|
||||
|
||||
在根目录下有一个“启动服务.exe”，运行之。
|
||||
|
||||
|
||||
|
||||
* “启动游戏”按钮将打开一个网页，你能在里面看到现在游戏的效果。
|
||||
* “地图编辑器”允许你以可视化的方式进行编辑地图。
|
||||
* “便捷PS工具”能让你很方便的对自定义素材进行添加。参见[自定义素材](personalization#自定义素材)。
|
||||
* “地图生成器”能让你从已有的截图（如RMXP项目）中立刻生成可被本样板识别的地图数据。
|
||||
* “RM动画导出器”能让你从RMXP中导出动画而被H5魔塔使用。
|
||||
* “JS代码压缩工具”能对JS代码进行压缩，从而减少IO请求数和文件大小。
|
||||
* “伤害和临界值计算器”是一个很便捷的小工具，能对怪物的伤害和临界值进行计算。
|
||||
|
||||
!> **警告：** 非Chrome浏览器（如Edge/IE等）下本地服务器可能表现不正常，会出现闪退等现象。请务必下载安装Chrome浏览器。
|
||||
|
||||
## 新建剧本
|
||||
|
||||
类似于RMXP，本塔每层楼都是一个“剧本”，剧本内主要定义了本层的地图和各种事件。主函数将读取每个剧本，并生成实际的地图供游戏使用。
|
||||
|
||||
我们打开 `project/floors/` 目录，这个目录是所有剧本的目录。我们需要指定一个楼层名，例如MT1；然后，我们可以将`MT0.js`（模板）复制重命名为为`MT1.js`，并使用文本编辑器打开。
|
||||
|
||||
|
||||
|
||||
然后将楼层名改为MT1，floorId改名为MT1；title可以改成任意内容，将在切换楼层时进行显示（比如可以改成“1层小塔”）。
|
||||
|
||||
具体样板文件的每个要素如下：
|
||||
- **`floorId`** 楼层唯一标识符；必须和文件名，以及 `main.floors.xxx` 完全一致
|
||||
- **`title`** 楼层中文名，将在切换楼层时进行显示
|
||||
- **`name`** 楼层再状态栏显示的名称
|
||||
- **`canFlyTo`** 当前楼层可否被楼传器飞到。如果该层不能飞到，则也在该层也不允许使用楼传器。
|
||||
- **`canUseQuickShop`** 当前楼层可否使用快捷商店。
|
||||
- **`defaultGround`** 该层的背景（地面）素材。
|
||||
- **`images`** 该层默认显示的前景/背景图片
|
||||
- **`color`** 该层的画面色调。
|
||||
- **`bgm`** 到达该层后默认播放的BGM。本项可忽略。
|
||||
- **`item_ratio`** 该层的宝石/血瓶倍率
|
||||
- **`map`** 本层地图，需要是13x13数组，建议使用地图生成器或者可视化地图编辑器制作。
|
||||
- **`firstArrive`** 第一次到该楼层触发的事件
|
||||
- **`events`** 该楼的所有可能事件列表
|
||||
- **`changeFloor`** 楼层转换事件；该事件不能和上面的events有冲突（同位置点），否则会被覆盖
|
||||
- **`afterBattle`** 战斗后可能触发的事件列表
|
||||
- **`afterGetItem`** 获得道具后可能触发的事件列表
|
||||
- **`afterOpenDoor`** 开完门后可能触发的事件列表
|
||||
- **`cannotMove`** 每个图块不可通行的方向，也就是悬崖效果
|
||||
|
||||
我们最终的任务其实是，将每个楼层的剧本（地图&事件）给写完即可。
|
||||
|
||||
换句话说，只需要简单的复制操作，我们就可以新建一个剧本了。
|
||||
|
||||
## 绘制地图
|
||||
|
||||
有两种绘制地图的方式：从头绘制地图；从RMXP中导入已有的地图。
|
||||
|
||||
### 从头绘制地图
|
||||
|
||||
我们直接打开“地图编辑器”，可以看到一个可视化的UI界面。
|
||||
|
||||
|
||||
|
||||
然后可以在上面任意进行绘制地图。
|
||||
|
||||
!> **如果地图的数字和ID未被定义，则会进行提示：数字和ID未被定义！此时要对素材的ID和数字进行定义，请参见[自定义素材](personalization#自定义素材)。**
|
||||
|
||||
绘制地图完毕后，点击"导出地图"，即可在左边看到对应的JSON数组，并且已经复制到了剪切板。将其粘贴到剧本中的map位置即可。
|
||||
|
||||
|
||||
|
||||
!> V2.0版本可以直接将当前地图进行保存或另存为，不需要这样手动打开进行编辑。
|
||||
|
||||
### 从RMXP导入已有的地图
|
||||
|
||||
如果我们想复刻一个现有的，已经被RMXP所制作的塔，也有很便捷的方式，那就是用到我们的“地图生成器”。
|
||||
|
||||
首先，我们打开RMXP和对应的项目，可以看到它的地图。
|
||||
|
||||
|
||||
|
||||
我们打开Windows自带的“截图工具”，并将整个地图有效区域截图下来，并将其复制到剪切板。
|
||||
|
||||
|
||||
|
||||
截图时请注意：**只截取有效游戏空间内数据，并且有效空间内的范围必须是13x13。（如果地图小于13*13，请用星空或墙壁填充到13x13）。**
|
||||
|
||||
确认地图的图片文件已经复制到剪切板后，我们打开“地图生成器”，并点“加载图片”。大约1-2秒后，可以得到地图的数据。
|
||||
|
||||
|
||||
|
||||
然后点击“复制地图”，即可将地图数据复制到剪切板。
|
||||
|
||||
!> **如果有识别不一致的存在，即生成的地图和实际的地图不符，我们可以在地图编辑器中粘贴，再可视化进行编辑。**
|
||||
|
||||
!> **地图生成器默认只支持经典素材。如果有自定义素材需求（例如原版的1层小塔那种素材），请参见[自定义素材](personalization#自定义素材)。**
|
||||
|
||||
!> **请确保截图范围刚好为13x13，并且保证每个位置的像素都是32x32。**
|
||||
|
||||
|
||||
## 录入数据
|
||||
|
||||
有了地图后，我们下一步需要做的就是录入数据。数据主要包括如下几种：
|
||||
|
||||
- 勇士初始的属性
|
||||
- 全局变量（宝石效果、全局Flag等）
|
||||
- 怪物数据（每个怪物的攻防血金币经验等等）
|
||||
|
||||
下面依次进行说明。
|
||||
|
||||
我们打开`data.js`文件，这里面定义了各种全局属性和勇士初始值。
|
||||
|
||||
!> V2.0版本可以直接在地图编辑器的`全塔属性`中进行修改！
|
||||
|
||||
我们可以将本塔标题改名为“1层小塔”，
|
||||
|
||||
游戏的唯一标识符叫onefloor，然后可以直接修改勇士的各项初始数据.
|
||||
|
||||
!> **注：name作为游戏的唯一标识符必须进行修改，否则可能会导致存档等出现问题。**
|
||||
|
||||
|
||||
|
||||
!> **请注意，勇士的初始位置一栏，x为横坐标，y为纵坐标；即，x为从左到右第几列，y为从上到下第几行，均从0开始计算。**
|
||||
|
||||
修改完初始化信息后，接下来我们需要修改道具的信息（比如宝石加攻防的数值，血瓶加生命的数值等）。还是在这个`data.js`文件，往下拉，找到values一项，并进行相应的设置
|
||||
|
||||
|
||||
|
||||
然后，再设置一些系统Flag，以进行游戏。继续将`data.js`往下拉，我们注意到本塔是存在魔防的，不存在经验，因此我们可以简单地将enableMDef改为true，enableExperience改成false，enableDebuff改成false。
|
||||
|
||||
同理，本塔的破墙镐只能破面前的墙壁，因此`pickaxeFourDirections`需要改成`false`。
|
||||
|
||||
|
||||
|
||||
其他的几项暂时不会被涉及到，因此不用考虑。
|
||||
|
||||
全局变量修改完毕后，我们需要告诉主函数加载该楼层。打开`data.js`，找到`floorIds`项，将其值改为楼层ID即MT1。
|
||||
|
||||
最后一步就是录入怪物数据。打开`enemys.js`文件，依次输入你在本塔内使用到的所有怪物的攻防血的数据。其中怪物的特殊属性（special项）与该文件下面的getSpecialText对应。
|
||||
|
||||
!> V2.0版本可以直接在“图块属性”一栏进行修改怪物属性！
|
||||
|
||||
|
||||
|
||||
只需要修改自己用到的怪物属性即可，其他没有用到的怪物完全无所谓。
|
||||
|
||||
做完后保存所有文件，在本地服务器中“启动游戏”，就能立刻看到自己的塔并开始游戏啦！是不是很简单呢！
|
||||
|
||||
|
||||
|
||||
## 压缩与发布
|
||||
|
||||
当你将上述步骤完成后，你实际上已经做出来了一个魔塔，并且可以发布给大家进行游戏了。
|
||||
目前而言发布有如下几种方式：
|
||||
|
||||
- 离线版本：直接将游戏文件夹打包，放到百度网盘等地方供用户下载；用户下载到本地后直接使用浏览器打开`index.html`进行游戏。
|
||||
- 手机端的部分浏览器如chrome也支持本地网页，可以下载到手机然后直接打开进行游戏。
|
||||
- 在线版本：将游戏放到某个服务器上，大家在线联网游戏。
|
||||
|
||||
**离线版本的好处是：先全部下载后再游戏，无需考虑流量的问题，也可以支持高清音乐的播放。坏处是：没办法在多平台之间迁移，无法及时获得游戏更新（需要重新下载），而浏览器打开本地文件有丢失存档的风险。
|
||||
在线版本的好处是：随时随地可以玩，可以多平台接档，还可以在后台看到一些统计信息，可以随时对游戏进行更新；坏处是需要一个服务器，且还要考虑到用户流量的问题。**
|
||||
|
||||
在此我们只讨论在线版本。当你决定发布游戏时，强烈建议先将JS代码进行压缩以节省可能的IO请求以及网络流量。直接打开同目录下的“JS代码压缩工具”进行压缩即可。
|
||||
|
||||
压缩完毕后，你还需要将`main.js`中的useCompress从false改为true，这样方才只会加载压缩后的文件。
|
||||
|
||||
如果你需要发布到服务器上且你没有服务器，可以直接将本塔发给我（`艾之葵`），我会给负责你部署上去的。我的服务器至少能保证两年内有效。
|
||||
|
||||
然后就是发布帖子、链接二维码，能让任何人在任何时候任何平台上都能进行游戏啦！是不是很简单呢！
|
||||
|
||||
## 注意事项和常见FAQ
|
||||
|
||||
1. 截图请务必刚好截取13x13的图片，并需要保证每个位置必须为32x32像素。一般无放缩的RMXP符合条件。
|
||||
2. 游戏的唯一标识符name请务必修改。如果不修改可能会导致存档出现异常。
|
||||
3. 别忘了data.js中要修改floorIds指明所用到的所有楼层哦~
|
||||
|
||||
下面是几个常见的FAQ：
|
||||
|
||||
**Q: 为什么截图识别不出来？**
|
||||
|
||||
**A:** 请保证刚好为13x13，且每个位置必须32x32像素。如果不确定，可以保存你的截图，右键属性查看详细信息，看像素的宽高是不是在416左右。多少几十像素都是没关系的。
|
||||
|
||||
|
||||
|
||||
**Q: 打开游戏时卡死在了xxx.js加载完毕！无法进入游戏。**
|
||||
|
||||
**A:** 最大的可能是因为少了逗号，或者反括号等等。一般而言VSCode都会有错误提示，你哪里少了东西。
|
||||
|
||||
如果没有，可以采用如下方式debug：
|
||||
|
||||
Ctrl+Shift+I 打开Chrome的控制台，找到Console。
|
||||
|
||||
如果出现了语法错误，会有红色提示 **Unexpected xxx** ，找到后面文件名和行号，打开，使用VSCode检查该处是否存在问题，即可。
|
||||
|
||||
|
||||
|
||||
==========================================================================================
|
||||
|
||||
[继续阅读下一章：元件说明](element)
|
||||
+682
@@ -0,0 +1,682 @@
|
||||
# 附录: API列表
|
||||
|
||||
?> 目前版本**v2.5.4**，上次更新时间：* {docsify-updated} *
|
||||
|
||||
**这里只列出所有可能会被造塔者用到的常用API，更多的有关内容请在代码内进行查询。**
|
||||
|
||||
如有任何疑问，请联系小艾寻求帮助。
|
||||
|
||||
可以在chrome浏览器的控制台中（`ctrl+shift+I`，找到Console）中直接进行调用，以查看效果。
|
||||
|
||||
**以下所有异步API都会加上[异步]的说明，存在此说明的请勿在事件处理的自定义脚本中使用。**
|
||||
|
||||
!> 最常用的新手向命令，强烈建议每个人了解
|
||||
|
||||
``` text
|
||||
|
||||
core.status.floorId
|
||||
获得当前层的floorId。
|
||||
|
||||
|
||||
core.status.maps
|
||||
获得所有楼层的地图信息。
|
||||
|
||||
|
||||
core.status.thisMap
|
||||
获得当前楼层信息，其等价于core.status.maps[core.status.floorId]。
|
||||
|
||||
|
||||
core.floors
|
||||
获得所有楼层的信息。例如core.floors[core.status.floorId].events可获得本楼层的所有自定义事件。
|
||||
|
||||
|
||||
core.status.hero
|
||||
获得当前勇士状态信息。例如core.status.hero.atk就是当前勇士的攻击力数值。
|
||||
|
||||
|
||||
core.material.enemys
|
||||
获得所有怪物信息。例如core.material.enemys.greenSlime就是获得绿色史莱姆的属性数据。
|
||||
|
||||
|
||||
core.material.items
|
||||
获得所有道具的信息。
|
||||
|
||||
|
||||
core.debug()
|
||||
开启调试模式。此模式下可以按Ctrl键进行穿墙，并忽略一切事件。
|
||||
此模式下不可回放录像和上传成绩。
|
||||
|
||||
|
||||
core.updateStatusBar()
|
||||
立刻刷新状态栏和地图显伤。
|
||||
|
||||
|
||||
core.setStatus('atk', 1000)
|
||||
将攻击力设置为1000；这里把atk可以改成hp, def, mdef, money, experience等等。
|
||||
本句等价于 core.status.hero.atk = 1000
|
||||
|
||||
|
||||
core.getStatus('atk')
|
||||
返回当前攻击力数值。本句等价于 core.status.hero.atk。
|
||||
|
||||
|
||||
core.setHeroLoc('x', 5)
|
||||
设置勇士位置。这句话的意思是将勇士当前位置的横坐标设置为5。
|
||||
同理可以设置勇士纵坐标 core.setHeroLoc('y', 3)。
|
||||
值得注意的是，这句话虽然会使勇士改变位置，但并不会使界面重新绘制；如需立刻重新绘制地图还需调用：
|
||||
core.clearMap('hero'); core.drawHero();
|
||||
来对界面进行更新。
|
||||
|
||||
|
||||
core.setItem('pickaxe', 10)
|
||||
将破墙镐个数设置为10个。这里可以写任何道具的ID。
|
||||
|
||||
|
||||
core.addItem('pickaxe', 2)
|
||||
将破墙镐的个数增加2个，无任何特效。这里可以写任何道具的ID。
|
||||
|
||||
|
||||
core.getItem('pickaxe', 4)
|
||||
令勇士获得4个破墙镐。这里可以写任何道具的ID。
|
||||
和addItem相比，使用getItem会播放获得道具的音效，也会在左上角绘制获得提示。
|
||||
|
||||
|
||||
core.removeItem('pickaxe', 3)
|
||||
删除3个破墙镐。第二项可忽略，默认值为1。
|
||||
|
||||
|
||||
core.itemCount('pickaxe')
|
||||
返回当前破墙镐的个数。这里可以写任何道具的ID。
|
||||
|
||||
|
||||
core.hasItem('pickaxe')
|
||||
返回当前是否存在某个道具。等价于 core.itemCount('pickaxe')>0 。
|
||||
|
||||
|
||||
core.getEquip(0)
|
||||
获得0号装备类型（武器）的当前装备的itemId。如果不存在则返回null。
|
||||
这里可以写任意装备类型，从0开始和全塔属性中的equipName一一对应。
|
||||
|
||||
|
||||
core.hasEquip('sword1')
|
||||
获得当前某个具体的装备是否处于正在被装备状态。
|
||||
|
||||
|
||||
core.setFlag('xyz', 2)
|
||||
设置某个flag/变量的值为2。这里可以写任何的flag变量名。
|
||||
|
||||
|
||||
core.getFlag('xyz', 7)
|
||||
获得某个flag/变量的值；如果该变量不存在，则返回第二个参数。
|
||||
比如 core.getFlag('point', 2) 则获得变量point的值；如果该变量从未定义过则返回2。
|
||||
|
||||
|
||||
core.hasFlag('xyz')
|
||||
返回是否存在某个变量且不为0。等价于 core.getFlag('xyz', 0)!=0 。
|
||||
|
||||
|
||||
core.removeFlag('xyz')
|
||||
删除某个flag/变量。
|
||||
|
||||
|
||||
core.insertAction(list, x, y, callback)
|
||||
插入并执行一段自定义事件。在这里你可以写任意的自定义事件列表，有关详细写法请参见文档-事件。
|
||||
x和y如果设置则覆盖"当前事件点"的坐标，callback如果设置则覆盖事件执行完毕后的回调函数。
|
||||
例如： core.insertAction(["楼层切换", {"type":"changeFloor", "floorId": "MT3"}])
|
||||
将依次显示剧情文本，并执行一个楼层切换的自定义事件。
|
||||
--------
|
||||
从V2.5.4开始提出了“公共事件”的说法，这里也可以插入一个公共事件名。
|
||||
例如：core.insertAction("毒衰咒处理") 将插入公共事件“毒衰咒处理”。
|
||||
|
||||
|
||||
core.changeFloor(floorId, stair, heroLoc, time, callback) [异步]
|
||||
立刻切换到指定楼层。
|
||||
floorId为目标楼层ID，stair为到达的目标楼梯，heroLoc为到达的指定点，time为动画时间，callback为切换完毕后的回调。
|
||||
例如：
|
||||
core.changeFloor('MT2', 'upFloor', null, 600) 切换到MT2层的上楼点，动画事件600ms
|
||||
core.changeFloor('MT5', null, {'x': 3, 'y': 6}, 0) 无动画切换到MT5层的(3,6)位置。
|
||||
|
||||
|
||||
core.resetMap()
|
||||
重置当前楼层地图和楼层属性。
|
||||
当我们修改某一层地图后，进游戏读档，会发现修改的内容并没有被更新上去。
|
||||
这是因为，H5的存档是会存下来每一个楼层的地图的，读档会从档里面获得地图信息。
|
||||
此时，如果我们在某一层地图执行 core.resetMap() ，则可以立刻从剧本中读取并重置当前楼层地图。
|
||||
已经被修改过的内容也会相应出现。
|
||||
此函数参数有三种形式：
|
||||
- 不加任何参数，表示重置当前层：core.resetMap()
|
||||
- 加上一个floorId，表示重置某一层：core.resetMap("MT1")
|
||||
- 使用一个数组，表示重置若干层：core.resetMap(["MT1", "MT2", "MT3"])
|
||||
|
||||
|
||||
R
|
||||
录像回放的快捷键；这不是一个控制台命令，但是也把它放在这里供使用。
|
||||
录像回放在修改地图或新增数据后会很有用。
|
||||
|
||||
```
|
||||
|
||||
!> 一些相对高级的命令，针对有一定脚本经验的人
|
||||
|
||||
``` text
|
||||
|
||||
========== 可直接从core中调用的，最常被使用的函数 ==========
|
||||
core.js实际上是所有API的入口（路由），核心API的实现在其他几个文件中，core.js主要进行转发操作。
|
||||
|
||||
|
||||
core.nextX(n)
|
||||
获得勇士面向的第n个位置的x坐标，n可以省略默认为1（即正前方）
|
||||
|
||||
|
||||
core.nextY(n)
|
||||
获得勇士面向的第n个位置的y坐标，n可以省略默认为1（即正前方）
|
||||
|
||||
|
||||
core.nearHero(x, y)
|
||||
判断某个点是否和勇士的距离不超过1。
|
||||
|
||||
|
||||
core.openDoor(id, x, y, needKey, callback) [异步]
|
||||
尝试开门操作。id为目标点的ID，x和y为坐标，needKey表示是否需要使用钥匙，callback为开门完毕后的回调函数。
|
||||
id可为null代表使用地图上的值。
|
||||
例如：core.openDoor('yellowDoor', 10, 3, false, function() {console.log("1")})
|
||||
|
||||
|
||||
core.battle(id, x, y, force, callback) [异步]
|
||||
执行战斗事件。id为怪物的id，x和y为坐标，force为bool值表示是否是强制战斗，callback为战斗完毕后的回调函数。
|
||||
id可为null代表使用地图上的值。
|
||||
例如：core.battle('greenSlime', null, null, true)
|
||||
|
||||
|
||||
core.trigger(x, y) [异步]
|
||||
触发某个地点的事件。
|
||||
|
||||
|
||||
core.isReplaying()
|
||||
当前是否正在录像播放中
|
||||
|
||||
|
||||
core.drawBlock(block)
|
||||
重绘某个图块。block应为core.status.thisMap.blocks中的一项。
|
||||
|
||||
|
||||
core.drawMap(floorId, callback)
|
||||
重绘某一层的地图。floorId为要绘制楼层的floorId，callback为绘制完毕后的回调函数。
|
||||
|
||||
|
||||
core.terrainExists(x, y, id, floorId)
|
||||
检测某个点是否存在（指定的）地形。
|
||||
x和y为坐标；id为地形ID，可为null表示任意地形；floorId为楼层ID，可忽略表示当前楼层。
|
||||
|
||||
|
||||
core.enemyExists(x, y, id, floorId)
|
||||
检测某个点是否存在（指定的）怪物。
|
||||
x和y为坐标；id为怪物ID，可为null表示任意怪物；floorId为楼层ID，可忽略表示当前楼层。
|
||||
|
||||
|
||||
core.getBlock(x, y, floorId, showDisable)
|
||||
获得某个点的当前图块信息。
|
||||
x和y为坐标；floorId为楼层ID，可忽略或null表示当前楼层。
|
||||
showDisable如果为true，则对于禁用的点和事件也会进行返回。
|
||||
如果该点不存在图块，则返回null。
|
||||
否则，返回值如下： {"index": xxx, "block": xxx}
|
||||
其中index为该点在该楼层blocks数组中的索引，block为该图块实际内容。
|
||||
|
||||
|
||||
core.getBlockId(x, y, floorId, showDisable)
|
||||
获得某个点的图块ID。
|
||||
x和y为坐标；floorId为楼层ID，可忽略或null表示当前楼层。
|
||||
showDisable如果为true，则对于禁用的点和事件也会进行返回。
|
||||
如果该点不存在图块，则返回null，否则返回该点的图块ID。
|
||||
|
||||
|
||||
core.getBlockCls(x, y, floorId, showDisable)
|
||||
获得某个点的图块cls。
|
||||
x和y为坐标；floorId为楼层ID，可忽略或null表示当前楼层。
|
||||
showDisable如果为true，则对于禁用的点和事件也会进行返回。
|
||||
如果该点不存在图块，则返回null，否则返回该点的图块cls。
|
||||
|
||||
|
||||
core.showBlock(x, y, floorId)
|
||||
将某个点从禁用变成启用状态。
|
||||
|
||||
|
||||
core.hideBlock(x, y, floorId)
|
||||
将某个点从启用变成禁用状态，但不会对其进行删除。
|
||||
此函数不会实际将该块从地图中进行删除，而是将该点设置为禁用，以供以后可能的启用事件。
|
||||
|
||||
|
||||
core.removeBlock(x, y, floorId)
|
||||
将从启用变成禁用状态，并尽可能将其从地图上删除。
|
||||
和hideBlock相比，如果该点不存在自定义事件（比如门或普通的怪物），则将直接从地图中删除。
|
||||
如果存在自定义事件，则简单的禁用它，以供以后可能的启用事件。
|
||||
|
||||
|
||||
core.setBlock(number, x, y, floorId)
|
||||
改变图块。number为要改变到的图块数字，x和y为坐标，floorId为楼层ID，可忽略表示当前楼层。
|
||||
|
||||
|
||||
core.useItem(itemId, noRoute, callback)
|
||||
尝试使用某个道具。itemId为道具ID，noRoute如果为真则该道具的使用不计入录像。
|
||||
callback为成功或失败后的回调。
|
||||
|
||||
|
||||
core.canUseItem(itemId)
|
||||
返回当前能否使用某个道具。
|
||||
|
||||
|
||||
core.loadEquip(itemId, callback)
|
||||
装备上某个装备。itemId为装备的ID，callback为成功或失败后的回调。
|
||||
|
||||
|
||||
core.unloadEquip(equipType, callback)
|
||||
卸下某个部位的装备。equipType为装备类型，从0开始；callback为成功或失败后的回调。
|
||||
|
||||
|
||||
core.getNextItem()
|
||||
轻按。
|
||||
|
||||
|
||||
core.drawTip(text, itemIcon)
|
||||
在左上角绘制一段提示信息，2秒后消失。itemIcon为道具图标的索引。
|
||||
|
||||
|
||||
core.drawText(contents, callback) [异步]
|
||||
绘制一段文字。
|
||||
不推荐使用此函数，尽量使用core.insertAction(contents)来显示剧情文本。
|
||||
|
||||
|
||||
core.closePanel()
|
||||
结束一切事件和绘制，关闭UI窗口，返回游戏进程。
|
||||
|
||||
|
||||
core.replaceText(text)
|
||||
将一段文字中的${}进行计算并替换。
|
||||
|
||||
|
||||
core.calValue(value, prefix, need, times)
|
||||
计算表达式的实际值。这个函数可以传入status:atk等这样的参数。
|
||||
|
||||
|
||||
core.getLocalStorage(key, defaultValue)
|
||||
从localStorage中获得某个数据（已被parse）；如果对应的key不存在则返回defaultValue。
|
||||
|
||||
|
||||
core.getLocalForage(key, defaultValue, successCallback, errorCallback)
|
||||
从localForage中获得某个数据（已被parse），如果对应的key不存在则返回defaultValue。
|
||||
如果成功则通过successCallback回调，失败则通过errorCallback回调。
|
||||
|
||||
|
||||
core.hasSave(index)
|
||||
判定当前某个存档位是否存在存档，返回true/false。
|
||||
index为存档编号，0代表自动存档，大于0则为正常的存档位。
|
||||
|
||||
|
||||
core.clone(data)
|
||||
深拷贝某个对象。
|
||||
|
||||
|
||||
core.isset(x)
|
||||
测试x是否不为null，不为undefined也不为NaN。
|
||||
|
||||
|
||||
core.rand(num)
|
||||
使用伪种子生成伪随机数。该随机函数能被录像支持。
|
||||
num如果设置大于0，则生成一个[0, num-1]之间的数；否则生成一个0到1之间的浮点数。
|
||||
此函数为伪随机算法，SL大法无效。（即多次SL后调用的该函数返回的值都是相同的。）
|
||||
|
||||
|
||||
core.rand2(num)
|
||||
使用系统的随机数算法得到的随机数。该随机函数能被录像支持。
|
||||
num如果设置大于0，则生成一个[0, num-1]之间的数；否则生成一个0到2147483647之间的整数。
|
||||
此函数使用了系统的Math.random()函数，支持SL大法。
|
||||
但是，此函数会将生成的随机数值存入录像，因此如果调用次数太多则会导致录像文件过大。
|
||||
|
||||
|
||||
core.restart() [异步]
|
||||
返回标题界面。
|
||||
|
||||
|
||||
========== core.actions.XXX 和游戏控制相关的函数 ==========
|
||||
actions.js主要用来进行用户交互行为的处理。
|
||||
所有用户行为，比如按键、点击、滑动等等，都会被此文件接收并进行操作。
|
||||
|
||||
|
||||
========== core.control.XXX 和游戏控制相关的函数 ==========
|
||||
control.js主要用来进行游戏控制，比如行走控制、自动寻路、存读档等等游戏核心内容。
|
||||
|
||||
core.control.setGameCanvasTranslate(canvasId, x, y)
|
||||
设置大地图的偏移量
|
||||
|
||||
|
||||
core.control.updateViewport()
|
||||
更新大地图的可见区域
|
||||
|
||||
|
||||
core.control.gatherFollowers()
|
||||
立刻聚集所有的跟随者
|
||||
|
||||
|
||||
core.control.replay()
|
||||
回放下一个操作
|
||||
|
||||
|
||||
========== core.enemys.XXX 和怪物相关的函数 ==========
|
||||
enemys.js主要用来进行怪物相关的内容，比如怪物的特殊属性，伤害和临界计算等。
|
||||
|
||||
|
||||
core.enemys.hasSpecial(special, test)
|
||||
测试怪物是否含有某个特殊属性。
|
||||
常见用法： core.enemys.hasSpecial(monster.special, 3) ## 测试是否拥有坚固
|
||||
|
||||
|
||||
core.enemys.getSpecialText(enemyId)
|
||||
返回一个列表，包含该怪物ID对应的所有特殊属性。
|
||||
|
||||
|
||||
core.enemys.getSpecialHint(enemy, special)
|
||||
获得怪物某个（或全部）特殊属性的文字说明。
|
||||
|
||||
|
||||
core.enemys.canBattle(enemyId, x, y, floorId)
|
||||
返回当前能否战胜某个怪物。
|
||||
后面三个参数是怪物坐标和楼层。
|
||||
|
||||
|
||||
core.enemys.getDamage(enemyId, x, y, floorId)
|
||||
返回当前对某个怪物的战斗伤害。如果无法战斗，返回null。
|
||||
后面三个参数是怪物坐标和楼层。
|
||||
|
||||
|
||||
core.enemys.getExtraDamage(enemyId)
|
||||
返回某个怪物会对勇士造成的额外伤害（不可被魔防抵消），例如仇恨、固伤等等。
|
||||
|
||||
|
||||
core.enemys.nextCriticals(enemyId, number, x, y, floorId)
|
||||
返回一个列表，为接下来number（可忽略，默认为1）个该怪物的临界值和临界减伤。
|
||||
列表每一项类似 [x,y] 表示临界值为x，且临界减伤为y。
|
||||
如果无临界值，则返回空列表。
|
||||
|
||||
|
||||
core.enemys.getDefDamage(enemyId, k, x, y, floorId)
|
||||
获得k（可忽略，默认为1）防减伤值。
|
||||
|
||||
|
||||
core.enemys.getDamageInfo(enemy, hero_hp, hero_atk, hero_def, hero_mdef, x, y, floorId)
|
||||
获得实际战斗信息，比如伤害，回合数，每回合伤害等等。
|
||||
此函数是实际战斗过程的计算。
|
||||
|
||||
|
||||
core.enemys.calDamage(enemy, hero_hp, hero_atk, hero_def, hero_mdef, x, y, floorId)
|
||||
获得在某个勇士属性下怪物伤害；实际返回的是上面getDamageInfo中伤害的数值。
|
||||
|
||||
|
||||
core.enemys.getCurrentEnemys(floorId)
|
||||
获得某一层楼剩余所有怪物的信息（供怪物手册使用）
|
||||
|
||||
|
||||
========== core.events.XXX 和事件相关的函数 ==========
|
||||
events.js主要用来进行事件处理，比如自定义事件，以及某些条件下可能会被触发的事件。
|
||||
大多数事件API都在脚本编辑中存在，这里只列出部分比较重要的脚本编辑中不存在的API。
|
||||
|
||||
|
||||
core.events.gameOver(ending, fromReplay)
|
||||
游戏结束并上传的事件。
|
||||
该函数将提问是否上传和是否下载录像，并返回标题界面。
|
||||
|
||||
|
||||
core.events.doEvents(list, x, y, callback) [异步]
|
||||
开始执行某个事件。
|
||||
请不要执行此函数，尽量使用 core.insertAction(list, x, y, callback) 来开始执行一段事件。
|
||||
|
||||
|
||||
core.events.doAction()
|
||||
执行下一个事件。此函数中将对所有自定义事件类型分别处理。
|
||||
|
||||
|
||||
core.events.getCommonEvent(name)
|
||||
根据名称获得一个公共事件；如果不存在对应的公共事件则返回null。
|
||||
|
||||
|
||||
core.events.openShop(shopId, needVisited) [异步]
|
||||
打开一个全局商店。needVisited表示是否需要该商店已被打开过。
|
||||
|
||||
|
||||
core.events.disableQuickShop(shopId)
|
||||
禁用一个全局商店
|
||||
|
||||
|
||||
core.events.canUseQuickShop(shopId)
|
||||
当前能否使用某个快捷商店
|
||||
|
||||
|
||||
core.events.setHeroIcon(name)
|
||||
设置勇士行走图
|
||||
|
||||
|
||||
========== core.items.XXX 和道具相关的函数 ==========
|
||||
items.js将处理和道具相关的内容，比如道具的使用，获取和删除等等。
|
||||
|
||||
|
||||
core.items.compareEquipment(equipId1, equipId2)
|
||||
比较两个装备的属性变化值
|
||||
|
||||
|
||||
========== core.loader.XXX 和游戏加载相关的函数 ==========
|
||||
loader.js将主要用来进行资源的加载，比如加载音乐、图片、动画等等。
|
||||
|
||||
|
||||
========== core.maps.XXX 和地图处理相关的函数 ==========
|
||||
maps.js主要用来进行地图相关的的操作。包括绘制地图，获取地图上的点等等。
|
||||
|
||||
|
||||
core.maps.getNumberById(id)
|
||||
根据ID来获得对应的数字。如果该ID不存在对应的数字则返回0。
|
||||
|
||||
|
||||
core.maps.canMoveHero(x,y,direction,floorId)
|
||||
判断能否前往某个方向。x,y为坐标，可忽略为当前点；direction为方向，可忽略为当前方向。
|
||||
floorId为楼层ID，可忽略为当前楼层。
|
||||
|
||||
|
||||
core.maps.canMoveDirectly(destX, destY)
|
||||
判断当前能否瞬间移动到某个点。
|
||||
该函数如果返回0则不可瞬间移动，大于0则可以瞬间移动，且返回值是跨度（即少走的步数）。
|
||||
|
||||
|
||||
core.maps.removeBlockById(index, floorId)
|
||||
根据索引删除或禁用某块。
|
||||
|
||||
|
||||
core.maps.removeBlockByIds(floorId, ids)
|
||||
根据索引删除或禁用若干块。
|
||||
|
||||
|
||||
core.maps.drawAnimate(name, x, y, callback)
|
||||
播放一段动画，name为动画名（需在全塔属性注册），x和y为坐标（0-12之间），callback可选，为播放完毕的回调函数。
|
||||
播放过程是异步的，如需等待播放完毕请使用insertAction插入一条type:waitAsync事件。
|
||||
此函数将随机返回一个数字id，为此异步动画的唯一标识符。
|
||||
|
||||
|
||||
core.maps.stopAnimate(id, doCallback)
|
||||
立刻停止一个异步动画。
|
||||
id为该动画的唯一标识符（由drawAnimate函数返回），doCallback可选，若为true则会执行该动画所绑定的回调函数。
|
||||
|
||||
|
||||
========== core.ui.XXX 和对话框绘制相关的函数 ==========
|
||||
ui.js主要用来进行UI窗口的绘制，比如对话框、怪物手册、楼传器、存读档界面等等。
|
||||
|
||||
|
||||
core.ui.getContextByName(canvas)
|
||||
根据画布名找到一个画布的context；支持系统画布和自定义画布。如果不存在画布返回null。
|
||||
也可以传画布的context自身，则返回自己。
|
||||
|
||||
|
||||
core.clearMap(name)
|
||||
清空某个画布图层。
|
||||
name为画布名，可以是系统画布之一，也可以是任意自定义动态创建的画布名；还可以直接传画布的context本身。（下同）
|
||||
如果name也可以是'all'，若为all则为清空所有系统画布。
|
||||
|
||||
|
||||
core.ui.fillText(name, text, x, y, style, font)
|
||||
在某个画布上绘制一段文字。
|
||||
text为要绘制的文本，x,y为要绘制的坐标，style可选为绘制的样式，font可选为绘制的字体。（下同）
|
||||
|
||||
|
||||
core.ui.fillBoldText(name, text, x, y, style, font)
|
||||
在某个画布上绘制一个描黑边的文字。
|
||||
|
||||
|
||||
core.ui.fillRect(name, x, y, width, height, style)
|
||||
绘制一个矩形。style可选为绘制样式。
|
||||
|
||||
|
||||
core.ui.strokeRect(name, x, y, width, height, style)
|
||||
绘制一个矩形的边框。
|
||||
|
||||
|
||||
core.ui.drawLine(name, x1, y1, x2, y2, style, lineWidth)
|
||||
绘制一条线。lineWidth可选为线宽。
|
||||
|
||||
|
||||
core.ui.drawArrow(name, x1, y1, x2, y2, style, lineWidth)
|
||||
绘制一个箭头。
|
||||
|
||||
|
||||
core.ui.setFont(name, font) / core.ui.setLineWidth(name, lineWidth)
|
||||
设置一个画布的字体/线宽。
|
||||
|
||||
|
||||
core.ui.setAlpha(name, font) / core.ui.setOpacity(name, font)
|
||||
设置一个画布的绘制不透明度和画布本身的不透明度。
|
||||
两者区别如下：
|
||||
- setAlpha是设置"接下来绘制的内容的不透明度"，不会对已经绘制的内容产生影响。比如setAlpha('ui', 0.5)则会在接下来的绘制中使用0.5的不透明度。
|
||||
- setOpacity是设置"画布本身的不透明度"，已经绘制的内容也会产生影响。比如我已经在UI层绘制了一段文字，再setOpacity则也会看起来变得透明。
|
||||
尽量不要对系统画布使用setOpacity（因为会对已经绘制的内容产生影响），自定义创建的画布则不受此限制。
|
||||
|
||||
|
||||
core.ui.setFillStyle(name, style) / core.ui.setStrokeStyle(name, style)
|
||||
设置一个画布的填充样式/描边样式。
|
||||
|
||||
|
||||
core.ui.setTextAlign(name, align)
|
||||
设置一个画布的文字对齐模式。
|
||||
|
||||
|
||||
core.ui.calWidth(name, text, font)
|
||||
计算一段文字在画布上的绘制宽度
|
||||
font可选，如果存在则会先设置该画布上的字体。
|
||||
|
||||
|
||||
core.ui.drawImage(name, image, x, y, w, h, x1, y1, w1, h1)
|
||||
在一个画布上绘制图片。
|
||||
name为画布名，可以是系统画布之一，也可以是任意自定义动态创建的画布名；还可以直接传画布的context本身。
|
||||
image为要绘制的图片，可以是一个全塔属性中定义的图片名（会从images中去获取），图片本身，或者一个画布。
|
||||
后面的8个坐标参数与canvas的drawImage的八个参数完全相同。
|
||||
请查看 http://www.w3school.com.cn/html5/canvas_drawimage.asp 了解更多。
|
||||
|
||||
|
||||
core.ui.createCanvas(name, x, y, width, height, zIndex)
|
||||
动态创建一个画布。name为要创建的画布名，如果已存在则会直接取用当前存在的。
|
||||
x,y为创建的画布相对窗口左上角的像素坐标，width,height为创建的长宽。
|
||||
zIndex为创建的纵向高度（关系到画布之间的覆盖），z值高的将覆盖z值低的；系统画布的z值可在个性化中查看。
|
||||
返回创建的画布的context，也可以通过core.dymCanvas[name]调用。
|
||||
|
||||
|
||||
core.ui.relocateCanvas(name, x, y)
|
||||
重新定位一个自定义画布。
|
||||
|
||||
|
||||
core.ui.resizeCanvas(name, x, y)
|
||||
重新设置一个自定义画布的大小。
|
||||
|
||||
|
||||
core.ui.deleteCanvas(name)
|
||||
删除一个自定义画布。
|
||||
|
||||
|
||||
core.ui.deleteAllCanvas()
|
||||
清空所有的自定义画布。
|
||||
|
||||
|
||||
core.ui.drawThumbnail(floorId, canvas, blocks, x, y, size, heroLoc, heroIcon)
|
||||
绘制一个缩略图，比如楼传器界面，存读档界面等情况。
|
||||
floorId为目标楼层ID，canvas为要绘制到的图层，blocks为要绘制的所有图块。
|
||||
x,y为该图层开始绘制的起始点坐标，size为每一格的像素，heroLoc为勇士坐标，heroIcon为勇士图标。
|
||||
|
||||
|
||||
========== core.utils.XXX 工具类的辅助函数 ==========
|
||||
utils.js主要用来进行一些辅助函数的计算。
|
||||
|
||||
|
||||
core.utils.splitLines(canvas, text, maxLength, font)
|
||||
自动切分长文本的换行。
|
||||
canvas为图层，text为要自动换行的内容，maxLength为每行最长像素，font为文本的字体。
|
||||
|
||||
|
||||
core.utils.cropImage(image, size)
|
||||
纵向对图片进行切分（裁剪）。
|
||||
|
||||
|
||||
core.utils.push(a,b)
|
||||
向某个数组后插入另一个数组或元素
|
||||
|
||||
|
||||
core.utils.unshift(a, b)
|
||||
向某个数组前插入另一个数组或元素
|
||||
|
||||
|
||||
core.utils.encodeBase64(str)
|
||||
Base64加密字符串
|
||||
|
||||
|
||||
core.utils.decodeBase64(str)
|
||||
Base64解密字符串
|
||||
|
||||
|
||||
core.utils.formatBigNumber(x, onMap)
|
||||
大数据的格式化
|
||||
|
||||
|
||||
core.utils.clamp(x, a, b)
|
||||
将x限制在[a,b]之间的范围内
|
||||
|
||||
|
||||
core.utils.arrayToRGB(color)
|
||||
将形如[255,0,0]之类的数组转成#FF0000这样的RGB形式。
|
||||
|
||||
|
||||
core.utils.arrayToRGBA(color)
|
||||
将形如[255,0,0,1]之类的数组转成rgba(255,0,0,1)这样的RGBA形式。
|
||||
|
||||
|
||||
core.utils.encodeRoute(list)
|
||||
压缩加密路线。可以使用core.encodeRoute(core.status.route)来压缩当前路线。
|
||||
|
||||
|
||||
core.utils.decodeRoute(route)
|
||||
解压缩（解密）路线。
|
||||
|
||||
|
||||
core.utils.readFile(success, error, readType) [异步]
|
||||
尝试请求读取一个本地文件内容。
|
||||
success和error为成功/失败后的回调，readType不设置则以文本读取，否则以DataUrl形式读取。
|
||||
|
||||
|
||||
core.utils.readFileContent(content) [异步]
|
||||
文件读取完毕后的内容处理。
|
||||
|
||||
|
||||
core.utils.download(filename, content)
|
||||
尝试生成并下载一个文件。
|
||||
|
||||
|
||||
core.utils.copy(data)
|
||||
尝试复制一段文本到剪切板。
|
||||
|
||||
|
||||
core.utils.http(type, url, formData, success, error) [异步]
|
||||
发送一个异步HTTP请求。
|
||||
type为'GET'或者'POST'；url为目标地址；formData如果是POST请求则为表单数据。
|
||||
success为成功后的回调，error为失败后的回调。
|
||||
|
||||
```
|
||||
@@ -0,0 +1,529 @@
|
||||
# 元件说明
|
||||
|
||||
?> 目前版本**v2.5.4**，上次更新时间：* {docsify-updated} *
|
||||
|
||||
在本章中，将对样板里的各个元件进行说明。各个元件主要包括道具、门、怪物、楼梯等等。
|
||||
|
||||
请打开样板0层 `sample0.js` 进行参照对比。
|
||||
|
||||
|
||||
|
||||
## 道具
|
||||
|
||||
本塔目前支持的所有道具列表在样板0层中已全部给出。当你在样板0层中拿到某个宝物时会有提示，这里不再赘述，详见拿到该道具的说明。
|
||||
|
||||
大多数宝物都有默认的效果，屠龙匕首暂未定义，如有自己的需求可参见[自定义道具效果](personalization#自定义道具效果)。
|
||||
|
||||
拿到道具后将触发`afterGetItem`事件，有关事件的详细介绍请参见[事件](event)。
|
||||
|
||||
如需修改某个道具的效果，在不同区域宝石数据发生变化等问题，请参见[自定义道具效果](personalization#自定义道具效果)的说明。
|
||||
|
||||
**有关轻按，在data.js的系统变量中有定义。如果`enableGentleClick`为true，则鼠标（触摸屏）通过双击勇士，键盘通过空格可达到轻按效果，即不向前移动而获得前方物品。**
|
||||
|
||||
## 装备
|
||||
|
||||
如果需要让剑盾等变成装备，可以直接在`data.js`中设置`'equipment': true`即可。
|
||||
|
||||
从V2.4.1开始，HTML5魔塔样板终于拥有了属于自己的装备页面。
|
||||
|
||||
### 装备栏的设置，装备类型
|
||||
|
||||
在全塔属性中，有一个`equipName`项，其定义了本塔的所有可装备的装备栏。
|
||||
|
||||
其需要是一个不小于1且不大于6的数组，其中每一项为装备栏的名称，**建议是两个汉字**。
|
||||
|
||||
例如下面这种写法就是定义了四个装备孔，名称分别为武器、防御、首饰和魔杖。
|
||||
|
||||
``` js
|
||||
"equipName": ["武器","防具","首饰","魔杖"]
|
||||
```
|
||||
|
||||
这么定义好后，装备类型即为每个装备孔的索引（从0开始）。
|
||||
|
||||
即，武器的装备类型是0，防御的装备类型是1，首饰的装备类型是2，魔杖的装备类型是3。
|
||||
|
||||
### 设置每个装备的属性
|
||||
|
||||
如果要将一个道具设置为装备，首先需要将其`cls`设为`equips`。
|
||||
|
||||
然后在图块属性的`equip`一项中设置装备的具体属性。该项写法如下:
|
||||
|
||||
``` js
|
||||
{"type": 0, "atk": 0, "def": 0, "mdef"：0, "animate": "hand", "percentage": true}
|
||||
```
|
||||
|
||||
type为该装备的类型，必填，和上面装备栏一一对应。例如，0就是武器，2就是首饰等等。
|
||||
|
||||
atk/def/mdef为该装备分别增加的攻防魔防数值（支持负数）；如果不加也可省略不写。
|
||||
|
||||
animate为该装备的攻击动画，仅对type为0时有效。具体可参见[动画和天气系统](#动画和天气系统)。
|
||||
|
||||
percentage为该装备是否按比例增加属性。
|
||||
|
||||
下面是几个写法例子。
|
||||
|
||||
``` js
|
||||
{"type": 0, "atk": 10} // 装备类型是武器，效果是攻击+10，使用默认的攻击动画
|
||||
{"type": 0, "atk": 40, "animate": "sword"} // 装备类型为武器，效果是攻击+10，攻击动画是sword
|
||||
{"type": 1, "def": 40, "percentage": true} // 装备类型是防具，效果是防御提升40%
|
||||
{"type": 1, "def": 100, "mdef": 100} // 装备类型是防具，效果是防御和魔防各+100
|
||||
{"type": 3, "atk": -20, "def": 50, "mdef": 50} // 装备类型是魔杖，效果是攻击-20，防御和魔防各+50
|
||||
{"type": 2, "atk": -20, "def": 50, "mdef": 50, "percentage": true} // 装备类型是魔杖，效果是攻击下降20%，防御和魔防各提升50%
|
||||
```
|
||||
|
||||
所有取值全部向下取整。
|
||||
|
||||
值得注意的是，如果多个装备同时按比例增加属性，使用加法计算。比如武器增加30%攻击，防具增加10%攻击，最终合起来增加的是40%而不是43%的属性。
|
||||
|
||||
### 检测是否存在装备
|
||||
|
||||
可以使用`core.hasEquip(itemId)`来检测是否装上某个装备。
|
||||
|
||||
使用`core.hasItem(itemId)`来检测是否存在一个未装上的装备。
|
||||
|
||||
使用`core.getEquip(equipType)`来获得某个装备类型的当前装备。
|
||||
|
||||
更多相关API详见[附录：API列表](api)。
|
||||
|
||||
### 多重装备
|
||||
|
||||
从V2.5.4开始，允许支持多重装备，即有若干的装备可共用若干的格子（例如永不复还那样）。
|
||||
|
||||
要实现这一点，上面的写法有所改变。
|
||||
|
||||
在全塔属性中的`equipName`项写法不变，不过可以写重复的装备孔名称。（但仍然最多只能写6个）
|
||||
|
||||
``` js
|
||||
"equipName": ["武器", "武器", "武器", "防具", "防具", "首饰"]
|
||||
```
|
||||
|
||||
然后对于某个装备，将其`type`（装备类型）写对应的装备孔名称即可。
|
||||
|
||||
``` js
|
||||
{"type": "武器", "atk": 20, "def": 0, ...}
|
||||
```
|
||||
|
||||
这样写的话，则所有该名称的装备孔均可装上此装备。
|
||||
|
||||
当尝试装上此装备时，会取最小的一个空的装备孔进行装备。如果没有空闲的装备孔，则会提示“请先卸下装备”。
|
||||
|
||||
装备动画仍然会取第一个（装备类型为0）的装备的`animate`项，即使装备了多个有动画的武器。
|
||||
|
||||
## 门
|
||||
|
||||
本塔支持6种门，黄蓝红绿铁花。前五种门需要有对应的钥匙打开，花门只能通过调用`openDoor`事件进行打开。
|
||||
|
||||
开门后可触发该层的`afterOpenDoor`事件，有关事件的详细介绍请参见[事件](event)。
|
||||
|
||||
如果要新增自己的门，请参见[新增门和对应的钥匙](personalization#新增门和对应的钥匙)。
|
||||
|
||||
## 暗墙
|
||||
|
||||
本塔支持暗墙。
|
||||
|
||||
要制作一个暗墙非常简单：在该点直接放一个普通墙壁，然后事件写“开门”，坐标为该点就行。
|
||||
|
||||
``` js
|
||||
// 该点画一个普通的墙壁，比如`yellowWall`
|
||||
|
||||
// 在该点的事件events中:
|
||||
"x,y": [
|
||||
{"type": "openDoor"} // 直接使用开门事件，坐标可忽略表示当前点
|
||||
]
|
||||
```
|
||||
|
||||
系统会自动调用animates中的开暗墙动画。
|
||||
|
||||
目前只有如下ID支持以这种方式开门：
|
||||
|
||||
``` text
|
||||
yellowDoor, blueDoor, redDoor, greenDoor, specialDoor, steelDoor,
|
||||
yellowWall, blueWall, whiteWall
|
||||
```
|
||||
|
||||
## 怪物
|
||||
|
||||
本塔支持的怪物列表参见`project/enemys.js`。其与images目录下的`enemys.png`素材按顺序一一对应。
|
||||
|
||||
如有自己的怪物素材需求请参见[自定义素材](personalization#自定义素材)的内容。
|
||||
|
||||
怪物可以有特殊属性，每个怪物可以有多个自定义属性。
|
||||
|
||||
怪物的特殊属性所对应的数字（special）在脚本编辑中的`getSpecials`中定义，请勿对已有的属性进行修改。
|
||||
|
||||
``` js
|
||||
function() {
|
||||
// 获得怪物的特殊属性，每一行定义一个特殊属性。
|
||||
// 分为三项，第一项为该特殊属性的数字，第二项为特殊属性的名字，第三项为特殊属性的描述
|
||||
// 可以直接写字符串，也可以写个function将怪物传进去
|
||||
return [
|
||||
[1, "先攻", "怪物首先攻击"],
|
||||
[2, "魔攻", "怪物无视勇士的防御"],
|
||||
[3, "坚固", "勇士每回合最多只能对怪物造成1点伤害"],
|
||||
[4, "2连击", "怪物每回合攻击2次"],
|
||||
[5, "3连击", "怪物每回合攻击3次"],
|
||||
[6, function(enemy) {return (enemy.n||4)+"连击";}, function(enemy) {return "怪物每回合攻击"+(enemy.n||4)+"次";}],
|
||||
[7, "破甲", "战斗前，怪物附加角色防御的"+Math.floor(100*core.values.breakArmor||0)+"%作为伤害"],
|
||||
[8, "反击", "战斗时，怪物每回合附加角色攻击的"+Math.floor(100*core.values.counterAttack||0)+"%作为伤害，无视角色防御"],
|
||||
[9, "净化", "战斗前，怪物附加勇士魔防的"+core.values.purify+"倍作为伤害"],
|
||||
[10, "模仿", "怪物的攻防和勇士攻防相等"],
|
||||
[11, "吸血", function (enemy) {return "战斗前，怪物首先吸取角色的"+Math.floor(100*enemy.value||0)+"%生命作为伤害"+(enemy.add?"，并把伤害数值加到自身生命上":"");}],
|
||||
[12, "中毒", "战斗后，勇士陷入中毒状态，每一步损失生命"+core.values.poisonDamage+"点"],
|
||||
[13, "衰弱", "战斗后，勇士陷入衰弱状态，攻防暂时下降"+(core.values.weakValue>=1?core.values.weakValue+"点":parseInt(core.values.weakValue*100)+"%")],
|
||||
[14, "诅咒", "战斗后，勇士陷入诅咒状态，战斗无法获得金币和经验"],
|
||||
[15, "领域", function (enemy) {return "经过怪物周围"+(enemy.range||1)+"格时自动减生命"+(enemy.value||0)+"点";}],
|
||||
[16, "夹击", "经过两只相同的怪物中间，勇士生命值变成一半"],
|
||||
[17, "仇恨", "战斗前，怪物附加之前积累的仇恨值作为伤害"+(core.flags.hatredDecrease?"；战斗后，释放一半的仇恨值":"")+"。（每杀死一个怪物获得"+(core.values.hatred||0)+"点仇恨值）"],
|
||||
[18, "阻击", function (enemy) {return "经过怪物的十字领域时自动减生命"+(enemy.value||0)+"点，同时怪物后退一格";}],
|
||||
[19, "自爆", "战斗后勇士的生命值变成1"],
|
||||
[20, "无敌", "勇士无法打败怪物，除非拥有十字架"],
|
||||
[21, "退化", function (enemy) {return "战斗后勇士永久下降"+(enemy.atkValue||0)+"点攻击和"+(enemy.defValue||0)+"点防御";}],
|
||||
[22, "固伤", function (enemy) {return "战斗前，怪物对勇士造成"+(enemy.damage||0)+"点固定伤害，无视勇士魔防。";}],
|
||||
[23, "重生", "怪物被击败后，角色转换楼层则怪物将再次出现"],
|
||||
[24, "激光", function (enemy) {return "经过怪物同行或同列时自动减生命"+(enemy.value||0)+"点";}]
|
||||
];
|
||||
}
|
||||
```
|
||||
|
||||
多属性可采用数组的写法，比如`'special': [1,3]`视为同时拥有先攻和坚固属性；`'special': [5,10,14,18]`视为拥有3连击、魔防、诅咒、阻击四个属性。
|
||||
|
||||
本塔支持战斗动画，在`data.js`中存在三个全局选项：`canOpenBattleAnimate`, `showBattleAnimateConfirm`, `battleAnimate`。
|
||||
|
||||
- `canOpenBattleAnimate`代表是否允许用户开启战斗动画。如果你添加了一些自定义属性，且不想修改战斗界面的UI，则可以将其关闭。
|
||||
- `showBattleAnimateConfirm`代表是否在游戏开始时给用户提供开启动画的选项。对于一些偏向于萌新的塔，可以开启此项。
|
||||
- `battleAnimate`代表是否默认开启战斗动画。此项会被用户存储的设置给覆盖。
|
||||
- 如果`canOpenBattleAnimate`为false，则后面两个也强制为false。
|
||||
|
||||
怪物可以负伤，在`data.js`的全局变量`enableNegativeDamage`中指定。
|
||||
|
||||
下面的`getSpecialHint`函数则给定了每个特殊属性的详细描述。这个描述将在怪物手册中看到。
|
||||
|
||||
打败怪物后可以进行加点操作。有关加点塔的制作可参见[加点事件](event#加点事件)。
|
||||
|
||||
如果`data.js`中的enableExperience为false，即不启用经验的话，怪物手册里将不显示怪物的经验值，打败怪物也不获得任何经验。
|
||||
|
||||
拿到幸运金币后，打怪获得的金币将翻倍。
|
||||
|
||||
如果怪物有`"notBomb": true`，则该系列诖怪物均不可被炸。
|
||||
|
||||
N连击怪物的special是6，且我们可以为它定义n代表实际连击数。参见样板中剑王的写法。
|
||||
|
||||
吸血怪需要给怪物设置value，代表吸血的比例。
|
||||
|
||||
可以给吸血怪添加`'add': true`来将吸血的数值加到自身上。
|
||||
|
||||
中毒怪让勇士中毒后，每步扣减的生命值由`data.js`中的values定义。
|
||||
|
||||
衰弱怪让勇士衰弱后，攻防会下降一定比例或固定数值（直到衰弱状态解除恢复）；其在`data.js`中的values定义。
|
||||
|
||||
诅咒怪将让勇士陷入诅咒状态，诅咒状态下杀怪不获得金币和经验值。
|
||||
|
||||
领域怪需要在怪物后添加value，代表领域伤害的数值。如果勇士生命值扣减到0，则直接死亡触发lose事件。
|
||||
|
||||
领域是十字伤害还是九宫格伤害由`zoneSquare`设定，如设置为true则为九宫格伤害，不指定或为false则为十字伤害。
|
||||
|
||||
领域怪还可以设置`range`选项代表该领域怪的范围，不写则默认为1。
|
||||
|
||||
**将`flag:no_zone`设置为true可以取消领域效果。**
|
||||
|
||||
阻击怪同样需要设置value，代表阻击伤害的数值。如果勇士生命值扣减到0，则直接死亡触发lose事件。
|
||||
|
||||
**将`flag:no_snipe`设置为true可以取消阻击效果。**
|
||||
|
||||
!> 阻击怪后退的地点不能有任何事件存在，即使是已经被禁用的自定义事件！
|
||||
|
||||
激光怪同样需要设置value，代表激光伤害的数值。
|
||||
|
||||
请注意如果吸血、领域、阻击中任何两个同时存在，则value会冲突。**因此请勿将吸血、领域、阻击或激光放置在同一个怪物身上。**
|
||||
|
||||
**将`flag:no_laser`设置为true可以免疫激光效果。**
|
||||
|
||||
退化怪需要设置'atkValue'和'defValue'表示退化的数值；也可以不设置默认为0。
|
||||
|
||||
夹击可以通过全塔属性中的`betweenAttackCeil`设为true可以将伤害向上取整。
|
||||
|
||||
**将`flag:no_betweenAttack`设置为true可以免疫夹击效果。**
|
||||
|
||||
固伤怪则需要设置`damage`选项，代表战前扣血数值。
|
||||
|
||||
如有额外需求，可参见[自定义怪物属性](personalization#自定义自定义怪物属性)，里面讲了如何设置一个新的怪物属性。
|
||||
|
||||
## 怪物和NPC的朝向问题
|
||||
|
||||
从V2.5.2开始，对于人形怪物和NPC的朝向问题已经有着比较好的解决方式。
|
||||
|
||||
首先明确一点的是，和RM不同，H5中即使是对同一个怪物/NPC的不同朝向，也需要分别将其各个朝向素材追加对应的图片上，并进行注册。
|
||||
|
||||
### 怪物的朝向问题
|
||||
|
||||
对于同一个怪物的不同朝向，需要对每个朝向创建一个怪物（属性完全相同），这样就可以在地图上绘制不同朝向的怪物。
|
||||
|
||||
但是这样会存在一个问题，就是怪物手册中怪物的每个朝向都会显示成一个单独的怪物。
|
||||
|
||||
为了避免这种情况的发生，在怪物的属性中存在一个`displayIdInBook`项，**我们可以指定该项来控制每个怪物在怪物手册中中显示成的怪物。**
|
||||
|
||||
举个例子，假设我现在有个怪物，其向下的行走图ID是`E300`，其向左的行走图ID是`E301`，向右的行走图ID是`E302`。分别对这几个怪物填写完全相同的怪物属性。
|
||||
|
||||
如果我在地图上同时绘制向下、向左和向右的该怪物，则确实能在地图上显示出来不同的朝向，但是在怪物手册中会同时显示这三种类型的怪物，观感较差。
|
||||
|
||||
我们可以给`E301`和`E302`怪物属性中的`displayIdInBook`项填写为`"E300"`。
|
||||
|
||||
这样的话，在怪物手册中，所有的E301和E302均会被视为E300并进行合并。即使只有一只朝向左的怪物（E301），怪物手册仍然会按E300进行显示。
|
||||
|
||||
从而完美解决了同种怪物不同朝向在怪物手册的显示问题。
|
||||
|
||||
### NPC的朝向问题
|
||||
|
||||
和怪物不同的是，NPC朝向问题更复杂一点。
|
||||
|
||||
在NPC的图块属性中，存在一个`faceIds`的项目，可以用其来绑定一个图块所对应的其他朝向的图块ID。
|
||||
|
||||
举个例子，假设我存在一个NPC，其向上的图块ID是N333，向下的图块ID是N334，向左的图块ID是N335，不存在向右的图块ID。
|
||||
|
||||
则可以在这几个图块属性中的`faceIds`中写：`{"up": "N333", "down": "N334", "left": "N335"}`。
|
||||
|
||||
当勇士从左边撞上此怪物后，将从该图块的图块属性中的faceIds中寻求`left`所对应的ID。
|
||||
如果存在定义（如N335），则会在触发对话事件前改变当前图块为N335，看起来就是在对话前进行了转向，面向勇士。
|
||||
|
||||
!> 请注意，在对话结束后朝向不会切换回来，因此如果有必要切换朝向请在事件结束前调用转变图块事件。
|
||||
|
||||
同理，使用移动事件让NPC在行走时，不同朝向的行走会自动调用`faceIds`中不同朝向的ID所对应的行走图，看起来就是在行走时也可以不断转向了。
|
||||
|
||||
从而，完美解决了NPC的朝向问题（碰触时面向勇士、行走时改变朝向）。
|
||||
|
||||
## 路障，楼梯，传送门
|
||||
|
||||
血网的伤害数值、中毒后每步伤害数值、衰弱时暂时攻防下降的数值，都在 `data.js` 的values内定义。
|
||||
|
||||
路障同样会尽量被自动寻路绕过。
|
||||
|
||||
有关楼梯和传送门，必须在该层样板的changeFloor里指定传送点的目标。
|
||||
|
||||
|
||||
|
||||
!> **请注意这里的`"x,y"`代表该点的横坐标为x，纵坐标为y；即从左到右第x列，从上到下的第y行（从0开始计算）。如(6,0)代表最上面一行的正中间一列。**
|
||||
|
||||
floorId指定的是目标楼层的唯一标识符（ID）。
|
||||
|
||||
也可以写`"floorId": ":before"`和`"floorId": ":next"`表示上一楼和下一楼。
|
||||
|
||||
后面可以写stair到upFloor或downFloor，表示将前往目标楼层的上楼梯/下楼梯位置。你也可以写loc然后指定目标点的坐标。
|
||||
|
||||
请注意的是，如果目标楼层有多个楼梯，写stair可能会导致到达的楼梯不确定，这时候请使用loc方式来指定具体的点位置。
|
||||
|
||||
可以指定direction为up/left/right/down，指定后勇士将面向该方向。
|
||||
|
||||
可以指定time，指定后切换动画时长为指定的数值。
|
||||
|
||||
**从2.1.1开始，楼层属性中提供了`upFloor`和`downFloor`两项。如果设置此项（比如`"upFloor": [2,3]`），则写stair:upFloor或者楼传器的落点将用此点来替换楼梯位置（即类似于RM中的上箭头）。**
|
||||
|
||||
## 剧情文本控制与对话框效果
|
||||
|
||||
在写剧情文本时，可以：
|
||||
|
||||
- 使用`\t[...]`来给文字加上标题和图标。如`\t[老人,man]`。
|
||||
- 使用`\b[...]`来制作对话框效果，如`\b[up,3,2]`。
|
||||
- 使用`\r[...]`来动态修改局部文本的颜色，如`\r[red]`。
|
||||
- 使用`${}`来计算一个表达式的值，如`${status:atk+status:def}`。
|
||||
- 使用`\f[...]`来同时插入一张立绘图，如`\f[1.png,100,200]`。
|
||||
|
||||
从V2.5.2开始，也允许绘制一张头像图在对话框中，只要通过`\t[1.png]`或`\t[标题,1.png]`的写法。
|
||||
|
||||
详细信息请参见[剧情文本控制](event#text：显示一段文字（剧情）)中的说明。
|
||||
|
||||
从V2.5.2开始，可以用一张WindowSkin图片作为对话框的背景皮肤。
|
||||
|
||||
使用时，需要将图片放在images目录下，并在全塔属性中予以注册。
|
||||
|
||||
可以使用[设置剧情文本的属性](setText：设置剧情文本的属性)事件将对话框背景设置为需要的皮肤。
|
||||
|
||||
!> 关于对话框效果请注意，现在是采用WindowSkin的右下角两个32x32的图片作为对话框尖角进行绘制。因此请尽量使用群文件或网盘的常用素材中给出的WindowSkin素材（均已进行对话框适配）。如需使用来自第三方的WindowSkin素材，请自行注意对话框的尖角问题，或弃用`\b`效果。
|
||||
|
||||
另外一点是，V2.5.2以后，对话框`\b`可以根据文字长度来自动控制文本框宽度，其基本控制原理如下：
|
||||
|
||||
- 如果用户存在手动换行`\n`，则选取**最长的一段话**作为文本框宽度。
|
||||
- 如果用户不存在手动换行，则会将文本框宽度调整为X行半的最佳宽度。
|
||||
- 文本框宽度存在上下界，最终宽度一定会控制在该范围内。
|
||||
|
||||
该自动调整仅对`\b`的对话框效果有效。非对话框仍然会绘制整个界面的宽度。
|
||||
|
||||
## 大地图
|
||||
|
||||
从V2.4开始，H5魔塔开始支持大地图。
|
||||
|
||||
大地图在创建时可以指定宽高，要求**宽和高都不得小于13，且宽高之积不超过1000**。
|
||||
|
||||
大地图一旦创建成功则不得修改宽高数值。
|
||||
|
||||
## 动画和天气系统
|
||||
|
||||
现在我们的H5魔塔支持播放动画，也支持天气系统了。
|
||||
|
||||
要播放动画，你需要先使用“RM动画导出器”将动画导出，放在animates目录下，然后再data.js中定义。
|
||||
|
||||
``` js
|
||||
"animates": [// 在此存放所有可能使用的动画，必须是animate格式，在这里不写后缀名
|
||||
// 动画必须放在animates目录下；文件名不能使用中文，不能带空格或特殊字符
|
||||
"hand", "sword", "zone", "yongchang", "thunder" // 根据需求自行添加
|
||||
]
|
||||
```
|
||||
|
||||
!> 动画必须是animate格式，名称不能使用中文，不能带空格或特殊字符。
|
||||
|
||||
导出动画时可能会进行一些压缩以节省流量，因此清晰度可能不如原版。
|
||||
|
||||
从2.3.2开始，动画可以同时导出所用的音效。**如果导出音效，请确保将所用到的音效复制到了`sounds`目录下，并且在全塔属性中注册过。**
|
||||
|
||||
动画播放时，是按照每秒20帧的速度（即50ms/帧）。
|
||||
|
||||
定义完毕后，我们可以调用`animate`事件来播放该动画，有关事件的详细介绍请参见[事件](event)。
|
||||
|
||||
!> 播放录像时，将默认忽略所有动画。
|
||||
|
||||
目前天气系统只支持雨和雪两种天气。
|
||||
|
||||
在每层楼的剧本文件里存在一个weather选项，表示该层楼的默认天气。
|
||||
|
||||
``` js
|
||||
// 该层的默认天气。本项可忽略表示晴天，如果写则第一项为"rain"，"snow"或"fog"代表雨雪雾，第二项为1-10之间的数代表强度。
|
||||
"weather": ["snow",5]
|
||||
```
|
||||
|
||||
我们也可以使用`setWeather`事件来设置当前天气，有关事件的详细介绍请参见[事件](event)。
|
||||
|
||||
## 背景音乐
|
||||
|
||||
本塔支持BGM和SE的播放。
|
||||
|
||||
要播放音乐和音效，你需要将对应的文件放在sounds目录下，然后在全塔属性中进行定义
|
||||
|
||||
``` js
|
||||
"bgms": [ // 在此存放所有的bgm，和文件名一致。
|
||||
// 音频名不能使用中文，不能带空格或特殊字符；可以直接改名拼音就好
|
||||
'bgm.mp3'
|
||||
];
|
||||
"sounds": [ // 在此存放所有的SE，和文件名一致
|
||||
// 音频名不能使用中文，不能带空格或特殊字符；可以直接改名拼音就好
|
||||
'floor.mp3', 'attack.mp3', 'door.mp3', 'item.mp3', 'zone.mp3'
|
||||
]
|
||||
```
|
||||
|
||||
!> 音频名不能使用中文，不能带空格或特殊字符。
|
||||
|
||||
目前BGM支持主流的音乐格式，如mp3, ogg,格式等。不支持mid格式的播放。
|
||||
<!--
|
||||
!> mid格式是通过数学方法模拟出来的音乐效果，质量可能会和实际效果差距较大。
|
||||
|
||||
!> **警告！** mid格式在手机端播放可能会特别卡，仍推荐直接使用mp3/ogg来播放。
|
||||
-->
|
||||
定义完毕后，我们可以调用`playBgm`/`playSound`事件来播放对应的音乐/音效，有关事件的详细介绍请参见[事件](event)。
|
||||
|
||||
**另外，考虑到用户的流量问题，将遵循如下规则：**
|
||||
|
||||
- **如果用户当前使用的电脑，则默认开启音乐效果，并播放默认BGM**
|
||||
- **如果用户当前使用的手机，且处于Wifi状态，则默认开启音乐效果，并播放默认BGM**
|
||||
- **其他情况，将默认关闭音乐效果，只有在用户在菜单栏中点击“音乐开关”后才会播放音乐**
|
||||
|
||||
!> iOS平台以及部分浏览器不支持获得当前网络状态，此时即使在使用Wifi也必须要用户点击“音乐开关”才能播放音乐。
|
||||
|
||||
从V2.5.3开始，可以使用`loadBgm`事件来预加载一个bgm，这样到播放时无需等待，直接播放。
|
||||
|
||||
同时BGM将使用LRU算法增加缓存机制。默认最多缓存4个BGM（在core.js的musicStatus.cachedBgmCount控制）。
|
||||
|
||||
系统会自动释放最久未使用的BGM。
|
||||
|
||||
也可以使用`freeBgm`事件来手动释放一个无需再用的bgm。
|
||||
|
||||
## 录像
|
||||
|
||||
HTML5魔塔一大亮点就是存在录像系统，可以很方便进行录像回放。
|
||||
|
||||
当你在游戏的过程中，随着你的操作，录像也会被依次记录。游戏结束后将提示是否下载录像，上传成绩时也会上传你的录像信息。
|
||||
|
||||
在菜单栏-同步存档中，可以直接对当前录像进行下载。
|
||||
|
||||
!> 录像记录的是你当前的路线（本质上是模拟键盘操作），是一个纯文本文件，占用空间很小！
|
||||
|
||||
录像的回放主要有两种方式：
|
||||
|
||||
1. 保存成的录像文件(.h5route文件)：在标题界面点录像回放，再选择文件即可。
|
||||
2. 游戏过程中时的当前录像：随时按R可以进行回放；手机端则长按任何位置3秒以上调出虚拟键盘，再按R。
|
||||
|
||||
录像播放过程中，可以进行如下操作：
|
||||
|
||||
- **暂停/播放：** 按空格可以随时暂停或播放录像。
|
||||
- **加速：** 按X可以加速录像播放，最高可达6倍速。
|
||||
- **减速：** 按Z可以减速录像播放，最低可达0.3倍速。
|
||||
- **停止：** 按ESC可以立刻停止录像播放，并返回正常游戏。
|
||||
- **回退：** 按A可以回退到上一个录像节点（录像播放过程中每50步存一个录像节点）。
|
||||
- **存档：** 按S可以在录像播放过程中进行存档。
|
||||
- **查看手册：** 按C可以在录像播放过程中查看怪物手册。
|
||||
- **浏览地图：** 按PgUp/PgDn可以在录像播放过程中浏览地图。
|
||||
|
||||
如果录像出现问题，请加群539113091找小艾反馈Bug。
|
||||
|
||||
## 绘图模式
|
||||
|
||||
从V2.5开始，样板提供了绘图模式，可以让玩家在画布上任意进行绘制，标记等。
|
||||
|
||||
使用M键，或在菜单栏中可以进入绘图模式。
|
||||
|
||||
**绘图的内容会自动保存，且以页面为生命周期，和存读档无关，返回标题并重新开始游戏后绘制的内容仍有效，但刷新页面就会消失。**
|
||||
|
||||
你可以将绘制内容保存到文件，也可以从文件读取保存的绘制内容。
|
||||
|
||||
绘图模式下，状态栏的图标也会相应改变，铅笔为绘制模式，橡皮为擦除模式，存读档为保存和读取绘图文件，退出为返回默认值。
|
||||
|
||||
在浏览地图页面中也可以按楼传按钮或M键来开启/关闭该层的绘图显示。
|
||||
|
||||
## 操作说明
|
||||
|
||||
本塔主要支持鼠标（触摸屏）操作和键盘操作。
|
||||
|
||||
鼠标（触摸屏）操作说明如下：
|
||||
|
||||
- **点状态栏中图标：** 进行对应的操作
|
||||
- **点任意块：** 寻路并移动
|
||||
- **点任意块并拖动：** 指定寻路路线
|
||||
- **单击勇士：** 转向
|
||||
- **双击勇士：** 轻按（仅在轻按开关打开时有效）
|
||||
- **长按任意位置：** 打开虚拟键盘
|
||||
|
||||
键盘操作快捷键如下：
|
||||
|
||||
- **[CTRL]** 跳过对话
|
||||
- **[Z]** 转向
|
||||
- **[X]** 打开/关闭怪物手册
|
||||
- **[G]** 打开/关闭楼层传送器
|
||||
- **[A]** 读取自动存档
|
||||
- **[S/D]** 打开/关闭存/读档页面
|
||||
- **[V]** 打开/关闭快捷商店选择列表
|
||||
- **[T]** 打开/关闭工具栏
|
||||
- **[Q]** 打开/关闭装备栏
|
||||
- **[ESC]** 打开/关闭系统菜单
|
||||
- **[B]** 打开数据统计
|
||||
- **[H]** 打开帮助页面
|
||||
- **[R]** 回放录像
|
||||
- **[E]** 显示光标
|
||||
- **[SPACE]** 轻按（仅在轻按开关打开时有效）
|
||||
- **[M]** 绘图模式
|
||||
- **[PgUp/PgDn]** 浏览地图
|
||||
- **[1]** 快捷使用破墙镐
|
||||
- **[2]** 快捷使用炸弹/圣锤
|
||||
- **[3]** 快捷使用中心对称飞行器
|
||||
- **[4]** 快捷使用其他道具
|
||||
- **[Alt+0~9]** 快捷换装
|
||||
|
||||
以上快捷键也能在游戏菜单中的操作说明中看到。
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
上面就是整个样板中的各个元件说明。通过这种方式，你就已经可以做出一部没有任何事件的塔了。
|
||||
|
||||
尝试着做一个两到三层的塔吧！
|
||||
|
||||
==========================================================================================
|
||||
|
||||
[继续阅读下一章：事件](event)
|
||||
+2351
File diff suppressed because it is too large.
Load diff
Binary file not shown.
|
After Width: | Height: | Size: 4.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 156 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 190 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 169 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 124 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 186 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 69 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 97 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 105 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 472 B |
Binary file not shown.
|
After Width: | Height: | Size: 98 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 172 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 36 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 163 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 131 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 61 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 108 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 89 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 83 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 138 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 112 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
@@ -0,0 +1,50 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>HTML5魔塔样板</title>
|
||||
<link rel="shortcut icon" type="image/png" href="./img/logo.png">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
<meta name="description" content="Description">
|
||||
<meta http-equiv="pragma" content="no-cache">
|
||||
<meta http-equiv="cache-control" content="no-cache">
|
||||
<meta http-equiv="expires" content="0">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
||||
<link href="https://cdn.bootcss.com/docsify/4.5.5/themes/vue.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script>
|
||||
window.$docsify = {
|
||||
homepage: 'index.md',
|
||||
loadSidebar: true,
|
||||
name: 'HTML5魔塔样板',
|
||||
repo: 'https://github.com/ckcz123/mota-js',
|
||||
// basepath: '../docs/',
|
||||
|
||||
// Search Support
|
||||
// search: {
|
||||
// maxAge: 43200000, // 过期时间，单位毫秒，默认一天
|
||||
// paths: 'auto',
|
||||
// placeholder: {
|
||||
// '/en/': 'Search',
|
||||
// '/': '搜索',
|
||||
// },
|
||||
// noData: {
|
||||
// '/en/': 'No Results',
|
||||
// '/': '找不到结果',
|
||||
// },
|
||||
// },
|
||||
|
||||
// load sidebar from _sidebar.md
|
||||
loadSidebar: '_sidebar',
|
||||
subMaxLevel: 2,
|
||||
autoHeader: true,
|
||||
auto2top: true,
|
||||
mergeNavbar: true,
|
||||
formatUpdated: '{YYYY}-{MM}-{DD} {HH}:{mm}:{ss}',
|
||||
}
|
||||
</script>
|
||||
<script src="https://cdn.bootcss.com/docsify/4.5.5/docsify.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,20 @@
|
||||
# HTML5 魔塔样板说明文档
|
||||
|
||||
?> 目前版本**v2.5.4**，上次更新时间：* {docsify-updated} *
|
||||
|
||||
众所周知，魔塔的趋势是向移动端发展，贴吧中也常常能见到“求手机魔塔”的帖子。然而现有的工具中，NekoRPG有着比较大的局限性，游戏感较差，更是完全没法在iOS上运行。而一些APP的魔塔虽然可用，但是必须要下载安装，对于Android和iOS还必须开发不同的版本，非常麻烦。
|
||||
|
||||
但是，现在我们有了HTML5。 HTML5的画布（canvas）以及它被Android/iOS内置浏览器所支持的特性，可以让我们做出真正意义上的全平台覆盖的魔塔。
|
||||
事实上，在贴吧的试水发布也证明了，H5魔塔确实是可以成功的。两部即使是复刻的魔塔也受到了不少人的追捧，其流畅的手感和全平台支持的特性，也让很多没办法打开电脑的人爱不释手。
|
||||
|
||||
然而，一般而言使用非RMXP制作魔塔往往需要一定的编程技术，HTML5魔塔自然也不例外。但是，为了能让大家更加注重于“做塔”本身，而不用考虑做塔以外的各种脚本问题，我特意制作了这样一部HTML5的魔塔样板。
|
||||
|
||||
> 这个魔塔样板，可以让你在完全不懂任何编程的情况下，做出自己的H5魔塔。不会代码？没关系！只要你想做，就能做出来！
|
||||
|
||||
继续查看文档的详细介绍，让你学会如何使用这一个样板来制作属于自己的HTML5魔塔。
|
||||
|
||||
本说明文档配有B站视频教程，对照查看效果更佳哦：[https://www.bilibili.com/video/av32781473/](https://www.bilibili.com/video/av32781473/)。
|
||||
|
||||
==========================================================================================
|
||||
|
||||
[继续阅读下一章：现在就做出自己的第一部H5魔塔！](start)
|
||||
@@ -0,0 +1,980 @@
|
||||
# 个性化
|
||||
|
||||
?> 目前版本**v2.5.4**，上次更新时间：* {docsify-updated} *
|
||||
|
||||
有时候只靠样板本身可能是不够的。我们需要一些个性化、自定义的素材，道具效果，怪物属性，等等。
|
||||
|
||||
## 图层的说明
|
||||
|
||||
HTML5魔塔是使用画布（canvas）来绘制，存在若干个图层，它们之间有一个覆盖关系，后面的图层将覆盖前面的图层。
|
||||
|
||||
所有图层从低往高依次如下：（加[B]的代表该层是大地图，[D]代表由系统按需动态创建，z-index代表该层的纵向高度）
|
||||
|
||||
- bg**[B]**：背景层；绘制背景图层素材bgmap，和背景贴图 (z-index: 10)
|
||||
- event**[B]**：事件层；所有事件（道具、墙壁、NPC、怪物等）都绘制在这一层进行处理 (z-index: 30)
|
||||
- hero：勇士层；主要用来绘制勇士 (z-index: 40)
|
||||
- event2**[B]**：事件2层；本层主要用来绘制48x32的图片素材的上半部分（避免和勇士错位） (z-index: 50)
|
||||
- fg**[B]**：前景层；绘制前景图层素材fgmap，和前景贴图 (z-index: 60)
|
||||
- damage**[B]**：显伤层；主要用来绘制怪物显伤和领域显伤 (z-index: 65)
|
||||
- animate：动画层；主要用来绘制动画。 (z-index: 70)
|
||||
- weather**[D]**：天气层；主要用来绘制天气（雨/雪/雾） (z-index: 80)
|
||||
- route**[D]**：路线层；主要用来绘制勇士的行走路线图。 (z-index: 95)
|
||||
- paint**[D]**：绘图层；主要用来进行绘图模式。（z-index: 95)
|
||||
- curtain：色调层；用来控制当前楼层的画面色调 (z-index: 125)
|
||||
- image1\~50**[D]**：图片层；用来绘制图片等操作。（z-index: 100+code, 101~150；也就是图片编号在1~25的在色调层之下，26~50的在色调层之上）
|
||||
- ui：UI层；用来绘制一切UI窗口，如剧情文本、怪物手册、楼传器、系统菜单等等 (z-index: 160)
|
||||
- data：数据层；用来绘制一些顶层的或更新比较快的数据，如左上角的提示，战斗界面中数据的变化等等。 (z-index: 170)
|
||||
|
||||
### 动态创建canvas
|
||||
|
||||
从V2.5.3开始，可以在H5样板中任意动态创建canvas并进行使用。
|
||||
|
||||
使用`core.createCanvas(name, x, y, w, h, z)`来动态创建一个画布。
|
||||
|
||||
其中name为动态canvas名称，x,y,w,h为创建的画布相对窗口左上角的像素坐标和长宽，z为画布的纵向高度。
|
||||
|
||||
例如：`core.createCanvas('test', 10, 20, 100, 200, 74)` 创建了一个名为test的画布，其左上角相对窗口的像素坐标为(10,20)，宽100高200，纵向高度74（在动画层和天气层之间）。
|
||||
|
||||
该函数会返回画布的context，也可以通过 `core.dymCanvas[name]` 来获得；例如 `core.dymCanvas.test` 就是我们上面创建的画布的context，然后进行操作。
|
||||
|
||||
也可以简单的使用`core.fillText()`, `core.fillRect()`, `core.strokeRect()`等等对画布进行任意绘制。
|
||||
|
||||
``` js
|
||||
core.fillText('test', '这是一段文字', 10, 30, '#FF0000', '16px Verdana'); // 绘制一段文本
|
||||
```
|
||||
|
||||
使用 `core.deleteCanvas(name)` 删除一个动态创建的画布，例如 `core.deleteCanvas('test')`。
|
||||
|
||||
`core.deleteAllCanvas()`可以删除所有动态创建的画布，`core.relocateCanvas(name, x, y)`和`core.resizeCanvas(name, x, y)`可以对画布的位置和大小进行改变。
|
||||
|
||||
更多详细API请参见[API列表](api)。
|
||||
|
||||
## 自定义素材
|
||||
|
||||
所有素材的图片都在`images`目录下。
|
||||
- `animates.png` 为所有动画效果。主要是星空熔岩，开门，毒网，传送门之类的效果。为四帧。
|
||||
- `autotile*.png` 为Autotile块。
|
||||
- `enemys.png` 为所有怪物的图片。
|
||||
- `enemy48.png` 为所有48x32怪物的图片。
|
||||
- `heros.png` 为勇士行走图。
|
||||
- `items.png` 为所有道具的图标。
|
||||
- `npcs.png` 为所有NPC的图标。
|
||||
- `npc48.png` 为所有48x32的NPC图标。
|
||||
- `terrains.png` 为所有地形的图标。
|
||||
|
||||
系统会读取`icon.js`文件，并获取每个ID对应的图标所在的位置。
|
||||
|
||||
### 使用预定义的素材
|
||||
|
||||
在images目录的“默认素材”下给定了若干预定义的自定义素材。
|
||||
|
||||
如果你需要某个素材已经存在，则可以直接将其覆盖images目录下的同名文件，就能看到效果。
|
||||
|
||||
### 背景和前景图层
|
||||
|
||||
从V2.4.1开始，样板允许多个图层叠加，最多支持背景层、事件层和前景层三个图层。
|
||||
|
||||
在地图编辑器中绘图时，下拉框选中“背景层”或“前景层”即可在对应的图层上绘图。
|
||||
|
||||
其中背景层和前景层可以使用任何素材，以及使用自动元件（autotile）。
|
||||
|
||||
可以使用`showBgFgMap`, `hideBgFgMap`, `setBgFgBlock`等事件对背景和前景图层进行操作。
|
||||
|
||||
### 使用自己的图片作为某层楼的背景/前景素材
|
||||
|
||||
由于HTML5功能（素材）有限，导致了对很多比较复杂的素材（比如房子内）等无法有着较好的绘图方式。
|
||||
|
||||
为了解决这个问题，我们允许用户自己放置一张或多张图片作为某一层的背景/前景素材。
|
||||
|
||||
要启用这个功能，我们首先需要在`data.js`中将可能的图片进行加载。
|
||||
|
||||
``` js
|
||||
"images": [ // 在此存放所有可能使用的图片
|
||||
// 图片可以被作为背景/前景图，也可以直接用自定义事件进行显示。
|
||||
// 图片名不能使用中文，不能带空格或特殊字符；可以直接改名拼音就好
|
||||
// 建议对于较大的图片，在网上使用在线的“图片压缩工具(http://compresspng.com/zh/)”来进行压缩，以节省流量
|
||||
"bg.jpg", "house.png", "bed.png"// 依次向后添加
|
||||
];
|
||||
```
|
||||
|
||||
!> 请使用网上的一些[在线图片压缩工具](http://compresspng.com/zh/)对图片进行压缩，以节省流量。
|
||||
|
||||
之后，我们可以在每层剧本的`"images"`里来定义该层的默认背景/前景层的图片素材。
|
||||
|
||||
从V2.5.4开始，贴图也允许进行帧动画，只要设置第五项的数值。
|
||||
|
||||
``` js
|
||||
"images": [[96,120,"bg.jpg",0]], // 背景图；你可以选择一张或多张图片来作为背景/前景素材。
|
||||
"images": [], // 无任何背景图
|
||||
"images": [[32,32,"house.png",0], [160,170,"bed.png",1]] // 在(32,32)放一个house.png在背景层，且(160,170)放bed.png在前景层
|
||||
"images": [[96,120,"tree.png",2]] // 如果写2，则会自动调节遮挡效果
|
||||
"images": [[64,0,"x.png",1,4]] // 这是一个前景层的4帧动画贴图
|
||||
```
|
||||
|
||||
images为一个数组，代表当前层所有作为背景素材的图片信息。每一项为一个五元组，分别为该背景素材的x，y，图片名，遮挡方式和帧数。
|
||||
|
||||
其中x和y分别为左上角的像素坐标；图片名则必须在全塔属性的images中定义过。
|
||||
|
||||
第四项为遮挡方式，定义如下：
|
||||
|
||||
- 0：该图片将全部画在背景层，被勇士所遮挡。举例：某些特殊地形等。
|
||||
- 1：该图片将全部画在前景层，可以遮挡勇士。举例：云彩等效果。
|
||||
- 2：该图片将上部分画在前景层，下部分画在背景层。从而可以达到一个“自动调节遮挡的效果”。举例：树、房子等等。
|
||||
|
||||
!> 如果写2的话，最好让x，y和图片高度都是32的倍数！
|
||||
|
||||
第五项为图片的帧数，可选。如果进行了设置，则会将该贴图视为帧动画，并切分成对应的帧数。
|
||||
|
||||
例如，假设图片是100x100的，且帧数设为4，则视为四帧帧动画，每次绘制的图片大小实际上是25x100。
|
||||
|
||||
关于楼层贴图和前景、背景层的层叠覆盖关系，默认是：**地板 - 背景贴图 - 背景图块 - 事件 - 勇士 - 前景贴图 - 前景图块**。
|
||||
|
||||
可以通过修改`libs/maps.js`的`drawMap`函数中下面三行的顺序来改变其覆盖关系。
|
||||
|
||||
``` js
|
||||
// ----- 可以调整这三行的顺序来修改覆盖关系；同层画布上，后绘制的覆盖先绘制的
|
||||
// ----- ui.js的drawThumbnail函数也需要对应进行修改。
|
||||
|
||||
// 绘制楼层贴图
|
||||
core.maps.drawFloorImages(floorId, images);
|
||||
// 绘制背景层图块
|
||||
core.maps.drawBgFgMap(floorId, core.canvas.bg, "bg", true);
|
||||
// 绘制前景层图块
|
||||
core.maps.drawBgFgMap(floorId, core.canvas.fg, "fg", true);
|
||||
```
|
||||
|
||||
楼层贴图可以被事件隐藏和显示，详见[隐藏贴图](event#hideFloorImg：隐藏贴图)的写法。
|
||||
|
||||
**如果要让贴图的某些点不可通行，则可以使用noPass或者空气墙。**
|
||||
|
||||
!> 小技巧：可以使用帧动画贴图来贴一些大型怪物，比如魔龙、章鱼，或者《永不复还》中的恐怖利刃等等。如果使用帧贴图来贴怪物，则可以使用一个“透明的怪物”放置在对应位置并写上具体属性数值（这样就可以进行战斗和显伤了）；然后可以使用[displayIdInBook](element#怪物的朝向问题)在怪物手册中将该透明怪物映射到另一个有素材的怪物ID上。战斗完毕后使用[隐藏贴图](event#hideFloorImg：隐藏贴图)事件将贴图隐藏即可。
|
||||
|
||||
### 使用便捷PS工具生成素材
|
||||
|
||||
如果我们有更多的素材要求，我们可以使用“便捷PS工具”进行处理。
|
||||
|
||||
|
||||
|
||||
我们可以打开有需求改变的素材，和我们需要被替换的素材，然后简单的Ctrl+C和Ctrl+V操作即可。
|
||||
|
||||
便捷PS工具同样支持图片色相的修改，和RMXP几乎完全相同。
|
||||
|
||||
用这种方式，我们能极快地替换或素材，包括需要新增的怪物。
|
||||
|
||||
### 添加素材到游戏
|
||||
|
||||
在使用地图编辑器编辑的过程中，我们有可能会出现“该数字和ID未被定义”的错误提示。
|
||||
|
||||
这是因为，该素材没有被定义，无法被游戏所识别。
|
||||
|
||||
!> 在V2.0中，我们可以简单的在地图编辑器中新增素材，以及定义新增素材的ID和数字，但是仍然**强烈建议**对素材的机制进行了解。
|
||||
|
||||
#### 素材的机制
|
||||
|
||||
本塔所有的素材都拥有三个属性：**ID**，**索引**，**数字**。
|
||||
- **ID** 为该素材的唯一标识符，任何两个素材的ID都不能相同。
|
||||
- **索引** 为该素材的在对应图片上的图标索引，即该素材是图片上的第几个。
|
||||
- **数字** 为该素材的对应数字，以方便地图的生成和存储。
|
||||
|
||||
**`ID-索引` 对应关系定义在icons.js文件中。该文件将唯一确定一个ID在图片上所在的位置。**
|
||||
|
||||
**`ID-数字` 对应关系定义在maps.js文件中。该文件将唯一确定一个ID对应的数字是多少。**
|
||||
|
||||
在V2.0中，我们可以在地图编辑器中很方便查看每个图块的三个属性信息。
|
||||
|
||||
#### 注册素材
|
||||
|
||||
在V2.0的地图编辑器中，要注册新素材，我们只需要在图块属性一栏输入新素材的ID和数字。
|
||||
|
||||
|
||||
|
||||
ID必须由数字字母下划线组成，数字在1000以内，且均不能和已有的进行重复。
|
||||
|
||||
之后刷新编辑器即可。
|
||||
|
||||
对于怪物和道具，我们也可以进行自动注册，只需要点击“自动注册”按钮，将对该栏下所有未注册的素材进行自动注册（自动分配ID和数字）。
|
||||
|
||||
素材注册完毕后，即可在游戏中正常使用，也可以被地图生成器所识别（需要重开地图生成器）。
|
||||
|
||||
#### Autotile自动元件的注册
|
||||
|
||||
但是，通过上面这种方式，我们是没办法新增并注册Autotile的。
|
||||
|
||||
除了替换样板现有的几个外，如果我们还需要新添加Autotile，则：
|
||||
|
||||
1. 下拉框切到“追加素材”，导入文件到画板，然后导入一张Autotile自动元件图片。
|
||||
2. 下拉框选择autotile，然后点“追加”
|
||||
3. 看到成功的提示后刷新编辑器即可。
|
||||
|
||||
<!--
|
||||
|
||||
1. 将新的Autotile图片复制到images目录下。文件名必须是字母数字和下划线组成。
|
||||
2. 进入icons.js，在autotile分类下进行添加该文件的名称，索引简单的写0。
|
||||
3. 指定一个数字，在maps.js中类似进行添加。
|
||||
|
||||
!> Autotile的ID和文件名应确保完全相同！
|
||||
|
||||
-->
|
||||
<!--
|
||||
#### 新添加自定义地形（路面、墙壁等）
|
||||
|
||||
如果你在terrains.png中新增了一行：
|
||||
|
||||
1. 指定一个唯一的英文ID，不能和现有的重复。
|
||||
2. 进入icons.js，在terrains分类下进行添加索引（对应图标在图片上的位置，即index）
|
||||
|
||||
**如果你无须在游戏内使用本地形，而仅仅是将其作为“背景图”使用，则操作如下：**
|
||||
3. 修改对应楼层的剧本文件的`defaultGround`项，改成新的ID。
|
||||
|
||||
**如果你要在游戏内使用本地形，则操作如下：**
|
||||
3. 指定一个数字，在maps.js中类似进行添加。
|
||||
|
||||
#### 新添加Autotile
|
||||
|
||||
如果你需要新增一个Autotile：
|
||||
|
||||
1. 将新的Autotile图片复制到images目录下。
|
||||
2. 进入icons.js，在autotile分类下进行添加该文件的名称，索引简单的写0。
|
||||
3. 指定一个数字，在maps.js中类似进行添加。
|
||||
|
||||
!> Autotile的ID和文件名完全相同！且其ID/文件名不能含有中文、空格或特殊字符。
|
||||
|
||||
!> V2.0版本不能在地图编辑器中添加Autotile，请按上面的操作来执行。
|
||||
|
||||
#### 新添加道具
|
||||
|
||||
如果你需要新增一个未被定义的道具：
|
||||
|
||||
1. 指定一个唯一的英文ID，不能和现有的重复。
|
||||
2. 进入icons.js，在items分类下进行添加索引（对应图标在图片上的位置，即index）
|
||||
3. 指定一个数字，在maps.js中类似进行添加。
|
||||
4. 在items.js中仿照其他道具，来添加道具的信息。
|
||||
|
||||
有关如何自行实现一个道具的效果，参见[自定义道具效果](#自定义道具效果)。
|
||||
|
||||
#### 新添加怪物
|
||||
|
||||
如果我们需要新添加怪物，请在enemys.png中新增一行。
|
||||
|
||||
你可以通过便捷PS工具的“更改色相”来将红头怪变成橙头怪等。
|
||||
|
||||
然后执行如下操作：
|
||||
|
||||
1. 指定一个唯一的英文ID，不能和enemys中现有的重复。
|
||||
2. 进入icons.js，在enemys分类下进行添加索引（对应图标在图片上的位置，即index）
|
||||
3. 在maps.js中继续进行添加。
|
||||
4. 在enemys.js中仿照其他怪物，来添加怪物的信息。
|
||||
|
||||
!> 如果是48x32的怪物素材，请放在enemy48.png中，然后在icons.js的enemy48下添加索引。
|
||||
|
||||
有关如何自行实现一个怪物的特殊属性或伤害计算公式，参见[怪物的特殊属性](#怪物的特殊属性)。
|
||||
|
||||
#### 新添加NPC
|
||||
|
||||
1. 指定一个唯一的英文ID，不能和现有的重复。
|
||||
2. 进入icons.js，在npcs分类下进行添加索引（对应图标在图片上的位置，即index）
|
||||
3. 指定一个数字，在maps.js的getBlock下类似进行添加。
|
||||
|
||||
!> 如果是48x32的怪物素材，请放在npc48.png中，然后在icons.js的npc48下添加索引。
|
||||
|
||||
-->
|
||||
|
||||
### 地图生成器使用自定义素材
|
||||
|
||||
地图生成器是直接从js文件中读取数字-图标对应关系的。
|
||||
|
||||
因此，在你修改了icons.js和maps.js两个文件，也就是将素材添加到游戏后，地图生成器的对应关系也将同步更新。
|
||||
|
||||
### 额外素材
|
||||
|
||||
从V2.4.2开始，HTML5魔塔样板开始支持额外素材。
|
||||
|
||||
具体而言，通过上面的“素材导入”的方式，确实可以有效地添加素材到游戏。但是，如果想增加大量自定义素材，需要通过便捷PS工具将这些素材全部导入到`terrains.png`中，并且全部是单列，极度不友好。这也导致了野外风的制作相对变得很困难，增加了大量素材处理的工作量。
|
||||
|
||||
额外素材就是为了解决这个问题而被提出。
|
||||
|
||||
所谓`额外素材`，即用户可以自定导入任意张素材图片，无需PS，无需注册，即可直接在游戏中使用。这一点已经十分向RM靠拢了。
|
||||
|
||||
要使用额外素材，请将你需要的素材图片放在`images`目录下，并在`全塔属性`的`tilesets`中定义图片名。
|
||||
|
||||
**该素材的宽高必须都是32的倍数，且图片上的总图块数不超过1000（即最多有1000个32*32的图块在该图片上）。**
|
||||
|
||||
```js
|
||||
"tilesets": ["1.png", "2.png"] // 导入两个额外素材，文件名分别是1.png和2.png
|
||||
```
|
||||
|
||||
刷新后，系统会自动加载该素材并添加到素材区。
|
||||
|
||||
额外素材无需导入，无需注册。在`tilesets`中定义了图片后，即可直接使用绘图，无需再注册其数字和ID。其ID、索引和数字均为系统自动分配，且不允许修改。
|
||||
|
||||
请注意，额外素材的ID、索引和数字，与该图片在tilesets数组中的index及该素材在图片上的位置都有关系。
|
||||
|
||||
!> **因此如果对`tilesets`数组随意删除或修改顺序，可能会导致所有额外素材全部发生变化！这点请务必注意！！！**
|
||||
|
||||
除此之外，额外素材在游戏中的使用和正式素材都是一致的，也能在前景或背景图层绘制。
|
||||
|
||||
额外素材可以使用“tileset贴图”的方式进行绘制，一次绘制一个矩形区域。
|
||||
|
||||
## 自定义道具效果
|
||||
|
||||
本节中将继续介绍如何自己编辑一个道具的效果。
|
||||
|
||||
道具效果的具体实现都在`items.js`中。
|
||||
|
||||
### 即捡即用类道具（cls: items）
|
||||
|
||||
对于即捡即用类道具，如宝石、血瓶、剑盾等，我们可以简单地修改`data.js`中的value一栏即可。
|
||||
|
||||
如果你想要同种宝石在不同层效果不同的话，可以进行如下操作：
|
||||
|
||||
1. 在楼层的item_ratio中定义宝石的比率（比如1-10的写1，11-20层写2等）
|
||||
2. 修改获得道具的itemEffect函数（编辑器中双击进行编辑）
|
||||
|
||||
``` js
|
||||
// ratio为楼层的item_ratio值，可以进行翻倍宝石属性
|
||||
core.status.hero.atk += core.values.redJewel * ratio
|
||||
```
|
||||
|
||||
这里我们可以直接写ratio来取用该楼层中定义的`item_ratio`的值。
|
||||
|
||||
如果不是倍数增加（比如线性增加）也可以类似来写
|
||||
|
||||
``` js
|
||||
// 一个二倍线性增加的例子
|
||||
core.status.hero.atk += core.values.redJewel + 2*ratio
|
||||
```
|
||||
|
||||
### 消耗类道具（cls: tools）；永久类道具（cls: constants）
|
||||
|
||||
如果要自己实现消耗类道具或永久类道具的使用效果，则需修改`items.js`中的canUseItem和useItem两个函数。
|
||||
|
||||
具体过程比较复杂，需要一定的JS能力，在这里就不多说了，有需求可以找`艾之葵`进行了解。
|
||||
|
||||
但值得一提的是，我们可以使用`core.hasItem(name)` 来判断是否某个道具是否存在。例如下面是passNet（通过路障处理）的一部分：
|
||||
|
||||
``` js
|
||||
/****** 经过路障 ******/
|
||||
events.prototype.passNet = function (data) {
|
||||
// 有鞋子
|
||||
if (core.hasItem('shoes')) return;
|
||||
if (data.event.id=='lavaNet') { // 血网
|
||||
// ... 下略
|
||||
```
|
||||
|
||||
我们进行了一个简单的判断，如果拥有绿鞋，则不进行任何路障的处理。
|
||||
|
||||
### 实战！拿到神圣盾后免疫吸血、领域、夹击效果
|
||||
|
||||
1. 在itemEffect中修改拿到神圣盾时的效果，标记一个自定义Flag。
|
||||
``` js
|
||||
core.status.hero.def += core.values.shield5 * ratio;
|
||||
core.setFlag("shield5", true); // 增加一个自定义Flag：已经拿到神圣盾
|
||||
```
|
||||
2. 免疫吸血效果：在脚本编辑的getDamageInfo中，编辑成如果存在神圣盾标记，吸血伤害为0。
|
||||
``` js
|
||||
function (enemy, hero_hp, hero_atk, hero_def, hero_mdef, x, y, floorId) {
|
||||
// ... 上略
|
||||
// 吸血
|
||||
if (this.hasSpecial(mon_special, 11)) {
|
||||
var vampireDamage = hero_hp * enemy.value;
|
||||
|
||||
// 如果有神圣盾免疫吸血等可以在这里写
|
||||
// 也可以用hasItem或hasEquip来判断装备
|
||||
if (core.hasFlag("shield5")) vampireDamage = 0; // 存在神圣盾，吸血伤害为0
|
||||
|
||||
vampireDamage = Math.floor(vampireDamage) || 0;
|
||||
// 加到自身
|
||||
if (enemy.add) // 如果加到自身
|
||||
mon_hp += vampireDamage;
|
||||
|
||||
initDamage += vampireDamage;
|
||||
}
|
||||
// ... 下略
|
||||
```
|
||||
3. 免疫领域、夹击、阻击效果：在2.4.1之后，可以直接将flag:no_zone设为true来免疫领域效果，其他几个同理。
|
||||
``` js
|
||||
// 写在获得道具后事件
|
||||
[
|
||||
// 设置不同的flag可以分别无视对应的阻激夹域效果
|
||||
{"type": "setValue", "name": "flag:no_zone", "value": "true"}, // 免疫领域
|
||||
{"type": "setValue", "name": "flag:no_snipe", "value": "true"}, // 免疫阻击
|
||||
{"type": "setValue", "name": "flag:no_laser", "value": "true"}, // 免疫激光
|
||||
{"type": "setValue", "name": "flag:no_betweenAttack", "value": "true"}, // 免疫夹击
|
||||
]
|
||||
```
|
||||
4. 如果有更高的需求，例如想让吸血效果变成一半，则还是在上面这些地方进行对应的修改即可。
|
||||
|
||||
## 新增门和对应的钥匙
|
||||
|
||||
如果要新增一个门和对应的钥匙，需要进行如下几步：
|
||||
|
||||
1. 在terrains.png中添加新的门的素材，并在地图编辑器中注册门的ID。该ID必须是以`Door`结尾，例如`abcDoor`。
|
||||
2. 在animates.png中添加开门的四格动画，然后直接打开icons.js文件，在animates下直接添加ID和索引信息，例如`'abcDoor': 34`。
|
||||
3. 在items.png中添加钥匙的素材，并在地图编辑器中注册钥匙的ID。该ID必须是和门对应且以`Key`结尾，例如`abcKey`。
|
||||
4. 该道具的cls应为`tools`，可以自行写道具描述，最下面几项均留`null`即可。
|
||||
|
||||
!> **请勿在animates中对门的动画素材进行注册！而是请直接打开icons.js文件并添加ID和索引信息！！！**
|
||||
|
||||
!> terrains和animates的门ID必须完全一致，且以`Door`结尾；所对应的钥匙ID应当是把`Door`换成`Key`，这样才能对应的上！
|
||||
|
||||
## 覆盖楼传事件
|
||||
|
||||
对于特殊的塔，我们可以考虑修改楼传事件来完成一些特殊的要求，比如镜子可以按楼传来切换表里。
|
||||
|
||||
要修改楼传事件，需要进行如下几步：
|
||||
|
||||
1. 截获楼传的点击事件。在control.js中找到useFly函数，并将其替换成如下内容：
|
||||
``` js
|
||||
////// 点击楼层传送器时的打开操作 //////
|
||||
control.prototype.useFly = function (need) {
|
||||
if (!core.status.heroStop) {
|
||||
core.drawTip("请先停止勇士行动");
|
||||
return;
|
||||
}
|
||||
if (core.canUseItem('fly')) core.useItem('fly');
|
||||
else core.drawTip("当前无法使用"+core.material.items.fly.name);
|
||||
}
|
||||
```
|
||||
2. 修改楼传的使用事件。和其他永久道具一样，在地图编辑器的图块属性中修改楼传的useItemEffect和canUseItemEffect两个内容。例如：
|
||||
``` js
|
||||
"useItemEffect": "core.insertAction([...])" // 执行某段自定义事件，或者其他脚本
|
||||
"canUseItemEffect": "true" // 任何时候可用
|
||||
```
|
||||
修改时，请先把`null`改成空字符串`""`，然后再双击进行编辑。
|
||||
|
||||
<!--
|
||||
|
||||
## 自定义装备
|
||||
|
||||
由于HTML5魔塔并不像RM那样存在一个装备界面可供我们对装备进行调整，但是我们也可以使用一个替代的方式实现这个目标。
|
||||
|
||||
### 装备的实现原理
|
||||
|
||||
在HTML5中，装备将全部看成是永久道具（constants），同时对于每个装备位置，勇士都定义一个flag域表示正在装备的内容。
|
||||
|
||||
例如：当勇士获得银剑时，将获得一个永久道具“银剑”；当使用这个银剑，首先检查勇士当前是否装备了武器（比如铁剑），如果
|
||||
装备了则先脱掉装备（减去已装备的铁剑所加的属性，并获得永久道具铁剑），然后再穿上新的银剑。
|
||||
|
||||
同时由于脱剑术和脱盾术的存在，我们还需要一个“脱掉装备”的永久道具（比如sword0），使用它可以脱掉对应位置的装备。
|
||||
|
||||
### 装备加值的修改
|
||||
|
||||
要启用装备，首先需要在data.js（全塔属性）中设置`'equipment': true`。此时，游戏内将自动将剑盾变成装备的存在，其
|
||||
所加的数值就是全塔属性中对应的数值（比如铁剑sword1就加的全塔属性中sword1的值）。
|
||||
|
||||
有时候，我们还会有一个装备加多种属性的需求，此时需要将对应的项从数值改变成一个对象。
|
||||
|
||||
``` js
|
||||
"sword1": {"atk": 10, "def": 0, "mdef": 5}, // 铁剑加10攻和5魔防
|
||||
"shield1": {"atk": 0, "def": 10, "mdef": 10}, // 铁盾加10防和10魔防
|
||||
```
|
||||
|
||||
通过这种方式，当穿上装备时，将会给你的三围分别加上对应项的数值（支持负数，比如装剑减防御）。
|
||||
|
||||
### 新增剑盾
|
||||
|
||||
样板默认提供了铁剑（盾），银剑（盾），骑士剑（盾），圣剑（盾）和神圣剑（盾）这五类装备。但有时候，五类是不够的，
|
||||
我们可能还需要更多的剑盾。
|
||||
|
||||
要增加更多的剑盾，我们需要进行如下步骤：（以新增剑为例）
|
||||
|
||||
1. 新注册一个素材到游戏；**其ID必须是sword+数字的形式，比如sword6等。**（同理如果是盾就必须是shield+数字的形式比如shield6。）
|
||||
2. 将其cls设置为`constants`，`useItemEffect`和`canUseItem`直接复制其他几个剑盾的内容。
|
||||
（即：`useItemEffect`必须为`"core.plugin.useEquipment(itemId)"`，`canUseItemEffect`必须为`"true"`）。
|
||||
3. 使用VSCode或其他文本编辑器直接打开`data.js`文件，并在`"values"`中仿照已有的内容添加剑盾的属性。
|
||||
（例如：`"sword6": 100`，或者`"sword6": `{"atk": 100, "def": 0, "mdef": 50}`）
|
||||
|
||||
!> 请注意：新的剑的ID必须是sword+数字，新的盾的ID必须是shield+数字的形式，不然装备将无效！
|
||||
|
||||
### 新增其他部位的装备
|
||||
|
||||
如果我们还需要新增更多部位的装备，比如戒指、首饰等等，也是可以的，只需要依次进行如下步骤：（以新建戒指为例）
|
||||
|
||||
1. 选择一个装备的部位的ID；比如假设我们的装备部位为戒指，那么我们可以选择"ring"作为装备的部位。
|
||||
2. 定义一个空戒指，相当于脱掉戒指。注册一个素材到游戏，**其ID必须是ring0**（即部位ID+数字0）。
|
||||
3. 同上述新建剑盾的方式来设置ring0这个空戒指的属性。请注意打开data.js后，设置的其值必须为0。
|
||||
(即：必须是`"ring0": 0`)
|
||||
3. 创建更多的戒指；每加一个新的戒指到游戏，其ID必须是**ring+数字**的形式，比如`ring1`, `ring2`，等等。
|
||||
4. 对于每一个创建的戒指，按照上述新建剑盾的方式设置属性（图块属性，打开data.js直接编辑）。
|
||||
（例如：`"ring2": {"atk": 3, "def": 5, "mdef": 8}`）
|
||||
5. **切换到脚本编辑 - 自定义插件编写，在`this.useEquipment`中仿照着新增一行代表戒指的使用。**
|
||||
|
||||
``` js
|
||||
this.useEquipment = function (itemId) { // 使用装备
|
||||
_useEquipment(itemId, "sword", "atk"); // 剑
|
||||
_useEquipment(itemId, "shield", "def"); // 盾
|
||||
_useEquipment(itemId, "ring", "mdef"); // 新增的戒指
|
||||
}
|
||||
```
|
||||
|
||||
我们仿照着新增一行`_useEquipment(itemId, "ring", "mdef")`。
|
||||
|
||||
其中第二项为装备部位的ID，比如我们上述定义的是ring；第三项表示“如果values中该值为数字，则加到什么属性上”。
|
||||
比如如果我们这里写mdef，那么我们假设在data.js的values中设置`"ring1": 20`，则使用该戒指会增加20点魔防。
|
||||
|
||||
如果你定义的是对象`{"atk": xxx, "def": xxx, "mdef": xxx}`的形式，则不会受到第三项的影响。
|
||||
|
||||
!> 必须对于每一个装备部位定义唯一一个不同的ID；脱掉装备（空装备）必须是该ID加数字0的形式，其他有效装备必须是
|
||||
该ID+正整数的形式，不然会出错！
|
||||
|
||||
-->
|
||||
|
||||
## 自定义怪物属性
|
||||
|
||||
如果你对现有的怪物不满意，想自行添加怪物属性也是可以的。具体参见脚本编辑-getSpecials。
|
||||
|
||||
你需自己指定一个special数字，修改属性名和属性提示文字。后两者可以直接写字符串，或写个函数传入怪物。
|
||||
|
||||
如果要修改伤害计算公式，请修改下面的getDamageInfo函数。请注意，如果无法战斗，该函数必须返回`null`。
|
||||
|
||||
!> 如果改动了伤害计算公式，可能导致临界计算崩掉，因此建议将全塔属性中的`useLoop`置为true。
|
||||
|
||||
对于毒衰弱怪物的战斗后结算在脚本编辑中的afterBattle函数中。
|
||||
|
||||
对于领域、夹击、阻击怪物的检查在`control.js`中的checkBlock函数中。
|
||||
|
||||
## 自定义快捷键
|
||||
|
||||
如果需要绑定某个快捷键为处理一段事件，也是可行的。
|
||||
|
||||
要修改按键，我们可以在脚本编辑的`onKeyUp`进行处理：
|
||||
|
||||
比如，我们设置一个快捷键进行绑定，比如`Y`，其keycode是89。（有关每个键的keycode搜一下就能得到）
|
||||
|
||||
然后在脚本编辑的`onKeyUp`函数的`switch`中进行处理。
|
||||
|
||||
``` js
|
||||
case 89: // 使用该按键的keyCode，比如Y键就是89
|
||||
// 还可以再判定altKey是否被按下，即 if (altKey) { ...
|
||||
|
||||
// ... 在这里写你要执行脚本
|
||||
// **强烈建议所有新增的自定义快捷键均能给个对应的道具可点击，以方便手机端的行为**
|
||||
if (core.hasItem('...')) {
|
||||
core.useItem('...');
|
||||
}
|
||||
|
||||
break;
|
||||
```
|
||||
|
||||
强烈建议所有新增的自定义快捷键均给个对应的永久道具可点击，以方便手机端的行为。
|
||||
|
||||
可以使用altKey来判断Alt键是否被同时按下。
|
||||
|
||||
## 公共事件
|
||||
|
||||
从V2.5.4开始，样板提供了“公共事件”下拉框，我们可以在里面用事件编辑器进行编辑，并通过`{"type":"insert"}`进行调用。
|
||||
|
||||
|
||||
|
||||
具体详见[插入公共事件或另一个地点的事件并执行](event#insert：插入公共事件或另一个地点的事件并执行)。
|
||||
|
||||
当然，继续使用**插件**的写法也是可以的。
|
||||
|
||||
## 插件系统
|
||||
|
||||
在H5中，提供了“插件”系统。具体参见“脚本编辑 - 插件编写”。
|
||||
|
||||
|
||||
|
||||
当我们在这上面定义了自己需要的函数（插件后），就可以通过任何方式进行调用。
|
||||
|
||||
在这个插件编写的过程中，我们可以使用任何[常见API](api)里面的代码调用；也可以通过`core.insertAction`来插入自定义事件执行。
|
||||
|
||||
下面是一个很简单的例子，我编写一个插件函数，其效果是让勇士生命值变成原来的x倍，并令面前的图块消失。
|
||||
|
||||
``` js
|
||||
this.myfunc = function(x) {
|
||||
core.status.hero.hp *= x; // 勇士生命翻若干倍
|
||||
core.insertAction([ // 自定义事件：令面前的图块消失。
|
||||
{"type": "setValue", "name": "flag:x", "value": "core.nextX()"},
|
||||
{"type": "setValue", "name": "flag:y", "value": "core.nextY()"},
|
||||
{"type": "hide", "loc": ["flag:x", "flag:y"]}
|
||||
]);
|
||||
}
|
||||
```
|
||||
|
||||
然后比如我们在某个道具的使用效果 `useItemEffect` 中写 `core.plugin.myfunc(2)` 即可调用此插件函数。也可以在战后事件或自定义脚本等位置来写。
|
||||
|
||||
网站上也提供了一个[插件库](https://h5mota.com/plugins/)，欢迎大家把自己写的插件进行共享。
|
||||
|
||||
## 标题界面事件化
|
||||
|
||||
从V2.5.3开始，我们可以将标题界面的绘制和游戏开始用事件来完成。可以通过绘制画布、
|
||||
|
||||
全塔属性，flags中的startUsingCanvas可以决定是否开启标题界面事件化。
|
||||
|
||||
然后就可以使用“事件流”的形式来绘制标题界面、提供选项等等。
|
||||
|
||||
在这里可以调用任意事件。例如，可以贴若干个图，可以事件切换楼层到某个剧情层再执行若干事件，等等。
|
||||
|
||||
关于选项，样板默认给出的是最简单的choices事件；你也可以使用贴按钮图，循环处理+等待操作来定制自己的按钮点击效果。
|
||||
|
||||
!> 开始游戏、读取存档、录像回放的效果已经默认给出，请不要修改或删减这些内容，以免出现问题。
|
||||
|
||||
标题界面事件全部处理完后，将再继续执行startText事件。
|
||||
|
||||
## 手机端按键模式
|
||||
|
||||
从V2.5.3以后，我们可以给手机端增加按键了，这样将非常有利于技能的释放。
|
||||
|
||||
当用户在竖屏模式下点击工具栏，就会在工具栏按钮和快捷键模式之间进行切换。
|
||||
|
||||
切换到快捷键模式后，可以点1-7，分别等价于在电脑端按键1-7。
|
||||
|
||||
可以在脚本编辑的onKeyUp中定义每个快捷键的使用效果，比如使用道具或释放技能等。
|
||||
|
||||
默认值下，1使用破，2使用炸，3使用飞，4使用其他存在的道具，5-7未定义。可以相应修改成自己的效果。
|
||||
|
||||
也可以替换icons.png中的对应图标，以及修改main.js中`main.statusBar.image.btn1~7`中的onclick事件来自定义按钮和对应按键。
|
||||
|
||||
非竖屏模式下、回放录像中、隐藏状态栏中，将不允许进行切换。
|
||||
|
||||
## 自定义状态栏（新增显示项）
|
||||
|
||||
在V2.2以后，我们可以自定义状态栏背景图（全塔属性 - statusLeftBackground）等等。
|
||||
|
||||
但是，如果我们还想新增其他项目的显示，比如攻速或者暴击，该怎么办？
|
||||
|
||||
需要进行如下几个操作：
|
||||
|
||||
1. 定义ID；比如攻速我就定义speed，暴击可以简单的定义baoji；你也可以定义其他的ID，但是不能和已有的重复。这里以speed为例。
|
||||
2. 在index.html的statusBar中（44行起），进行该状态栏项的定义。仿照其他几项，插在其应当显示的位置，注意替换掉相应的ID。
|
||||
``` html
|
||||
<div class="status" id="speedCol">
|
||||
<img id="img-speed">
|
||||
<p class='statusLabel' id='speed'></p>
|
||||
</div>
|
||||
```
|
||||
3. 在editor.html中的statusBar（323行起），仿照第二点同样添加；这一项如果不进行则会地图编辑器报错。editor-mobile.html同理。
|
||||
4. 使用便捷PS工具，打开icons.png，新增一行并将魔力的图标P上去；记下其索引比如37（从0开始数）。
|
||||
5. 在main.js的this.statusBar中增加图片、图标和内容的定义。
|
||||
``` js
|
||||
this.statusBar = {
|
||||
'images': {
|
||||
// ...其他略
|
||||
'speed': document.getElementById("img-speed"), // 图片的定义
|
||||
},
|
||||
'icons': {
|
||||
// ...其他略
|
||||
'speed': 37, // 图标的定义，这里对应的是icons.png中的索引
|
||||
},
|
||||
// ...其他略
|
||||
'speed': document.getElementById('speed'), // 显示内容（数据）的定义
|
||||
}
|
||||
```
|
||||
6. 显示内容的设置。在脚本编辑的updateStatusBar函数，可以对该状态栏显示内容进行设置，下面是几个例子。
|
||||
``` js
|
||||
// 设置其显示内容为status:speed值；需要在project/data.js中firstData的hero那里新增初始值`"speed": 0`。
|
||||
core.statusBar.speed.innerHTML = core.getStatus('speed');
|
||||
// 设置其显示内容为flag:speed值，无需额外进行定义。
|
||||
core.statusBar.speed.innerHTML = core.getFlag('speed', 0);
|
||||
```
|
||||
|
||||
## 技能塔的支持
|
||||
|
||||
其实，在HTML5上制作技能塔是完全可行的。
|
||||
|
||||
要支持技能塔，可能需要如下几个方面：
|
||||
|
||||
- 魔力（和上限）的添加；技能的定义
|
||||
- 状态栏的显示
|
||||
- 技能的触发（按键与录像问题）
|
||||
- 技能的效果
|
||||
|
||||
从V2.5开始，内置了"二倍斩"技能，可以仿照其制作自己的技能。
|
||||
|
||||
### 魔力的定义添加；技能的定义
|
||||
|
||||
从V2.5开始，提供了status:mana选项，可以直接代表当前魔力值。
|
||||
|
||||
如果要启用，需要开启全塔属性的enableMana选项。
|
||||
|
||||
如果需要魔力上限，则可以使用flag:manaMax来表示当前的魔力最大值。
|
||||
|
||||
同时，我们可以使用flag:skill表示当前开启的技能编号，flag:skillName表示当前开启的技能名称。
|
||||
|
||||
如果flag:skill不为0，则代表当前处于某个技能开启状态，且状态栏显示flag:skillName值。伤害计算函数中只需要对flag:skill进行处理即可。
|
||||
|
||||
### 状态栏的显示
|
||||
|
||||
从V2.5开始，魔力值和技能名的状态栏项目已经被添加，可以直接使用。
|
||||
|
||||
在脚本编辑-updateStatusBar中，可以对状态栏显示内容进行修改。
|
||||
|
||||
``` js
|
||||
// 设置魔力值
|
||||
if (core.flags.enableMana) {
|
||||
// 也可以使用flag:manaMax来表示最大魔力值
|
||||
// core.status.hero.mana = Math.max(core.status.hero.mana, core.getFlag('manaMax', 10));
|
||||
// core.statusBar.mana.innerHTML = core.status.hero.mana + "/" + core.getFlag('manaMax', 10);
|
||||
}
|
||||
// 设置技能栏
|
||||
if (core.flags.enableSkill) {
|
||||
// 可以用flag:skill表示当前开启的技能类型，flag:skillName显示技能名
|
||||
core.statusBar.skill.innerHTML = core.getFlag('skillName', '无');
|
||||
}
|
||||
```
|
||||
|
||||
### 技能的触发
|
||||
|
||||
#### 使用道具作为技能
|
||||
|
||||
由于手机端按键十分不方便，虚拟键盘不好用，因此强烈推荐**给每个技能设置一个道具图标，在道具栏点击使用！**
|
||||
|
||||
下面是个很简单的例子，要制作一个技能"二倍斩"。
|
||||
|
||||
我们可以设置一个道具，其cls是`constants`（永久道具），ID比如是`skill1`。
|
||||
|
||||
该道具的使用判定`canUseItemEffect`是`true`（表示任意时候都可使用），使用效果`useItemEffect`是：
|
||||
|
||||
``` js
|
||||
if (core.getFlag('skill', 0)==0) { // 判断当前是否已经开了技能
|
||||
if (core.getStatus('mana')>=5) { // 这里要写当前能否开技能的条件判断，比如魔力值至少要多少
|
||||
core.setFlag('skill', 1); // 开技能1
|
||||
core.setFlag('skillName', '二倍斩'); // 设置技能名
|
||||
}
|
||||
else {
|
||||
core.drawTip("魔力不足，无法开技能");
|
||||
}
|
||||
}
|
||||
else { // 关闭技能
|
||||
core.setFlag('skill', 0); // 关闭技能状态
|
||||
core.setFlag('skillName', '无');
|
||||
}
|
||||
```
|
||||
|
||||
简单的说，用flag:skill判断当前开启的技能，flag:skillName表示该技能名。（可在状态栏显示）
|
||||
|
||||
该（技能）道具任何时候都可被使用；使用时，判断当前是否开启了技能，如果开启则关闭，没开则再判断是否允许开启（魔力值够不够等）。
|
||||
|
||||
#### 快捷键触发技能
|
||||
|
||||
在PC端，我们还可以按键触发技能。
|
||||
|
||||
在技能的道具定义完毕后，再将该道具绑定到一个快捷键上。有关绑定按键请参见[自定义快捷键](#自定义快捷键)。
|
||||
|
||||
下面是一个很简单的例子，当勇士按下W后，触发我们上面定义的二倍斩技能。
|
||||
|
||||
``` js
|
||||
case 87: // W：开启技能“二倍斩”
|
||||
// 检测技能栏是否开启，是否拥有“二倍斩”这个技能道具
|
||||
if (core.flags.enableSkill && core.hasItem('skill1')) {
|
||||
core.useItem('skill1');
|
||||
}
|
||||
break;
|
||||
```
|
||||
|
||||
在勇士处于停止的条件下，按下W键时，判断技能的道具是否存在，如果存在再使用它。
|
||||
|
||||
!> 1，2，3这三个键被默认绑定到了破炸飞；如果想用的话也是一样，只不过是把已有的实现进行替换。
|
||||
|
||||
### 技能的效果
|
||||
|
||||
最后一点就是技能的效果；其实到了这里就和RM差不多了。
|
||||
|
||||
技能的效果要分的话有地图类技能，战斗效果类技能，后续影响类技能什么的，这里只介绍最简单的战斗效果类技能。
|
||||
|
||||
其他的几类技能根据需求可能更为麻烦，有兴趣可自行进行研究。
|
||||
|
||||
战斗效果内技能要改两个地方：战斗伤害计算，战后扣除魔力值。
|
||||
|
||||
战斗伤害计算在脚本编辑的`getDamageInfo`函数，有需求直接修改这个函数即可。
|
||||
|
||||
战后扣除魔力值则在脚本编辑的`afterBattle`中进行编辑即可。
|
||||
|
||||
举个例子，我设置一个勇士的技能：二倍斩，开启技能消耗5点魔力，下一场战斗攻击力翻倍。
|
||||
|
||||
那么，直接在脚本编辑的`getDamageInfo`中进行判断：
|
||||
|
||||
``` js
|
||||
if (core.getFlag('skill', 0)==1) { // 开启了技能1
|
||||
hero_atk *= 2; // 计算时攻击力翻倍
|
||||
}
|
||||
```
|
||||
|
||||
然后在脚本编辑的`afterBattle`中进行魔力值的扣除：
|
||||
|
||||
``` js
|
||||
// 战后的技能处理，比如扣除魔力值
|
||||
if (core.flags.enableSkill) {
|
||||
// 检测当前开启的技能类型
|
||||
var skill = core.getFlag('skill', 0);
|
||||
if (skill==1) { // 技能1：二倍斩
|
||||
core.status.hero.mana-=5; // 扣除5点魔力值
|
||||
}
|
||||
// 关闭技能
|
||||
core.setFlag('skill', 0);
|
||||
core.setFlag('skillName', '无');
|
||||
}
|
||||
```
|
||||
|
||||
!> 开启技能后，建议将全塔属性的useLoop置为true，即改用循环计算临界值，这样临界计算才不会出问题！
|
||||
|
||||
|
||||
|
||||
通过上述这几种方式，我们就能成功的让H5支持技能啦！
|
||||
|
||||
## 成就系统
|
||||
|
||||
我们还可以给HTML5魔塔增加成就系统。注意到成就是和游戏相关，因此需要使用getLocalStorage而不是getFlag判定。
|
||||
|
||||
可将下面的代码粘贴到脚本编辑 - 插件编写中。
|
||||
|
||||
``` js
|
||||
// 所有成就项的定义
|
||||
this.achievements = [
|
||||
// 每行一个，分别定义flag、名称、描述、是否存在提示、成就点数
|
||||
{"flag": "a1", "name": "成就1", "text": "成就1的达成描述", "hint": false, "point": 1},
|
||||
// 可以继续往后新增其他的。
|
||||
];
|
||||
|
||||
// 达成成就；如 core.plugin.achieve("a1") 即达成a1对应的成就
|
||||
this.achieve = function (flag) {
|
||||
// 获得已达成的成就；如果跟存档而不是跟游戏则改成getFlag
|
||||
var achieved = core.getLocalStorage("achievements", []);
|
||||
var point = core.getLocalStorage("achievePoint", 0);
|
||||
// 已经获得该成就
|
||||
if (achieved.indexOf(flag)>=0) return;
|
||||
// 尝试达成成就；找到对应的成就项
|
||||
this.achievements.forEach(function (one) {
|
||||
if (one.flag == flag) {
|
||||
// 执行达成成就的操作；也可以自行在上面加上达成成就后的事件
|
||||
core.insertAction("\t[达成成就："+one.name+"]"+one.text);
|
||||
point += one.point || 0;
|
||||
}
|
||||
});
|
||||
achieved.push(flag);
|
||||
// 存入localStorage中；如果跟存档走则使用setFlag
|
||||
core.setLocalStorage("achievements", achieved);
|
||||
core.setLocalStorage("achievePoint", point);
|
||||
}
|
||||
|
||||
// 获得所有成就说明；这里简单使用两个insertAction，你也可以修改成自己的实现
|
||||
// 简单一点的可以使用insertAction+剧情文本；稍微复杂一点的可以使用图片化文本等；更复杂的可以自绘UI。
|
||||
this.getAchievements = function () {
|
||||
var achieved = core.getLocalStorage("achievements", []);
|
||||
var yes = [], no = [];
|
||||
// 对所有成就进行遍历
|
||||
this.achievements.forEach(function (one) {
|
||||
// 检测是否达成
|
||||
if (achieved.indexOf(one.flag)>=0) {
|
||||
yes.push(one.name+"："+one.text);
|
||||
}
|
||||
else {
|
||||
no.push(one.name+"："+(one.hint?one.text:"达成条件请自行探索"));
|
||||
}
|
||||
});
|
||||
core.insertAction([
|
||||
"\t[已达成的成就]"+(yes.length==0?"暂无":yes.join("\n")),
|
||||
"\t[尚未达成的成就]"+(no.length==0?"暂无":no.join("\n"))
|
||||
]);
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
|
||||
## 多角色的支持
|
||||
|
||||
其实，我们的样板还能支持多角色的制作。比如《黑·白·间》之类的塔也是完全可以刻的。
|
||||
|
||||
你只需要如下几步来达到多角色的效果。
|
||||
|
||||
1. 每个角色弄一张行走图。相关信息参见[自定义事件：setHeroIcon](event#setHeroIcon：更改角色行走图)。
|
||||
2. [覆盖楼传事件](#覆盖楼传事件)，这样可以通过点工具栏的楼层传送按钮来切换角色。当然你也完全可以自己写一个道具，或[自定义快捷键](#自定义快捷键)来进行绑定。
|
||||
3. 将下述代码直接贴入脚本编辑 - 插件编写中。
|
||||
``` js
|
||||
// 所有需要保存的内容；这些保存的内容不会多角色共用，在切换时会进行恢复。
|
||||
// 你也可以自行新增或删除，比如不共用金币则可以加上"money"的初始化，不共用道具则可以加上"items"的初始化，
|
||||
// 多角色共用hp的话则删除hp，等等。总之，不共用的属性都在这里进行定义就好。
|
||||
var hero1 = { // 1号勇士（默认的是0号）
|
||||
"floorId": "MT0", // 该角色楼层ID
|
||||
"icon": "hero1.png", // 角色的行走图名称
|
||||
"name": "1号角色",
|
||||
"lv": 1,
|
||||
"hp": 1000,
|
||||
"atk": 10,
|
||||
"def": 10,
|
||||
"mdef": 0,
|
||||
"loc": {"x": 0, "y": 0, "direction": "up"},
|
||||
// 如果道具不共用就将下面这句话取消注释
|
||||
// "items": {"keys":{"yellowKey":0,"blueKey":0,"redKey":0},"tools":{},"constants":{}}
|
||||
}
|
||||
// 也可以类似新增其他勇士
|
||||
// var hero2 = { ...
|
||||
|
||||
var heroCount = 2; // 包含默认的在内总共多少个勇士，该值需手动修改。
|
||||
|
||||
// 初始化该勇士
|
||||
this.initHeros = function () {
|
||||
core.status.hero.icon = "hero.png";
|
||||
core.setFlag("hero1", core.clone(hero1)); // 将属性值存到变量中
|
||||
// core.setFlag("hero2", core.clone(hero2)); // 更多的勇士...
|
||||
}
|
||||
|
||||
// 切换勇士
|
||||
this.changeHero = function (toHeroId) {
|
||||
var currHeroId = core.getFlag("heroId", 0); // 获得当前角色ID
|
||||
if (!core.isset(toHeroId)) {
|
||||
toHeroId = (currHeroId+1)%heroCount;
|
||||
}
|
||||
if (currHeroId == toHeroId) return;
|
||||
|
||||
var saveList = Object.keys(hero1);
|
||||
|
||||
// 保存当前内容
|
||||
var toSave = {};
|
||||
saveList.forEach(function(name) {
|
||||
if (name=='floorId') toSave[name] = core.status.floorId; // 楼层单独设置
|
||||
else toSave[name] = core.clone(core.status.hero[name]); // 使用core.clone()来创建新对象
|
||||
})
|
||||
|
||||
core.setFlag("hero"+currHeroId, toSave); // 将当前角色信息进行保存
|
||||
var data = core.getFlag("hero"+toHeroId); // 获得要切换的角色保存内容
|
||||
|
||||
// 设置角色的属性值
|
||||
saveList.forEach(function(name) {
|
||||
if (name != 'floorId')
|
||||
core.status.hero[name] = core.clone(data[name]);
|
||||
})
|
||||
|
||||
// 插入事件：改变角色行走图并进行楼层切换
|
||||
core.insertAction([
|
||||
{"type": "setHeroIcon", "name": data.icon||"hero.png"}, // 改变行走图
|
||||
{"type": "changeFloor", "floorId": data.floorId, "loc": [data.loc.x, data.loc.y],
|
||||
"direction": data.loc.direction, "time": 0} // 楼层切换事件
|
||||
])
|
||||
core.setFlag("heroId", toHeroId); // 保存切换到的角色ID
|
||||
}
|
||||
```
|
||||
3. 在脚本编辑 - setInitData中加上`core.plugin.initHeros()`来初始化新勇士。（写在`core.events.afterLoadData()`后，反大括号之前。）
|
||||
4. 如果需要切换角色（包括事件、道具或者快捷键等），可以直接调用自定义JS脚本：`core.plugin.changeHero();`进行切换。也可以指定参数调用`core.plugin.changeHero(1)`来切换到某个具体的勇士上。
|
||||
|
||||
## 系统使用的flag变量
|
||||
|
||||
众所周知，自定义flag变量都可以任意定义并取用（未定义直接取用的flag默认值为0）。
|
||||
|
||||
下面是一些可能会被系统设置或取用的flag变量：
|
||||
|
||||
- **`flag:hard`**: 当前的难度标志；此flag变量在setInitData中被定义，可以直接取用来判定当前难度分歧。上传成绩时将根据此flag来对不同难度进行排序。
|
||||
- **`flag:posion`**, **`flag:weak`**, **`flag:curse`**: 中毒、衰弱、诅咒状态。
|
||||
- **`flag:no_zone`**, **`flag:no_snipe`**, **`flag:no_laser`**, **`flag:no_betweenAttack`**: 是否分别免疫领域、阻击、激光、夹击效果。
|
||||
- **`flag:hatred`**: 当前的仇恨数值。
|
||||
- **`flag:commonTimes`**: 全局商店共用次数时的访问次数。
|
||||
- **`flag:input`**: 接受用户输入的事件后，存放用户输入的结果。
|
||||
- **`flag:type`**, **`flag:keycode`**, **`flag:x`**, **`flag:y`**, **`flag:px`**, **`flag:py`**: 等待用户操作后，用户的操作类型，按键keycode或点击/像素坐标。
|
||||
- **`flag:skill`**, **`flag:skillName`**: 开启的技能编号和技能名。
|
||||
- **`flag:heroIcon`**: 当前的勇士行走图名称。
|
||||
- **`flag:saveEquips`**: 快速换装时保存的套装。
|
||||
- **`flag:__visited__`**: 当前访问过的楼层。
|
||||
- **`flag:equip_atk_buff`**, **`flag:equip_def_buff`**, **`flag:equip_mdef_buff`**: 当前攻防魔防的实际计算比例加成。
|
||||
- **`flag:__color__`**, **`flag:__weather__`**, **`flag:__volume__`**: 当前的画面色调、天气和音量。
|
||||
- **`flag:__events__`**: 当前保存的事件列表，读档时会恢复（适用于在事件中存档）
|
||||
- **`flag:textAttribute`**, **`flag:globalAttribute`**, **`flag:globalFlags`**: 当前的剧情文本属性，当前的全局属性，当前的全局开关。
|
||||
- **`flag:cannotMoveDirectly`**, **`flag:clickMove`**: 当前是否不允许瞬间移动，当前用户是否开启了单击瞬移。
|
||||
- **`flag:hideStatusBar`**, **`flag:showToolbox`**: 是否隐藏状态栏，是否显示工具栏。
|
||||
- **`flag:debug`**, **`flag:consoleOpened`**: 当前是否开启了调试模式，是否开启了控制台。
|
||||
- **`flag:__seed__`**, **`flag:__rand__`**: 伪随机数生成种子和当前的状态
|
||||
|
||||
==========================================================================================
|
||||
|
||||
[继续阅读附录：所有API列表](api)
|
||||
+268
@@ -0,0 +1,268 @@
|
||||
# 快速上手
|
||||
|
||||
?> 目前版本**v2.5.4**，上次更新时间：* {docsify-updated} *
|
||||
|
||||
在这一节中，将详细介绍做一部塔的流程。现在，让我们来做一部单层塔！
|
||||
|
||||
## 前置需求
|
||||
|
||||
你需要有满足如下条件才能进行制作：
|
||||
|
||||
- Windows 8以上操作系统；Windows 7需要安装.Net Framework 4.0。（能打开同目录下的“启动服务.exe”即可）
|
||||
- Mac系统则需OS X 10.7及以上，能正确打开启动服务(Mac版).app即可。
|
||||
- 安卓手机端需要下载最新版的HTML5安卓造塔器。
|
||||
- Chrome浏览器。其他浏览器可能会导致本地服务器产生闪退等现象。
|
||||
- 强烈推荐安装一个很好的文本编辑器：VSCode。在某些需要直接修改文件的场合，可能会非常重要。
|
||||
|
||||
上述软件均可以在群文件的常用软件中找到下载安装包。
|
||||
|
||||
只要满足了上述条件，你就可以开始做自己的塔啦！
|
||||
|
||||
## 启动HTTP服务
|
||||
|
||||
在根目录下有一个“启动服务.exe”，运行之。（Mac版本则双击运行“启动服务(Mac版).app”，手机端则使用造塔APP。）
|
||||
|
||||
|
||||
|
||||
* “启动游戏”按钮将打开一个网页，你能在里面看到现在游戏的效果。
|
||||
* “地图编辑器”允许你以可视化的方式进行编辑地图。
|
||||
* “便捷PS工具”能让你很方便的对自定义素材进行添加。参见[自定义素材](personalization#自定义素材)。
|
||||
* “地图生成器”能让你从已有的截图（如RMXP项目）中立刻生成可被本样板识别的地图数据。
|
||||
* “RM动画导出器”能让你从RMXP中导出动画而被H5魔塔使用。
|
||||
* “JS代码压缩工具”能对JS代码进行压缩，从而减少IO请求数和文件大小。
|
||||
* “伤害和临界值计算器”是一个很便捷的小工具，能对怪物的伤害和临界值进行计算。
|
||||
|
||||
!> **整个造塔过程中，启动服务必须全程处于开启状态！切不可手滑关闭，否则做的都是无用功！**
|
||||
|
||||
## 绘制地图
|
||||
|
||||
有两种绘制地图的方式：从头绘制地图；从RMXP中导入已有的地图。
|
||||
|
||||
### 从头绘制地图
|
||||
|
||||
我们直接打开“地图编辑器”，可以看到一个可视化的UI界面。
|
||||
|
||||
楼层切换到MT0层，然后可以开始任意绘制地图。
|
||||
|
||||
|
||||
|
||||
如果提示“该素材未被定义”或有红色问号框，请参见[素材注册](#素材注册)。
|
||||
|
||||
绘制地图时可以右键弹出菜单，移动图块和事件。
|
||||
|
||||
从V2.4.2开始，可以使用`Alt+0~9`对一个图块素材快速保存，`Ctrl+0~9`来快速选用。
|
||||
|
||||
### 从RMXP导入已有的地图
|
||||
|
||||
如果我们想复刻一个现有的，已经被RMXP所制作的塔，也有很便捷的方式，那就是用到我们的“地图生成器”。
|
||||
|
||||
首先，我们打开RMXP和对应的项目，可以看到它的地图。
|
||||
|
||||
|
||||
|
||||
我们打开地图编辑器，创建一个地图，宽高需要和RM中的地图一致。
|
||||
|
||||
之后，我们打开Windows自带的“截图工具”，并将整个地图有效区域截图下来，并将其复制到剪切板。
|
||||
|
||||
|
||||
|
||||
截图时请注意：**只截取有效游戏空间内数据，并且有效空间内的范围必须是创建的地图的大小（至少为13x13）。**
|
||||
|
||||
确认地图的图片文件已经复制到剪切板后，我们打开“地图生成器”，并点“加载图片”。大约1-2秒后，可以得到地图的数据。
|
||||
|
||||
|
||||
|
||||
然后点击“复制地图”，即可将地图数据复制到剪切板，然后再地图编辑器中切换到“地图编辑”，并在左边的框进行粘贴。
|
||||
|
||||
!> **地图生成器默认只支持已被定义的素材。如果有自定义素材需求（例如原版的1层小塔那种素材），请先[导入并注册素材](#素材注册)后再进行操作。**
|
||||
|
||||
!> **请确保截图范围为你创建的地图大小，并且保证每个位置的像素都是32x32。**
|
||||
|
||||
!> **如果宽度超过13，地图生成器将无法显示完全，但是仍然可以粘贴到地图编辑器中进行修改。**
|
||||
|
||||
!> **地图生成器靠左上角来确定偏移量，如果左上角是全黑或者星空之类的素材可能导致识别不准，此时请在左上角放置一个岩浆后再进行截图识别。**
|
||||
|
||||
|
||||
|
||||
## 编辑属性
|
||||
|
||||
当地图绘制完毕后，我们可能需要进行属性的编辑。属性编辑有四类：楼层属性、怪物属性、道具属性、全塔属性。
|
||||
|
||||
### 楼层属性
|
||||
|
||||
我们切换到楼层属性，并进行一项项的编辑。将鼠标放在中间有具体的每一项注释，这里不再细说。
|
||||
|
||||
|
||||
|
||||
### 怪物属性
|
||||
|
||||
我们点击右边的怪物图块，可以在左边的框内设置该怪物的各项属性。将鼠标放在中间有具体的每一项注释，这里不再细说。
|
||||
|
||||
有关怪物的更详细信息可参见[元件说明：怪物](element#怪物)。
|
||||
|
||||
|
||||
|
||||
### 道具属性
|
||||
|
||||
同理，点击道具可以对道具属性进行编辑。
|
||||
|
||||
目前大多数道具都已有默认效果。更多信息可参见[元件说明：道具](element#道具)。
|
||||
|
||||
### 全塔属性
|
||||
|
||||
我们切换到全塔属性，并进行一项项的编辑。同样鼠标放在中间可以查看注释。
|
||||
|
||||
我们可以在这里定义一些全局的属性，比如开始剧情、宝石血瓶剑盾数值，破甲反击净化的比例，以及一些系统开关比如是否启用加点，是否允许负伤害等等。
|
||||
|
||||
!> **注：name作为游戏的唯一标识符必须进行修改，否则可能会导致存档等出现问题。**
|
||||
|
||||
|
||||
|
||||
上述属性全部修改完毕后，保存，然后点启动服务的“开始游戏”，就可以看到我们写的游戏效果啦！
|
||||
|
||||
## 新建和删除楼层
|
||||
|
||||
如果要新建楼层，请切换到“地图编辑”，输入新的楼层ID，并新建空白地图，然后刷新编辑器。
|
||||
|
||||
请注意，楼层ID必须是由字母、数字和下划线组成且不能以数字开头，不能和任何已有的楼层ID重复。
|
||||
|
||||
你也可以删除当前楼层（比如几个样板层），只需要点击删除楼层再刷新就行。删除楼层并不会删除文件，只是不再被游戏所引入而已。
|
||||
|
||||
你可以在全塔属性 - floorIds中看到所有的楼层。其顺序将影响到楼传器的顺序、浏览地图的顺序和上下楼器等的顺序。
|
||||
|
||||
## 事件编辑
|
||||
|
||||
我们点击任意一个图块，都可以进入事件编辑模式。
|
||||
|
||||
|
||||
|
||||
从上至下有若干项，分别代表该点的一些事件。有关事件的详细信息请参见[事件](event)。
|
||||
|
||||
如果一个点存在事件，则在地图编辑器中该点的左下角会有一个小方框表示。
|
||||
|
||||
红色为自定义事件，绿色为楼层传送事件，黄色为战后事件，青色为道具获得后的事件，粉色为开门后的事件。
|
||||
|
||||
## 自定义素材的添加与注册
|
||||
|
||||
有关素材的更多详细信息，包括素材的机制等内容，请参见[自定义素材](personalization#自定义素材)。
|
||||
|
||||
这里只对如何导入（新增）素材以及注册素材进行简要介绍。
|
||||
|
||||
### 新素材的添加
|
||||
|
||||
如果我们需要新增加一些素材，比如样板中没有的怪物等。
|
||||
|
||||
我们可以从启动服务打开编辑PS工具，然后选择对应的图片进行添加。
|
||||
|
||||
|
||||
|
||||
在左边选择你要导入到的位置，比如怪物就是enemy.png，道具就是items.png等等，再在右边导入你的新素材图片。
|
||||
|
||||
之后就可以简单的使用Ctrl+C和Ctrl+V来复制粘贴了。
|
||||
|
||||
保存后，刷新地图编辑器即可生效。
|
||||
|
||||
### 素材注册
|
||||
|
||||
当我们使用新素材后，可能会出现素材不存在的情况，此时绘图时会存在红色问号方框。
|
||||
|
||||
|
||||
|
||||
出现这种情况，是因为我们没有将该素材定义到游戏中，也无法进行使用。
|
||||
|
||||
要解决这个问题，只需要在左边的图块属性中定义新的图块ID和图块数字即可。ID必须由数字字母下划线组成，数字在1000以内，且均不能和已有的进行重复。
|
||||
|
||||
有关图块的ID和数字定义请参见[素材的机制](personalization#素材的机制)。
|
||||
|
||||
之后刷新编辑器即可。
|
||||
|
||||
对于怪物和道具，我们也可以进行自动注册，只需要点击“自动注册”按钮，将对该栏下所有未注册的素材进行自动注册（自动分配ID和数字）。
|
||||
|
||||
素材注册完毕后，即可在游戏中正常使用，也可以被地图生成器所识别（需要重开地图生成器）。
|
||||
|
||||
### 额外素材
|
||||
|
||||
从2.4.2开始，H5魔塔样板支持额外素材，你可以导入任意个类似RM中的tilesets文件，且无需注册即可使用。
|
||||
|
||||
要使用额外素材，请在`全塔属性`中的`tilesets`项，添加额外素材的图片名称，刷新后即可在地图编辑器中使用。
|
||||
|
||||
额外素材不可注册，其数字、ID和索引都是和该图块在图片上的位置相关，不可编辑。
|
||||
|
||||
有关额外素材的更多说明参见[额外素材](personalization#额外素材)
|
||||
|
||||
## 控制台调试
|
||||
|
||||
HTML5的塔都是可以进行控制台调试的。
|
||||
|
||||
当我们使用Chrome进入游戏后，可以按 `Ctrl+Shift+I` ，并找到 `Console` 控制台。
|
||||
|
||||
|
||||
|
||||
在控制台中，我们可以输入一些命令对游戏进行调试，常见的命令有：
|
||||
|
||||
- `core.status.floorId` 获得当前层的floorId。
|
||||
- `core.status.thisMap` 获得当前地图信息。例如`core.status.thisMap.blocks`可以获得当前层所有图块。
|
||||
- `core.floors` 获得所有剧本的信息。例如`core.floors[core.status.floorId].events`可以获得当前层所有事件。
|
||||
- `core.status.hero` 获得当前勇士状态信息。例如`core.status.hero.atk`就是当前勇士的攻击力数值。
|
||||
- `core.material.enemys` 获得所有怪物信息。例如`core.material.enemys.greenSlime`就是获得绿色史莱姆的属性数据。
|
||||
- `core.material.items` 获得所有道具的信息。例如`core.material.items.pickaxe`就是获得破墙镐的信息。
|
||||
- `core.debug()` 开启调试模式；此模式下可以按住Ctrl键进行穿墙。
|
||||
- `core.updateStatusBar()` 立刻更新状态栏和地图显伤。
|
||||
- `core.setStatus('atk', 1000)` 直接设置勇士的某项属性。本句等价于 `core.status.hero.atk = 1000`。
|
||||
- `core.getStatus('atk')` 返回勇士当前某项属性数值。本句等价于 `core.status.hero.atk`。
|
||||
- `core.setItem('pickaxe', 10)` 直接设置勇士某个道具的个数。这里可以需要写道具的ID。
|
||||
- `core.getItem('pickaxe', 2)` 令勇士获得两个破墙镐。
|
||||
- `core.itemCount('pickaxe')` 返回勇士某个道具的个数。
|
||||
- `core.hasItem('pickaxe')` 返回勇士是否拥有某个道具。等价于`core.itemCount('pickaxe')!=0`。
|
||||
- `core.getEquip(0)` 返回0号装备类型（武器）的当前装备的itemId，不存在则返回null
|
||||
- `core.hasEquip('sword1')` 返回某个装备当前是否处于被装备状态
|
||||
- `core.setFlag('xxx', 1)` 设置某个flag/自定义变量的值。
|
||||
- `core.getFlag('xxx', 10)` 获得某个flag/自定义变量的值；如果该项不存在（未被定义），则返回第二个参数的值。
|
||||
- `core.hasFlag('xxx')` 返回是否存在某个变量且不为0。等价于`core.getFlag('xxx', 0)!=0`。
|
||||
- `core.removeFlag('xxx')` 删除某个flag/自定义变量
|
||||
- `core.insertAction(list)` 执行一段自定义事件。比如 `core.insertAction(["剧情文本"])` 将执行一个剧情文本显示事件。
|
||||
- `core.changeFloor('MT2', 'downFloor')` 立刻执行楼层切换到MT2层的下楼点位置。
|
||||
- `core.changeFloor('MT5', null, {'x': 4, 'y': 7})` 立刻切换楼层到MT5层的(4,7)点。
|
||||
- `core.getBlock(3, 5, 'MT1')` 获得当前地图上某一个块的信息。第三个参数为floorId，可省略表示当前楼层。
|
||||
- `core.getBlockId(3, 5, 'MT1')` 获得当前地图上某一个点的图块ID。第三个参数为floorId，可省略表示当前楼层。
|
||||
- `core.resetMap()` 重置当前层地图。**当修改地图后再读档，修改的地图不会立刻生效，此时可以使用resetMap来重置当前楼层的地图。**
|
||||
- ……
|
||||
|
||||
更多API和详细参数介绍可参见[API列表](api)。
|
||||
|
||||
|
||||
## 报错处理
|
||||
|
||||
有时候刷新后可能地图编辑器页面变成空白，即无法正确加载，游戏也无法正常进入。
|
||||
|
||||
出现这种问题的原因往往是如下几种：
|
||||
- 手动直接打开并错误编辑了文件
|
||||
- 文件不存在（被误删等）
|
||||
- 楼层floorId不合法（必须是字母数字下划线组成，且不能以数字开头）
|
||||
- 楼层floorId定义存在重复（比如定义了两个MT0层）
|
||||
- 初始楼层ID不存在（比如修改了全塔属性中的初始楼层ID，但是实际的该ID不存在，也会出错）
|
||||
- ……（可能各种奇怪的报错问题）
|
||||
|
||||
出现这种问题，（在Chrome浏览器中）请按Ctrl+Shift+I打开控制台，并找到Console查看报错。
|
||||
|
||||
一般都会具体到哪个楼层文件出错。
|
||||
|
||||
解决方式：哪个楼层文件出错，请使用VSCode等打开project目录下的data.js文件，并将出错的那个楼层定义删除。
|
||||
|
||||
例如下面这个问题：
|
||||
|
||||
|
||||
|
||||
那么使用VSCode打开data.js文件，并将 "floorIds": [..., "MT1"] 这里对它的楼层定义删除，再刷新即可。
|
||||
|
||||
|
||||
|
||||
请注意，手动删除楼层时一定要确保“初始楼层ID”是一个有效且存在的floorId！
|
||||
|
||||
|
||||
|
||||
如有任何无法解决的问题，欢迎加群**539113091**寻求帮助。
|
||||
|
||||
==========================================================================================
|
||||
|
||||
[继续阅读下一章：元件说明](element)
|
||||
Reference in new issue
Block a user