用微信小游戏制作工具制作打飞机小游戏

目录

前言

界面介绍

开发界面

项目界面

游戏制作

添加精灵

    添加事件

优化

发布游戏

---

前言

        本篇文章说明了如何用微信小游戏制作工具做一个简单的打飞机小游戏，作者水平有限，如有不当之处，欢迎批评指正。这将是一个系列文章，后续会持续更新，用来记录和分享学习制作游戏的过程。

界面介绍

        微信小游戏的制作官网是微信小游戏制作工具。该制作工具采用可视化编程:游戏制作所见即所得,快速上手、无需代码。并且其开发效率也很高:丰富的官方组件,排行榜、性能调优一键完成。除此之外，还有个性化素材、自定义组件,高级画板工具等工具供制作者充分发挥自己的创意。

开发界面

        首页点击“立即体验”后，就可进入我们的开发界面了：

        在开发界面点击“新建作品” “空项目”   “新建”后就进入我们的项目界面。

项目界面

        项目界面的整体视图如下：

        中间最显眼的那一块（高亮的那个）是游戏的编辑区域，后续添加的精灵会显示在上面。

        左侧的场景会显示游戏的场景的预览图，场景通常有开始场景游戏场景结束场景等。

        层级管理会显示该场景图片的层级，拖动可改变图片层级来改变覆盖的规则。

        资源管理器顾名思义就是管理游戏的资源，包括精灵、声音和函数，我们可在这对游戏资源进行增删改查。

        中间偏右的一大块空白是积木面板，就是事件栏，用于控制精灵实例的积木脚本，积木是与资源一一对应的。积木是可视化制作工具中承担非常重要的逻辑关联的一部分，采用事件头触发的模式竖向排列拼接积木，每个事件头被触发后才会执行内部的积木，如果是散落的积木则不会执行。

        图层属性显示了你所选中图层的详细信息。

        数据显示了游戏中用到的数据。

        如果你觉得显示的东西太多想关掉一些，那么可以点击上面的“面板”，在其中可以设置一些模块的显示与否。

游戏制作

        下面我们以微信小游戏提供的文档中的“快速上手”为基础，制作一款简单的打飞机小游戏。游戏中用到的资源都是官方提供的资源。文档链接：简介 · 小游戏创作工具 (qq.com)。

        开始制作之前，先对游戏做一个整体的规划：我们做的是简单的打飞机的游戏，玩家控制不断发射子弹的飞机去消灭不断出现的敌机，玩家可以事实看到消灭敌机的数量。玩家操控的飞机只有三条命，碰到敌机就会损失一条命，三条生命都消耗完后，游戏结束。

添加精灵

        下面开始制作。首先我们给游戏添加背景，点击“资源管理器”中的“添加素材”，然后找合适的背景，这里选择“宇宙”背景。

        导入背景后 ，为了让游戏更有动态感，可以让背景一直滚动。设置方法是点击“图层属性”中的“管理行为”，在行为中找到“循环滚动”并打开。

        打开后再打开“自然移动”选项，把“移动方向”改成竖向，并设置合适的移动速度，这里设置为10。设置完成后点击上方的“预览”按钮就可以看到我们的背景在一直滚动了。

        接下来就是给我们的游戏添加对象，作为一款打飞机的游戏，最基本的要有飞机、敌机和子弹。我们和之前添加背景一样添加飞机、子弹和敌机，添加后根据具体情况调整图像的大小并把飞机放到合适的位置：

    添加事件

        下面给我们的对象，也叫“精灵”添加事件。所有的事件都是跟对象绑定在一起的，也就是说事件是和对象强关联。一个对象可以有很多类型的事件，也可以绑定多个相同类型的事件。点击添加事件按钮，可以看到一个事件列表，我们可以用这些列表中的事件来完成我们的游戏。至于事件 的具体作用可以查看手册。

        根据我们的需要，给我们的战机添加一个可以移动的事件，事件的添加从右侧的事件栏中拖出我们需要的事件放到精灵的事件列表就可以了，添加事件时注意形状要匹配，只有符合形状的事件才可以添加进去，否则就会“漂”在外面无法显示出来，这点和搭积木很像。

        下面给子弹添加事件，这里采用不断克隆一个精灵的方式来实现战机一直发射子弹，由于采用的是不断克隆自己的方式，所以要把子弹本体移除画面外。这里的重复执行是，每一帧都会执行一次，如果不发生卡顿，每一秒执行60次。

        下面给敌机添加事件，这里采用和子弹相似的逻辑，所以也要把本体移到画布外。

        接下来是让子弹可以打爆敌机，这点可以用碰撞事件实现，当子弹和敌机发生碰撞后，把子弹和敌机的克隆体都删除。

        这样子弹就可以打中敌机了，再设置一下图层，让视觉效果更好：

        这样基本功能就实现了，下面还剩下得分、生命值和游戏的结束。可以用两个数据来表示这三个事件：用全局变量“得分”来计分，全局变量“生命值”来表示还剩几条命。子弹每和一个敌机碰撞就把得分加一，战机每和一个敌机碰撞就把生命值减一，当生命值等于0时，游戏结束。游戏结束怎么实现呢？由于我们的子弹、敌机都是在不断循环克隆，所以把他们的循环加上一个条件即可，再设置一个提示信息就可以实现游戏结束了（当然也可以再做一个结束场景，生命值为0时切换到结束场景）。

        现在右侧的数据栏添加“得分”和“生命值”两个全局变量，得分的初始值为0，生命值的初始值为3：

        再像前面一样添加分数和三个爱心，调整好大小后移到合适位置：

        把数字和得分绑定，每个爱心和生命值绑定（生命值为2为例）：

        为了让生命值减少，给敌机或战机添加碰撞事件就好，这里给敌机添加碰撞事件：

        再添加对话框，写上“游戏结束”和重新开始按钮，其中给重新开始按钮添加“重启游戏”事件，这点不难，就不截图了。下面只显示结束的实现逻辑：

对于子弹，当生命值为0时，不再克隆自己，只要在原本的克隆基础上添加一个条件判断就好（敌机也是一样的逻辑）。

        这样游戏的基本内容就做好了。

优化

        为了让游戏呈现出来的效果更好，我们可以添加BGM和音效，事件栏中咖啡色的积木是用来控制声音的，只要把声音的积木拖到合适位置并选择合适的声音就可以了，

当游戏结束时，记得停止BGM的播放：

        注意到当子弹没有碰到敌机时，子弹和敌机都会不断地飞下去。没有必要让子弹将永远从屏幕上飞走，总是占用一点内存和处理能力。所以，一旦子弹离开布局，我们应该销毁它们（敌机也是如此）。

        编辑区域的大小是1334*750的大小，并不适配所有的手机品目，所以为了让所以的手机都可以尽量好的显示出我们的游戏画面，可以点击左上方的“作品设置”调整适配模式。

发布游戏

        当一切都制作完成后，点击“预览&分享”后用手机微信扫描生成的二维码就可以在手机上试玩啦！