基于引擎开发HTML5游戏实战（四）---组织游戏逻辑

STEP5 添加行为和事件

这个部分是导演游戏故事情节，也是最复杂的一部分，construct2通过behavior和event sheet来设计游戏逻辑。

添加行为

1）首先是添加英雄的行为：

• 各个方向的移动
• 屏幕随着英雄的移动而移动
• 英雄不能越过屏幕背景的边境

单击英雄-> 在properties面板上edit behavior->添加以上三个行为：

2）然后添加怪物的行为：

• 怪物可以直线移动

点击Objects面板里的怪物，这时所有的怪物都是选中状态->在properties面板上edit behavior->添加行为：

并设置speed为80

3）添加子弹的直线移动，并设置speed为600

4）添加爆炸的Fade行为，使其可以渐变消失，并设置其Effect为Addtive

添加事件

所有事件都是在Event sheet里编辑：

它的模式是：

Conditions, actions and sub-events

也就是在什么条件下采取什么行动，并会伴随什么样的事件

那么我们先考虑一下到底有哪些逻辑和效果：

• 键盘控制英雄移动，鼠标控制英雄的方向
• 英雄开枪射出子弹
• 怪物朝各个方向移动，碰到背景边境返回，并向英雄方向追进
• 子弹射到怪物，怪物减血，子弹消失，怪物的血减后爆炸并消失
• 怪物碰到英雄后，英雄消失，游戏结束

下面就是在Event sheet上来编辑以上逻辑

1）键盘控制英雄移动，鼠标控制英雄的方向

2）英雄开枪射出子弹

首先设置子弹的起点：枪口

然后添加发子弹事件：

3）怪物朝各个方向移动，碰到背景边境返回，并向英雄方向追进

Condition: System -> On start of Layout
Action: Monster -> Set angle -> random(360)

Condition: Monster -> Is outside layout
Action: Monster -> Set angle toward position -> For X, Sprite.X - for Y, Sprite.Y.

4）子弹射到怪物，怪物减血，子弹消失，怪物的血减后爆炸并消失

首先设置一个variable，来初始化每个怪物5滴血

Edit variables->

然后添加一个global variable，来记分数：

     

然后添加子弹事件：

子弹碰到怪物后，怪物减血

最后添加怪物事件：

怪物的血减为0时爆炸，增加分数

5) 怪物碰到英雄后，英雄消失，游戏结束

首先添加一个text来显示游戏已结束，添加一个图层，设置这个图层Parallax为0,0，表示这个图层总是定位当前背景，并在上面添加一个text：Game Over!

然后，添加事件来控制其是否显示

游戏开始时不显示：

怪物碰到英雄时显示：

最后，把分数显示在屏幕上方：

到此为止，这款看上去还不错的小游戏就制作完了，可以直接在屏幕上方点击 来进行运行和调试，不过它会默认打开系统默认浏览器，如果不是HTML5支持的浏览器就会有问题，所以最好是把系统的默认浏览器设置为支持HTML5的