零基础开发RPG游戏开源讲座(四)-游戏脚本化&地图跳转-H5教程

了解上三篇的内容请点击：

html5[color=rgb(68, 68, 68) !important]游戏开发-零基础开发RPG游戏-开源讲座(一)

http://www.html5cn.org/article-1737-1.html

html5游戏开发-零基础开发RPG游戏-开源讲座(二)-跑起来吧英雄

http://www.html5cn.org/article-1738-1.html

html5游戏开发-零基础开发RPG游戏-开源讲座(三)-卷轴&对话实现

http://www.html5cn.org/article-1740-1.html


首先，本篇文章是零基础开发RPG游戏-开源讲座系列文章的第四篇，来实现游戏的脚本化，和利用游戏脚本实现地图场景的切换。如下应该是我们先了解的。

一，什么是游戏脚本

简单说，游戏脚本就是依据一定的格式编写的可执行文件，游戏可以通过脚本中自定义的语句来执行相应的逻辑。

二，为什么要将游戏脚本化

游戏脚本，可以令我们的游戏动态化，比如当我们开发了一款rpg游戏，里面的剧情，事件以及地图等，我们如果将这些全部写进程序里，当然是可以的，但是一旦出现问题，哪怕几个错别字，我们需要先将这几个错别字改正，并且将整个程序重新编译发布一遍，这个过程是相当令人反感的，因为如果游戏的程序跟着游戏的内容不断进行修改的话，那只会使你的程序越来越复杂。但是如果我们将这些可重复的数据，都定义到游戏程序之外的文件里面，当游戏引擎开发完毕，我们的游戏通过读取这些外部文件，来执行相应的剧情和事件，那么，像上述当我们的游戏出现了问题，我们只需要改动这些外部文件就可以了，并不需要重新编译整个程序，这样便使得我们的游戏开发，变得便利简洁。

*当然，对于html5来说，不需要重新编译程序，但是对于rpg的游戏来说，脚本还是必不可少的，因为游戏的剧本不可能全都写到程序里。

三，如何来实现游戏的脚本化

好了，接下来，先来考虑以什么形式来制作游戏的脚本，我们有多种选择，可以选择xml，可以选择json，也可以选择纯自定义语法，

这次，我为了省事，选用比较方便处理的json，因为javascript可以很轻松的处理json数据。

目前游戏中实现的内容有，地图场景添加，游戏人物添加，以及人物对话的实现。那么，我在设计游戏脚本的时候，必须包含这些数据，然后才能将这三项功能用脚本来控制。

首先看下面的json

1. var script = {
   
2. stage01:{
   
3. map:[
   
4. [18,18,18,18,18,18,18,18,18,18,18,18,55,55,18,18,18],
   
5. [18,18,18,17,17,17,17,17,17,17,17,17,55,55,17,17,18],
   
6. [18,18,17,17,17,17,18,18,17,17,17,17,55,55,17,17,18],
   
7. [18,17,17,17,18,18,18,18,18,17,17,55,55,17,17,17,18],
   
8. [18,17,17,18,22,23,23,23,24,18,17,55,55,17,17,17,18],
   
9. [18,17,17,18,25,28,26,79,27,18,55,55,17,17,17,17,18],
   
10. [18,17,17,17,17,10,11,12,18,18,55,55,17,17,17,17,18],
    
11. [18,18,17,17,10,16,16,16,11,55,55,17,17,17,17,17,18],
    
12. [18,18,17,17,77,16,16,16,16,21,21,17,17,17,17,17,18],
    
13. [18,18,17,17,77,16,16,16,16,55,55,17,17,17,17,17,18],
    
14. [18,18,18,18,18,18,18,18,18,55,55,18,18,18,18,18,18]],
    
15. mapdata:[
    
16. [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1],
    
17. [1,1,1,0,0,0,0,0,0,0,0,0,1,1,0,0,1],
    
18. [1,1,0,0,0,0,1,1,0,0,0,0,1,1,0,0,1],
    
19. [1,0,0,0,1,1,1,1,1,0,0,1,1,0,0,0,1],
    
20. [1,0,0,1,1,1,1,1,1,1,0,1,1,0,0,0,1],
    
21. [1,0,0,1,1,1,0,1,1,1,1,1,0,0,0,0,1],
    
22. [1,0,0,0,0,0,0,0,1,1,1,1,0,0,0,0,1],
    
23. [1,1,0,0,0,0,0,0,0,1,1,0,0,0,0,0,1],
    
24. [1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1],
    
25. [1,1,0,0,0,0,0,0,0,1,1,0,0,0,0,0,1],
    
26. [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1]],
    
27. add:[
    
28. {chara:"player",img:"mingren",x:5,y:6},
    
29. {chara:"npc",img:"npc1",x:7,y:6},
    
30. {chara:"npc",img:"npc1",x:3,y:3}],
    
31. talk:{
    
32. talk1:[
    
33. {img:"m",name:"鸣人",msg:"我是木叶村的鸣人，你是谁？"},
    
34. {img:"n",name:"黑衣忍者甲",msg:"你就是鸣人？九尾还在你身体里吗？"}
    
35. ],
    
36. talk2:[
    
37. {img:"n",name:"黑衣忍者乙",msg:"鸣人，听说忍者大战就要开始了。"},
    
38. {img:"m",name:"鸣人",msg:"真的吗？一定要想想办法啊。"}
    
39. ]
    
40. }
    
41. }
    
42. 
    
43. 
    
44. };

复制代码

我将脚本定义成了变量，实际游戏制作的时候，脚本应该储存到一个外部文档当中，在这里我只是讲解一下理论，如何完善那是后话了。

可以看到，json中，包含了地图相关的map数组和mapdata数组，添加人物的相关数据，以及对话的数组。这样，我在游戏显示的时候，只需要读入json数据，然后根据这些内容来显示游戏画面就可以了，定义一个initScript函数来进行这些操作。

1. function initScript(){
   
2. //地图位置初始化
   
3. mapLayer.x = 0;
   
4. mapLayer.y = 0;
   
5. 
   
6. 
   
7. //地图层初始化
   
8. mapLayer.removeAllChild();
   
9. //人物层初始化
   
10. charaLayer.removeAllChild();
    
11. //效果层初始化
    
12. effectLayer.removeAllChild();
    
13. //对话层初始化
    
14. talkLayer.removeAllChild();
    
15. 
    
16. //地图数据获取
    
17. map = stage.map;
    
18. mapdata = stage.mapdata;
    
19. //对话数据获取
    
20. talkScriptList = stage.talk;
    
21. 
    
22. //添加地图
    
23. addMap(0,0);
    
24. delMap();
    
25. //添加人物
    
26. addChara();
    
27. }

复制代码

removeAllChild方法是legendForHtml5Programming引擎独有的方法，可以用来移出LScript显示层上的所有子对象，从而实现本游戏中各个显示层的初始化工作。

修改一下addChara方法，如下

1. //添加人物
   
2. function addChara(){
   
3. var charaList = stage.add;
   
4. var chara,charaObj;
   
5. for(var i=0;i