Wednesday, October 8, 2014

Example Construct 2 game (html5)

Introduction

I received some questions concerning my previous blog post on Construct 2 if-statement. Therefore I decided to put the project file (.capx) available to everyone who needs it. This game is very simple one, but I think it is just suitable for getting familiar with the tool.

Load Construct 2 capx file for "shootTheBox" game.

The HTML5 version of game can be found from our server.


shootTheBox.capx file usage

You will need Construct 2 for opening this file. Free version can be downloaded from https://www.scirra.com/.

.capx file can be opened by double-clicking it, or alternatively from C2 menu (file -> open).


shootTheBox game events

Since this is a simple game with just one layout, there is only one event page too. The screenshot is attached below. I added some comments to describe what each event block is supposed to do.

shootTheBox in Construct 2 event editor (with comments added)
















There are handful of global variables in this game. One of them is the "gameState" variable, that holds the information whether the game is in "init" or "run" mode. In "init" mode game is not running and "Click to Start" text is visible.

When mouse is clicked (or screen touched) game state changes to "run", and game starts to spawn coins and boxes on every second. The starting location of coins and boxes are defined by using random() function. Box color selection structure is explained in detail here.

If mouse cursor is over a box and it is clicked, the box is destroyed and Score counter is increased by 10 points.

If coin hits a box, the coin is destroyed and Lives counter is decreased by 1. When lives run out (<=0) game ends and state is changed to "init".

The values of score and lives counters are updated to HUD on every tick (about 60 times per second).

There are certain behaviors attached on box and coin objects, e.g. bullet, destroy outside layout, sine, etc. The parameters can be tuned by selecting the object and then using the panel on left hand side of the screen. 

That's it. I am sure I missed something, but please have a look to the contents of .capx file, make your own modifications, and try how the game works with them.

-Jussi

No comments:

Post a Comment