Virtual Joystick.

This is going to be different from the rest of my other blogs. Instead of posting something minor and be on my way, I'd thought give a little insight by directly posting the code and how it works.

Made an easy to use Virtual Joystick controller. I did this for easing in new devs for into mobile gaming. More details in my blog. https://t.co/OAPSU5gDTL pic.twitter.com/ZQKVU85dnR

— Rami Morrar (@RamiMorrar97) October 20, 2019

Here is the code below:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.EventSystems;
public class VirtualJoyStick : MonoBehaviour, IDragHandler, IPointerUpHandler, IPointerDownHandler
{
    private Image Background;
    private Image Joystickimg;
    private Vector3 inputvector;

    private void Start()
    {
        Background = GetComponent<Image>();
        Joystickimg = transform.GetChild(0).GetComponent<Image>();
     
    }
    public void OnDrag(PointerEventData ped)
    {
        Vector2 pos;
        if(RectTransformUtility.ScreenPointToLocalPointInRectangle(Background.rectTransform, ped.position, ped.pressEventCamera, out pos)){
            pos.x = (pos.x / Background.rectTransform.sizeDelta.x);
            pos.y = (pos.y / Background.rectTransform.sizeDelta.y);
            inputvector = new Vector3(pos.x * 4 + 1, 0, pos.y * 4 - 1);
            inputvector = (inputvector.magnitude > 1.0f) ? inputvector.normalized : inputvector;
            //Move joystick img
            Joystickimg.rectTransform.anchoredPosition =
                new Vector3(inputvector.x * (Background.rectTransform.sizeDelta.x / 3), inputvector.z * (Background.rectTransform.sizeDelta.y / 3));
        }
    }

    // Start is called before the first frame update
    public void OnPointerDown(PointerEventData ped)
    {
        OnDrag(ped);
    }

    public void OnPointerUp(PointerEventData ped)
    {
        inputvector = Vector3.zero;
        Joystickimg.rectTransform.anchoredPosition = Vector3.zero;
     
    }

    public float Horizontal()
    {
        if (inputvector.x != 0)
            return inputvector.x;
        else
            return Input.GetAxis("Horizontal");

    }
    public float Vertical()
    {
        if (inputvector.z != 0)
            return inputvector.z;
        else
            return Input.GetAxis("Vertical");

    }

}

 Now this seems like a huge info dump, but it's very simple and less than 100 lines. In order to initiate the code, you need to put in the UI library Unity has on the top. Second, you should use two UI images: one for the background of the joystick and the actual joystick itself. Note that the actual joystick is a child of the background image. This is to make sure the joystick itself is locked within a circle. Now joysticks work differently from a keyboard in a way. The Background.rectTransform.sizeDelta.x / 3 part is basically what lets the joystick transform and move around. Dividing the transformation basically configuring the sensitivity of the stick. The more you divide, the more tighter it becomes. Second and lastly, The public floats Vertical and Horizontal are basically just ways to create a shortcut for the inputs So instead of saying Input.GetAxis("Horizontal") to declare player input, you can simply put Joystick.Horizontal. This allows for actual player input to be received from the stick. Anyways, this is a short blog. I might get something cranked out tomorrow or later tonight, but I don't know yet. Enjoy and happy coding!