【微信小游戏实战】零基础制作《欢乐停车场》二、关卡设计

1、游戏立项

微信小游戏中有一款《欢乐停车场Plus》的小游戏，大家可以搜索玩下。这是一款益智类的小游戏，游戏中有红、黄、绿、蓝、紫5辆豪车6个停车位，玩家通过可行走路线移动小车，最终让各颜色的小车停到对应的颜色车位，则完成本关挑战。接下来的日子，我将同大家一步一步的来实现这款小游戏，从零基础入门微信小游戏的开发和发布。

2、本篇内容

CocosCreator零基础制作《欢乐停车场Plus》微信小游戏  二、关卡设计

3、文章检索

1）、【微信小游戏实战】零基础制作《欢乐停车场》一、游戏设计

2）、【微信小游戏实战】零基础制作《欢乐停车场》二、关卡设计

3）、【微信小游戏实战】零基础制作《欢乐停车场》三、游戏场景制作

4）、【微信小游戏实战】零基础制作《欢乐停车场》四、游戏关卡脚本实现

5）、【微信小游戏实战】零基础制作《欢乐停车场》五、游戏玩法脚本实现

6）、【微信小游戏实战】零基础制作《欢乐停车场》六、游戏结束

7）、【微信小游戏实战】零基础制作《欢乐停车场》七、游戏发布

4、游戏实战

关卡设计的重点，就是分析游戏中的展现，通过合理的数据来展示对应的操作。

这句话怎么理解呢？我们先分析游戏中的展现，先观察下面2张图：

   

通过观察，我们可以发现以下几点：

1）、车位：车位是不变的，构成了一个六边形的形状，从下往上，从左到右。依次是空、蓝、红、黄、绿、紫。同时也告诉我们车的颜色也固定了。

2）、道路：道路的连线是跟随关卡变化而变化的。

3）、车位置：车的初始位置也是随着关卡的变化而变化的。如：第一关红车的位置位于左下角，而第二关红车的位置位于六边形的最上面。

 这些变化的内容，就需要我们通过数据表示出来，同时对这些数据来做一些操作。如点击小车，小车移动了，位置会改变，原来空车位的位置会改变，这就需要操作我们的数据了。这就是关卡设计的重点。

根据上面的几点，我们可以这样设计数据：

1）、车位：从下往上，从左到右，我们依次用数字 0代表空车位；1代表蓝车位；2代表红车位；3代表黄车位；4代表绿车位；5代表紫车位；车跟车位颜色是对应的，那我们同时也能表示我们的豪车了，每个豪车也有编号了。^_^

2）、道路：道路的连线，我们可以通过车位连线来表示这条道路。如：第一关空白车位和蓝色车位之间的这条道路，我们可以表示为[0,1]，这样就可以准确的表示，0位置和1位置之间有一条道路。

3）、车的位置：车的颜色(也可认为是编号)有了，车位的编号有了，那就可以准确的表示了。如第一关红车，我们可以表示为"红车在位置为1"=>[2,1]（能想到这我们就离真相不远了），这样表示就有个问题5辆车，5个数组，有点复杂，其实我们可以用一个数组来表示出当前关车的位置。

理解了上面的设计数据，我们就可以构造出这两关的数据：

1）、第一关

 "level1":[
        [
            [0,1,1],[0,3,1],[0,5,1],
            [1,2,1],[1,4,2],
            [2,3,1],[2,5,3],
            [3,4,1],
            [4,5,1]
        ],
        [0,2,3,5,1,4]
    ],

2）、第二关

"level2":[
        [
            [0,1,1],[0,2,1],[0,4,1],[0,5,1],
            [1,5,2],
            [2,3,1],
            [3,4,1]
        ],
        [0,5,4,2,3,1]
    ],

数据剖析：

每一关可以认为是一个二维组数，

1）、数组的第0个元素是所有的道路的连线，每条连线又是一个数组，如：第二关的第一条路线，可以表示为：level2[0][0] = [0,1,1]；

[0,1,1]表示什么意思呢？第0和第1个车位之间有一条路线，这条路线的zInde(显示层级)是1。

2）、二维数数组的第1个元素是所有的车所在的位置，如：第二关的车位置可以表示为[0,5,4,2,3,1]；

[0,5,4,2,3,1]表示什么意思呢？ 【第0车位是空，第1车位是紫车，第2车位是绿车，第3车位是红车，第4车位是黄车，第5车位是蓝色】。

5、游戏总结

1）、如有问题，欢迎留言，加QQ群交流。QQ群： 1群：418177552（已满）  2群：858799494

2）、数据我们已经构造出来了，下一篇我们一起实现，游戏场景界面的布局。