Intro
Most mobile games, for example action-adventure-exploring style of games, use on screen controls that require both hands as a mean to imitate the function of game-pads (controllers) used on home consoles, personally however, most the times I do not have 2 free hands to play and is the reason why I decided to address this issue by creating systems that allows for one finger play.
This is a set of tutorials showing a setup to create games that require for only one finger to play.
Base systems:
- Analog Controls, this tutorial
- Automatic Aiming and Actions (WIP)
- AI (WIP)
Good to have:
- Support for Multiple Screen Sizes (follow the reference tutorials links)
Reference Tutorials
On screen controls basics from Scirra's touch tutorial
Refer to Jayderyu's tutorial about touch controls on mobile devices.
Multiple screen size support in depth by Fronne.
Multiple screen size support quick tutorial by PSI.
Project Setup
Global int variables
I named them controlX and controlY, they are used to hold the values of the fist touch/click position.
Sprite objects:
Player control, I named it base, with the behaviors:
- 8 direction with a set angle of 90 degree intervals
- Bound to layout
- Scroll to
UI cursor, I named it UImove, with a pin behavior.
Input Objects:
- Touch
- Mouse; even tho this tutorial is about touch controls, we will use the mouse to test when no touch is available. Be sure to test on a mobile devise.
Workflow:
1. Add the Player Control and the UI cursor sprite objects into the Layout.
2. On start of layout:
2.1. Set the position of the UI cursor to that of the Player Control
2.2. Activate the pin of the UI cursor to the Player control, on position only
3. Add an event On any touch start to do the following:
3.1. Set the values for the control variables to that of the difference between: the touch positions (X and Y) and the value of the ViewportLeft for X and ViewportTop for Y.
Touch.X - ViewportLeft(0)
Touch.X - ViewportLeft(0)
3.2. Unpin the UI cursor from the Player Control, allowing for its movement.
4. Add an Is in touch event to:
4.1. Set the positions (X and Y) of the UI cursor to: the sum of Player Control position (X and Y) and the positions (X and Y) of the Touch, minus the sum of the values for the control variables with the current ViewportLeft for X and ViewportTop for Y.
Player Control.X + Touch.X - ( control var X + ViewportLeft(0) )
Player Control.Y + Touch.Y - ( control var Y + ViewportTop(0) )
4.2. Set the 8 Direction vectors (X and Y) to the difference between the positions (X and Y) of the Player Controller and the positions (X and Y) of the UI cursor.
( UI cursor.X - Player Control.X )
( UI cursor.Y - Player Control.Y )