Action adventure tutorial part 4: Make an enemy

Hi there everyone, it's been a while since I last wrote a tutorial here. Well, I was on a vacation after Eid so I can't write anything. But now I'm back and we can continue the tutorial! Last time we added attacking animations to our hero, now let's give something for our hero to attack.

Go to our browserquest-images -> img -> 2 folder, and we'll pick an enemy from there. For now, let's use a rat as an enemy because it looks like it's easy to kill and fits for our first encounter. So, open our project again if you haven't already and insert a new Sprite object called "rat". We'll use the rat.png file from the folder we just opened, import the frames from sprite strip like we usually do. For this spritesheet there are 6 horizontal cells, and 10 vertical cells.

After you split it correctly you'll get a few animations divided like this:

• Idle / default animation: one frame, the first frame on first row
• Destroyed animation:  three frames, starting from second frame on first row
• Attack right / left animation: five frames, second row
• Walk right / left animation: four frames, one from second row and three from the third row
• Sniffing right / left animation: two frames, fourth row
• Attacking up animation: four frames, fifth row
• Walking up animation: four frames, sixth row
• Sniffing up animation: four animations, seventh row
• Attacking down animation: four frames, eight row
• Walking down animation: four frames, ninth row
• Sniffing down animation: four frames, tenth row

add the animations of the rat object like I laid out above, and you'll get the animations like these:

Enemy's animations

Some of these will be looped (like walking animations), while some aren't, and probably they'll have different speed. So for each of these animations, apply these changes to their properties:

• Default animation: speed 5, no loop
• Destroyed animation: speed 9, no loop
• AttackRight animation: speed 15, no loop
• WalkRight animation: speed 15, loop
• SniffingRight animation: speed 5, no loop, repeat count 3
• AttackUp animation: speed 12, no loop
• WalkUp animation: speed 12, loop
• SniffUp animation: speed 4, no loop, repeat count 3
• AttackDown animation: speed 12, no loop
• WalkDown animation: speed 12, loop
• SniffDown animation: speed 4, no loop, repeat count 3

and we're done with the animations, next up we'll move our rat around. We can move it by using 8 Direction behavior like our character, we just move it using code instead of default keyboard control. Also remember that we only have animation for moving in four directions, so we have to write the code to make sure our rat doesn't move diagonally.

Add the 8 Direction behavior to the rat,and change both the "Set angle" and "Default controls" to no. Then we'll switch to the event sheet, before we move the rat it must first make a random decision about where to go: is it to go left, up, right, or down? Construct 2 has an expression to randomly select a set of options, called "choose". For now add a new event to compare the rat's playing animation, if it's the Default animation then we'll start randomly choosing a direction.



Before I continue, I need to explain a bit about variables. Variables are containers for values that can be accessed later, this is useful if we want to "remember" something to be used later on. Construct 2 knows two kinds of variables: global variables, and instance variables. Global variables are variables that are known throughout the project and the values are the same for a variable. Instance variables are variables that are "stuck" to objects, and the values can be different for each instance of objects.

For now let me explain about global variables, to make a global variable right click on the event sheet and select "add global variable" (or you can press "v" on the keyboard for shortcut). After that you'll see a box with several textboxes, these are what make a variable.

The Name textbox is of course the name of your variable, the name must be unique which means no two variables can have the same name. Type determines whether the variable is a text or just a number, this is important because text can't perform mathematical methods (you can't add or subtract or multiply a text) and a number can't store letters. Initial value is the first value this variable will have when the game starts, it can be important if your game expects something other than zero. And the description is optional, just in case you can't tell what a variable does by its name, you can explain it here.

New global variable

Close the global variable box because we're moving on to the instance variable. An instance variable is unique per object in the game, let's say we want to make the enemies have health which can be depleted when attacked, we can add a health instance variable to the enemies. Let's assume we have 5 enemy objects in the game, Construct calls each of these objects "instance" (there's the first instance, second instance, third instance, and so on), and each instance will have their own health. So we can make only the enemy instance that have its health down to 0 that are dead, and we play its dead animation.

To make an instance variable, click on an object and look at the properties bar, there would be an add / edit instance variables link. For example, click on the rat object and look at the properties bar.

Adding instance variables

If you click on it, you'll see the box that lists all instance variables this object has. By default the box is empty but if you click on the "+" icon, it will show the box to add a new instance variable. It is very similar to the box to add a new global variable so you should be familiar with it.

For now add an instance variable to the rat and name it "direction" with a "text" type, we'll use it to remember which direction the rat needs to go to. Pressing the "OK" button will create the instance variable, and you can see it in the instance variables box. Close the instance variables box and look at the event sheet.

On the event that checks rat's "default" playing animation add a new action, double click on the rat object and then scroll down until you see the "instance variable" section,and then double click on "set value". This action changes the value of an instance variable, because we only have one instance variable, we can only modify the "direction" variable from the dropdown list. On the value text box, type "choose" (without the quotes) as you type you'll see the expressions of Construct 2, they have many uses so I recommend you to read the documentation to know more.

After that type "(" (without the quotes) to start filling the expression, type "up", "down", "left", "right" (now with quotes) divided by commas. The commas serve to divide each selection up, and after we're done, type ")" (without the quotes) to close the expression. You'll get an event that looks like this

Choosing a direction randomly

Now that we have randomly selected a direction we need to move there. Create a new event that checks the rat's direction by double clicking on the rat and then "Compare instance variable", and check if the value of "direction" is "up". For the action we'll do two things, first is to change the animation according to the direction we go to, and second is to simulate the 8 Direction control.

To simulate the 8 Direction control, double click on the rat and then select "Simulate control" from the 8 Direction section, and then select which direction you want to simulate from the dropdown list. Your event sheet will look like this.

Simulate 8 Direction

Run the game now, and you'll notice the rat will walk to the direction it has randomly chosen. One thing is strange, it doesn't change direction and just walks off the screen. This is something we don't want (at least I don't want it) so we need to limit the movement, or do something that will make the rat change direction.

Why don't we do the second option. Let's add a new behavior to the rat: Timer behavior. The timer behavior will "set off" or "trigger" on the time that we set, we'll use this to make the rat change animation and direction. First, add the timer behavior to the rat, you can find it under the general section when you add a behavior. And then we'll switch to the event sheet again.

We're going to use this timer right after we randomly change the rat's direction, so add a new action under the "set direction" action. Double click on the rat, and select "Start timer". You'll see a box with three parameters. The duration is the time in seconds we want the timer to trigger, the type determines whether this is a one time timer or repeated, and the tag is a text we use to identify the timer. For now change the duration to 0.5, the type set to once, and the tag to "change direction".

Start timer

Now we need to be ready for when the timer triggers. Create a new event, double click on rat and then "On timer", fill the tag with the tag of the timer we want, which in this case is "change direction". What we want to do when the timer trigger is to stop the 8 Direction, change the animation to sniffing animation, and then randomly selects a new direction. The event will look like this

Finishing events

Can you create those new events on your own? Oh, to make a blank sub-event like event number 26, you can right click on an event and select Add -> blank sub-event, or press "b" key for shortcut. Run your game now and you'll see that the rat is moving around like what we want. If you want to see more rats on screen, you can just copy that object to create new instances. To do that just select the object and do a combination of ctrl+c and ctrl+v, after that click your mouse on where you want the new instance to be placed. Or you can just hold ctrl and then drag-drop an instance on the layout, that's simpler and I prefer it.

Adding a blank sub-event

I thought I promised you I'll add an enemy to slash, but we haven't got to the slashing code and I already explained quite a lot. I think I'll have to postpone it for later, I also need to think of a less wordy way of explaining things so I can explain something as clear but more concise. What do you think? Do you guys want a shorter explanation or just like the way it is?

As always, if you want to see the source code for this chapter you can download it from my Drive. If you like what you read please consider supporting my Patreon, thanks. 'Till next time!