Unity

Use touch-optimized input controls with On-Screen Control

Page update date :
Page creation date :

Verification environment

Windows
  • Windows 11
Unity Editor
  • 2020.3.25f1
Input System Package
  • 1.2.0

Prerequisites for this tip

The following settings have been made in advance as a premise for the description of this tip.

You should also be familiar with the following tips:

About On-Screen Control for touch

I often use a keyboard or gamepad to play games. On devices that can only be operated by touch, such as smartphones, you will play the game by touch.

Unity's input system package uses On-Screen Control to simulate touch interactions as if they were controlled by a controller.

Before On-Screen Control

This article is a bit lengthy, but this topic is not directly related to On-Screen Control. If you can use the input system package in other steps to check the input, such as a gamepad, that is fine.

In this tip, we will create an action map. Describes how to simulate touching a gamepad as if you were interacting with it.

By the way, it also supports the method of using classes and Gamepad classes in Keyboard scripts instead of action maps. I won't explain it this time, but if you want to try it with those classes, you can prepare the code described on the following page instead.

First, place a text object on the Canvas to display your inputs. Later, we will place the touch object at the bottom, so leave some space.

First, create an action map as follows: You're creating the same Action as you did when you described the action map.

Since the explanation of the action map is not the main thing, the binding is simple. Please refer to the following page for details on action maps.

This time, input acquisition is performed by script instead of "Send Messages" or "Invoke Unity Events". This is also not limited to scripts, and it works properly even if you use "Send Messages" etc.

Make sure you have generated the code from the action map.

The script looks like this: It is almost the same as when explaining the action map.

using UnityEngine;
using UnityEngine.InputSystem;
using UnityEngine.UI;

public class InputActionScript : MonoBehaviour
{
  /// <summary>情報を表示させるテキストオブジェクト。</summary>
  [SerializeField] private Text TextObject;

  /// <summary>アクションマップから自動生成されたクラス。</summary>
  private InputActionSample _actionMap;

  private void Awake()
  {
    // 各操作を行ったときに呼ばれるイベントを設定する
    _actionMap = new InputActionSample();
    _actionMap.Action2D.Move.performed += context => OnMove(context);
    _actionMap.Action2D.Attack.performed += context => OnAttack(context);
    _actionMap.Action2D.Move.canceled += context => OnMove(context);
    _actionMap.Action2D.Attack.canceled += context => OnAttack(context);
  }

  private void OnEnable()
  {
    // このオブジェクトが有効になったときにアクションマップを有効にする
    _actionMap.Enable();
  }

  private void OnDisable()
  {
    // このオブジェクトが無効になったときにアクションマップが余計な動作を起こさないように無効にする
    _actionMap.Disable();
  }

  /// <summary>
  /// Move 操作をした時に呼ばれるメソッドです。
  /// </summary>
  /// <param name="context">コールバックパラメータ。</param>
  public void OnMove(InputAction.CallbackContext context)
  {
    // Move の入力量を取得
    var vec = context.ReadValue<Vector2>();
    TextObject.text = $"Move:({vec.x:f2}, {vec.y:f2})\n{TextObject.text}";
  }

  /// <summary>
  /// Attack 操作をした時に呼ばれるメソッドです。
  /// </summary>
  /// <param name="context">コールバックパラメータ。</param>
  public void OnAttack(InputAction.CallbackContext context)
  {
    // Attack ボタンの状態を取得
    var value = context.ReadValueAsButton();
    TextObject.text = $"Attack:{value}\n{TextObject.text}";
  }
}

The EventSystem script is attached to .

Run the game to see if it works as an action map.

On-Screen Button

The On-Screen Button simulates pressing buttons on a gamepad, such as A and B, and the keys on the keyboard when you touch some object on the screen. By the way, it says touch, but it also works with mouse clicks.

First place the button on the screen. Since you just attach a component, it works with objects other than buttons.

Add an Input > On-Screen Button from the component.

Set the Gamepad's Button East from Control Path. This makes it look as if Button East on the Gamepad was pressed when touched.

Make sure that Attack appears when you run the game and click the button. If it is a touchable device, you can confirm that it works with touch.

On-Screen Stick

On-Screen Stick lets you move objects like sticks with your touch. When you move a stick, it is possible to simulate it as if you had moved a gamepad stick. In addition to touch, it is also possible to move it with the mouse.

Places a button object on the screen that will be a touch stick. We are using a button here, but it also works with objects other than buttons.

Under Add Component, select Input > On-Screen Stick.

From Control Path, select the Gamepad LeftStick defined in the action map.

Run the game and try dragging the Stick button. The buttons move in a circle, as if moving a stick. Of course, you can also check that the input content is fetched while it is running.

In this case, we have placed a button, but it is also possible to make it look like a virtual stick by placing a circular frame and a round stick object.

By the way, this movable range can be changed in the "Movement Range" of the On-Screen Stick.

Set up an action map dynamically
Customize the On-Screen Control to implement the D-pad