This tutorial will show you how to make your character move using on-screen controls, useful for mobile games.

For this tutorial, you will need a sprite for your player avatar. The examples will use the character from the Simplified Platformer Pack from the Kenney Assets wbsite (www.kenney.nl).

You will also need arrow sprites for the on screen controls. The examples will use the arrow sprites from the Game Icons Pack from the Kenney Assets wbsite (www.kenney.nl).

This tutorial is for making a player move with on-screen controls. Let's clearly state our goal behaviour:

Move our player left or right whenever they touch the on-screen buttons.

Action - Moving the Player

In the stated goal behaviour above, the first part of the sentence describes the Action that should occur:

Move our player left or right...

Our action is to move the player. We'll accomplish this by setting their horizontal (x) velocity, using a SetVelocity2DAction. This component controls the physics based velocity of a GameObject using another component, a Rigidbody2D. The Rigidbody is a built in component from Unity which handles physics.

Lets create a GameObject for our Player. The easiest way to do this is to drag our player's sprite into the Scene window. This will create a GameObject for the Player with a SpriteRenderer component attached.

Now add the SetVelocity2DAction component to our Player by selecting the player and clicking the "Add Component" button in the inspector.

Select "Dino Toolkit" > "Actions" > "SetVelocity2DAction" from the pop up menu.

This will add the SetVelocity2DAction component, and will also automatically add a Rigidbody2D component, since Unity knows that our SetVelocity2DAction component requires it.

You can set the speed for your SetVelocity2DAction - this is a multiplier that will scale whatever speed is set. I like mine to be around 10.

On the Rigidbody2D, you should temporarily turn off gravity by setting the scale to 0. If your game is a platformer, you should turn this back on by setting it to 1 later, once you have added in platforms for the player to stand on.

You should also add a linear drag to the Rigidbody2D. This is so that when we stop pressing the side button, the character will slow down and stop. I like mine around 5. You can try different numbers - the higher the number, the faster the player will slow down.

The action is now all ready to use - but with the Dino Toolkit, and action cannot happen on its own. It must be triggered by an Activator in order to actually happen.

Activator

In the stated goal behaviour above, the second part of the sentence describes the Activator condition:

...whenever they touch the on-screen buttons.

We want to detect when the player touches the button, and use the SetVelocity2DAction to move the Player. To detect this touch, we will use the InputMouseActivator - this is because Unity considers touches to be mouse clicks. The InputMouseActivator can detect when the player has clicked on an object - exactly what we need.

Drag the right arrow icon into the scene to create a Right Button GameObject. Select the new GameObject and add the InputMouseActivator to it (it's under Dino Toolkit > Activators > InputMouseActivator).

The InputMouseActivator is already set up by default to only consider clicks on the attached object. However, to make this work, the object must be given a collider. Add a new component to your button - a BoxCollider2D. Once you add this component, check the "Is Trigger" box. This will keep your button from colliding with the game world.

Now we have a collider, this will allow our button to be clicked. We just need to tell the InputMouseActivator what Action to perform when the click happens. There are several different ways we can trigger an action - let's use "OnButtonHeld" so that the player moves for as long as the button is held down. Click the + button in the corner of the light grey box for "OnButtonHeld" to add a new Action for this situation.

Drag in the GameObject with the action that will be performed. In our case, the Action is on our Player, so drag the Player GameObject in to your new OnButtonHeld action. Now select "SetVelocity2DAction" > "ActionSetXVelocity" from the dropdown. Finally, enter "1" into the box to indicate the Player should move in the positive x direction - which means to the right.

Hit the play button and try it out - if everything was setup correctly, your player should move to the right when you click the button!

Challenge

Add another button for moving left. This should be exactly the same as the right button, only instead of positive 1 it should use -1 when setting the x velocity.

Further Development

Here are some ideas to make your controls even better:

1. Change the speed setting on the Player's SetVelocity2D to easily change how fast your player moves without having to change your buttons
2. Change the linear drag setting on Player's Rigidbody2D to make them come to a stop more quickly, or more gradually.
3. Make your On Screen Buttons follow the camera by making them children of the camera game object. Then, even if your camera moves, the buttons will stay with it.
4. Make your On Screen Buttons float in front of the other sprites by giving them a separate Sorting Layer, or a high Order in Layer.
5. Add a Jump button. Instead of using "Set Velocity", you may want to use "Add Force" instead. See Tutorial: Platformer Player Movement for more information on how to implement jumping.