how do I make eyes follow a finger touching the screen

0 favourites
  • 6 posts
From the Asset Store
Is a circular loading screen with code ready to use. No Animation.
  • Could someone explain how to do the eyes of a character look toward the finger touching the screen? I want this to happen only when the finger is in a certain area around the eyes. Thanks in advance.

  • Hey RenatoB,

    There are quite a few ways to do this, so I'll give a simple example, that will hopefully be a good starting point. But more complex setups are certainly possible.


    1. Create a Sprit object for your character.

    2. In the image editor, create an image for your character, but leave the eye area blank (i.e. skin colored).

    3.Still in the image editor for the character's body, click the "Image point" button on the left-hand toolbar. (Second from bottom, and looks like a crosshair.)

    You should get an extra side window titled "Image points".

    4. In the "Image points" window, add two image points, named "eyeLeft" and "eyeRight". Select the "eyeLeft" image point and click on your character image, to place the image point where the left eye should go. Do the same for the "eyeRight" image point.


    5. Create a Sprit object to act as an eye. The eye will be a white circle, with a black pupil circle, however the pupil circle will be positioned to the right of center, as if the eye is looking to the right.

    6. For the eye Sprite object, add an text instance variable named "attachPoint". (We will use this variable to name the image point that the eye is supposed to attach to.)

    7. Make a copy of the eye Sprite, so you have two eyes.

    8. For one of the eyes, set its "attachPoint" variable to "eyeLeft" (without quotes)

    9. For the other eye, set its "attachPoint" variable to "eyeRight" (without quotes)

    Positioning eyes:

    10. Open the event editor, and add the following event:


    * Every tick.


    * Eye: Set Eye position to position of Character, at image point Eye.attachPoint.

    Explanation: For each Eye, we are setting the Eye to be positioned on the Character, at one of the Character's 2 image points. We get the name of the appropriate image point from the Eye's "attachPoint" instance variable, the one we made earlier. So, the Eye with the attachPoint variable set to "eyeLeft" will attach to the Character's "eyeLeft" image point. Same idea for the other Eye and "eyeRight".

    You can try running the game at this point to make sure the eyes are getting positioned correctly.

    Aiming eyes:

    11. add the following event:


    * Every tick.


    * Eye: Set Eye angle to look at position, <whatever position you want them to look at>.

    Hope that helps.

  • Hi fisholith

    Great explanation and step by step. Better than I needed. Many thanks.

    I already knew how to do some things, but it's great to know the modus operandi of others. My question was regarding the events / actions to implement it. At the end I use "angle toward"? I need relate this action to the event "is touching the object"


  • You can use the system expression angle() and/or the properties Touch.X and Touch.Y for that.

    If you use "Set angle toward" just enter the X and Y coordinates of the Touch object when it is touching.

  • Thanks for the tips, Kyatric

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • You can also use the "distance(x1,y1,x2,y2)" expression in a condition to verify that the touch is a certain distance from the character, as it sounds like you are also interested in triggering the effect only when close enough to the character.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)