Eyes of monster follow mouse cursor

1

Attached Files

The following files have been attached to this tutorial:

.capx

mouse-follower.capx

Download now 291.92 KB

Stats

4,269 visits, 6,451 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 4 Oct, 2013. Last updated 19 Feb, 2019

This tutorial was inspired by Alin's Eyes following mouse cursor tutorial in Flash AS3, where you see a cute three-eyed monster follow the mouse. We'll do the same with Construct 2!

Setup

Set, if you like, the layout and project properties to

- Layout size 500,500

- Margins 500,500

Load the following sprites and rename them accordingly.

Layer 0

Background:

Layer 1

Body:

Eye:

Mouth:

and build up the monster as seen above in the screenshot. For your convenience, here the positions you can set in the properties panel:

Body: 250, 291

Eyes: 215, 247 and 289, 247

Mouth: 252, 335

Finally, add a Mouse object.

Change the eyes' orientation towards the mouse position

Go to the event sheet and insert a new condition:

System -> Every tick

and its action

Eye -> set angle -> angle(Eye.X, Eye.Y, Mouse.X,mouse.y)

Awesome, that's it! I was so amazed by this function, not needing to think in trigonometric formulas like in Alin's tutorial with ActionScript 3.

When you run the program, you'll see that both eyes will individually move towards the mouse cursor.

Adding some movement

So the thing is, you have a monster made up of three different objects (body, eyes, mouth). Now, what if you have a game where the monster moves? You simply pin the eyes and mouth to the body.

In the Objects panel, click on Eye (all Eye-instances will be selected) and give it a Pin behavior. Do the same with the Mouth object.

Now we need to tell Construct 2 that these objects belong to the monster body object. In the Event sheet insert the following condition:

System -> On start of layout

with the actions

Eye -> Pin to object -> Pin to Body / Mode: Position only

Mouth -> Pin to object -> Pin to Body / Mode: Position only

In order to check if everything's working right, give the monster's body the Sine behavior.

Multiple monsters

Select all the monsters body parts and use CTRL-C and CTRL-V to copy and paste a new monster. You can adjust the monster's size and also this guy will follow the mouse cursor.

Homework for you

As seen in the original tutorial (linked at the top of this article), the mouse cursor has been replaced by a cookie. It should be no problem for you to do this in Construct 2 as well! ;-)

.CAPX

mouse-follower.capx

Download now 291.92 KB
  • 0 Comments

Want to leave a comment? Login or Register an account!