[TUTORIAL] Joystick virtual para mobile

Olá galera, elaborei este tutorial simples baseado no meu sistema de Inputs Mobile. É um Joystick que funciona em mobile e pode ser acessado facilmente, conforme o vídeo:

IMPORTANTÍSSIMO: Assistam o vídeo para saber o que fazer com os códigos

Vídeo: 


Script MSJoystickController

Código:

using System.Collections;
using UnityEngine;
using UnityEngine.UI;

public class MSJoystickController : MonoBehaviour {

 public MSJoystick joystick;
 public static Vector2 joystickInput;//é possível acessar através de MSJoystickController.joystickInput

 void Update () {
 if(joystick){
 joystickInput = new Vector2 (joystick.joystickX, joystick.joystickY);
 }
 }
}

O script do próprio Joystick

Código:

using UnityEngine;
using UnityEngine.UI;
using UnityEngine.Events;
using UnityEngine.EventSystems;
using System.Collections;

#if UNITY_EDITOR
using UnityEditor;
#endif

[RequireComponent(typeof(RectTransform))]
public class MSJoystick : UIBehaviour, IBeginDragHandler, IEndDragHandler, IDragHandler {

 [SerializeField]
 RectTransform _joystickGraphic;
 Vector2 _axis;
 bool _isDragging;
 [HideInInspector]
 public float joystickY;
 [HideInInspector]
 public float joystickX;

 RectTransform _rectTransform;
 public RectTransform rectTransform {
 get {
 if (!_rectTransform) {
 _rectTransform = transform as RectTransform;
 }
 return _rectTransform;
 }
 }

 public void OnBeginDrag(PointerEventData eventData) {
 if (!IsActive ()) {
 return;
 }
 EventSystem.current.SetSelectedGameObject(gameObject, eventData);
 Vector2 newAxis = transform.InverseTransformPoint(eventData.position);
 newAxis.x /= rectTransform.sizeDelta.x * 0.5f;
 newAxis.y /= rectTransform.sizeDelta.y * 0.5f;
 SetAxisMS(newAxis);
 _isDragging = true;
 }

 public void OnEndDrag(PointerEventData eventData) {
 _isDragging = false;
 }

 public void OnDrag(PointerEventData eventData) {
 RectTransformUtility.ScreenPointToLocalPointInRectangle(rectTransform, eventData.position, eventData.pressEventCamera, out _axis);
 _axis.x /= rectTransform.sizeDelta.x * 0.5f;
 _axis.y /= rectTransform.sizeDelta.y * 0.5f;
 SetAxisMS(_axis);
 }

 void OnDeselect() {
 _isDragging = false;
 }

 void LateUpdate() {
 if (!_isDragging) {
 if (_axis != Vector2.zero) {
 Vector2 newAxis = _axis - (_axis * Time.deltaTime * 25.0f);
 if (newAxis.sqrMagnitude <= 0.1f) {
 newAxis = Vector2.zero;
 }
 SetAxisMS (newAxis);
 }
 }
 }

 public void SetAxisMS(Vector2 axis) {
 _axis = Vector2.ClampMagnitude(axis, 1);
 UpdateJoystickGraphicMS();
 joystickY = _axis.y;
 joystickX = _axis.x;
 }

 void UpdateJoystickGraphicMS() {
 if (_joystickGraphic) {
 _joystickGraphic.localPosition = _axis * Mathf.Max (rectTransform.sizeDelta.x, rectTransform.sizeDelta.y) * 0.5f;
 }
 }

 #if UNITY_EDITOR
 protected override void OnValidate() {
 base.OnValidate();
 UpdateJoystickGraphicMS();
 }
 #endif
}


Imagem Background:





Imagem Graphic:

quando coloca pra esquerda vai direita ou pra tras acho q a unity ta bugada pra controle.m

Francisco, depende da posição/rotação de sua câmera.

NKKF escreveu:Francisco, depende da posição/rotação de sua câmera.

Uso o fps controller e a camera fica nela é filha dela na hierarquia

Então é provável que você a tenha rotacionado, deixe-a em 0,0,0. E mude o Vector3 para transform.TransformDirection.

ele funciona em jogo 2d?

Funciona sim, é só você editar algumas coisas do script.. Converter, apenas.

Fala Galera, o que posso estar fazendo errao, meu personagem ele anda parado ele nao se desloca quando uso o joystick, só faz a animação de andar mais ele nao se move.

Código:

using System;
using UnityEngine;
using UnityEngine.EventSystems;

namespace UnityStandardAssets.CrossPlatformInput
{
   public class Joystick : MonoBehaviour, IPointerDownHandler, IPointerUpHandler, IDragHandler
   {
      public enum AxisOption
      {
         // Options for which axes to use
         Both, // Use both
         OnlyHorizontal, // Only horizontal
         OnlyVertical // Only vertical
      }

      public int MovementRange = 100;
      public AxisOption axesToUse = AxisOption.Both; // The options for the axes that the still will use
      public string horizontalAxisName = "Horizontal"; // The name given to the horizontal axis for the cross platform input
      public string verticalAxisName = "Vertical"; // The name given to the vertical axis for the cross platform input

      Vector3 m_StartPos;
      bool m_UseX; // Toggle for using the x axis
      bool m_UseY; // Toggle for using the Y axis
      CrossPlatformInputManager.VirtualAxis m_HorizontalVirtualAxis; // Reference to the joystick in the cross platform input
      CrossPlatformInputManager.VirtualAxis m_VerticalVirtualAxis; // Reference to the joystick in the cross platform input

      void OnEnable()
      {
         CreateVirtualAxes();
      }

        void Start()
        {
            m_StartPos = transform.position;
        }

      void UpdateVirtualAxes(Vector3 value)
      {
         var delta = m_StartPos - value;
         delta.y = -delta.y;
         delta /= MovementRange;
         if (m_UseX)
         {
            m_HorizontalVirtualAxis.Update(-delta.x);
         }

         if (m_UseY)
         {
            m_VerticalVirtualAxis.Update(delta.y);
         }
      }

      void CreateVirtualAxes()
      {
         // set axes to use
         m_UseX = (axesToUse == AxisOption.Both || axesToUse == AxisOption.OnlyHorizontal);
         m_UseY = (axesToUse == AxisOption.Both || axesToUse == AxisOption.OnlyVertical);

         // create new axes based on axes to use
         if (m_UseX)
         {
            m_HorizontalVirtualAxis = new CrossPlatformInputManager.VirtualAxis(horizontalAxisName);
            CrossPlatformInputManager.RegisterVirtualAxis(m_HorizontalVirtualAxis);
         }
         if (m_UseY)
         {
            m_VerticalVirtualAxis = new CrossPlatformInputManager.VirtualAxis(verticalAxisName);
            CrossPlatformInputManager.RegisterVirtualAxis(m_VerticalVirtualAxis);
         }
      }


      public void OnDrag(PointerEventData data)
      {
         Vector3 newPos = Vector3.zero;

         if (m_UseX)
         {
            int delta = (int)(data.position.x - m_StartPos.x);
            delta = Mathf.Clamp(delta, - MovementRange, MovementRange);
            newPos.x = delta;
         }

         if (m_UseY)
         {
            int delta = (int)(data.position.y - m_StartPos.y);
            delta = Mathf.Clamp(delta, -MovementRange, MovementRange);
            newPos.y = delta;
         }
         transform.position = new Vector3(m_StartPos.x + newPos.x, m_StartPos.y + newPos.y, m_StartPos.z + newPos.z);
         UpdateVirtualAxes(transform.position);
      }


      public void OnPointerUp(PointerEventData data)
      {
         transform.position = m_StartPos;
         UpdateVirtualAxes(m_StartPos);
      }


      public void OnPointerDown(PointerEventData data) { }

      void OnDisable()
      {
         // remove the joysticks from the cross platform input
         if (m_UseX)
         {
            m_HorizontalVirtualAxis.Remove();
         }
         if (m_UseY)
         {
            m_VerticalVirtualAxis.Remove();
         }
      }
   }
}

Johnatasdasilva escreveu:Fala Galera, o que posso estar fazendo errao, meu personagem ele anda parado ele nao se desloca quando uso o joystick, só faz a animação de andar mais ele nao se move.

Código:

using System;
using UnityEngine;
using UnityEngine.EventSystems;

namespace UnityStandardAssets.CrossPlatformInput
{
   public class Joystick : MonoBehaviour, IPointerDownHandler, IPointerUpHandler, IDragHandler
   {
      public enum AxisOption
      {
         // Options for which axes to use
         Both, // Use both
         OnlyHorizontal, // Only horizontal
         OnlyVertical // Only vertical
      }

      public int MovementRange = 100;
      public AxisOption axesToUse = AxisOption.Both; // The options for the axes that the still will use
      public string horizontalAxisName = "Horizontal"; // The name given to the horizontal axis for the cross platform input
      public string verticalAxisName = "Vertical"; // The name given to the vertical axis for the cross platform input

      Vector3 m_StartPos;
      bool m_UseX; // Toggle for using the x axis
      bool m_UseY; // Toggle for using the Y axis
      CrossPlatformInputManager.VirtualAxis m_HorizontalVirtualAxis; // Reference to the joystick in the cross platform input
      CrossPlatformInputManager.VirtualAxis m_VerticalVirtualAxis; // Reference to the joystick in the cross platform input

      void OnEnable()
      {
         CreateVirtualAxes();
      }

        void Start()
        {
            m_StartPos = transform.position;
        }

      void UpdateVirtualAxes(Vector3 value)
      {
         var delta = m_StartPos - value;
         delta.y = -delta.y;
         delta /= MovementRange;
         if (m_UseX)
         {
            m_HorizontalVirtualAxis.Update(-delta.x);
         }

         if (m_UseY)
         {
            m_VerticalVirtualAxis.Update(delta.y);
         }
      }

      void CreateVirtualAxes()
      {
         // set axes to use
         m_UseX = (axesToUse == AxisOption.Both || axesToUse == AxisOption.OnlyHorizontal);
         m_UseY = (axesToUse == AxisOption.Both || axesToUse == AxisOption.OnlyVertical);

         // create new axes based on axes to use
         if (m_UseX)
         {
            m_HorizontalVirtualAxis = new CrossPlatformInputManager.VirtualAxis(horizontalAxisName);
            CrossPlatformInputManager.RegisterVirtualAxis(m_HorizontalVirtualAxis);
         }
         if (m_UseY)
         {
            m_VerticalVirtualAxis = new CrossPlatformInputManager.VirtualAxis(verticalAxisName);
            CrossPlatformInputManager.RegisterVirtualAxis(m_VerticalVirtualAxis);
         }
      }


      public void OnDrag(PointerEventData data)
      {
         Vector3 newPos = Vector3.zero;

         if (m_UseX)
         {
            int delta = (int)(data.position.x - m_StartPos.x);
            delta = Mathf.Clamp(delta, - MovementRange, MovementRange);
            newPos.x = delta;
         }

         if (m_UseY)
         {
            int delta = (int)(data.position.y - m_StartPos.y);
            delta = Mathf.Clamp(delta, -MovementRange, MovementRange);
            newPos.y = delta;
         }
         transform.position = new Vector3(m_StartPos.x + newPos.x, m_StartPos.y + newPos.y, m_StartPos.z + newPos.z);
         UpdateVirtualAxes(transform.position);
      }


      public void OnPointerUp(PointerEventData data)
      {
         transform.position = m_StartPos;
         UpdateVirtualAxes(m_StartPos);
      }


      public void OnPointerDown(PointerEventData data) { }

      void OnDisable()
      {
         // remove the joysticks from the cross platform input
         if (m_UseX)
         {
            m_HorizontalVirtualAxis.Remove();
         }
         if (m_UseY)
         {
            m_VerticalVirtualAxis.Remove();
         }
      }
   }
}

Ta, am, mas isso não tem a ver com o tutorial... Você está usando o joyostick do CrossPlataformInput.

Meu joystick ta funcionando, mas quando eu solto o dedo do joystick e a bolinha vai voltar pro meio ela fica se movendo sozinha, fazendo o personagem se movimentar sozinho.

JohnVitor escreveu:Meu joystick ta funcionando, mas quando eu solto o dedo do joystick e a bolinha vai voltar pro meio ela fica se movendo sozinha, fazendo o personagem se movimentar sozinho.

no jogo compilado ou no computador somente?

Galera, ele faz um script no vídeo, mas não disponibilizou aqui no site, alguém pode me passar ele? tentei fazer e deu errado.
O nome do script é "Jogador".

   

ALGUÉM POR FAVOR PODE ME RESPONDER???????????????????????
ELE FAZ UM SCRIPT DO "JOGADOR" DURANTE O VÍDEO, EU FIZ, MAS NÃO FUNCIONOU, ALGUÉM PODE POR FAVOR COLOCAR O SCRIPT AQUI, COMO RESPOSTA???????????????
PLIZ! 

Acredito que o script do jogador foi apenas um exemplo de como utilizar o Joystick, tanto que ele nem postou junto com o restante...
Você pode utilizar qualquer outro sistema de Character Controller mais robusto e só adicionar o input do Joystick usando a variável estática que ele comentou ali:

Código:

public static Vector2 joystickInput;//é possível acessar através de MSJoystickController.joystickInput

Pessoal,
Segui os passos do tutorial, mas o botão do joystick virtual aparece sem textura na minha Unity. Só aparece um retângulo branco. 
Como faço para corrigir isso?
Obrigado.

coloca uma textura nele.  

Magnatah escreveu:coloca uma textura nele.  

Oi, Magnatah.
Mas eu acho que já fiz isso e não funcionou:
No Inspector do Background em Sourse Image eu coloquei a figura que eu havia pelo aqui no fórum e convertido em Sprite (2D and UI)...

Posta um print

é só usar o https://imgur.com/upload?beta 

> Vai nos  "3 Pontinhos"  depois em  "Get share links"  e em seguida copie e cole o código que está em  "BBCode (Forums)"

Magnatah escreveu:Posta um print

é só usar o https://imgur.com/upload?beta 

> Vai nos  "3 Pontinhos"  depois em  "Get share links"  e em seguida copie e cole o código que está em  "BBCode (Forums)"

https://imgur.com/a/D3CZvfo
É a primeira vez que uso essa ferramenta. Seria esse o link:
https://imgur.com/a/D3CZvfo

Coloque a  Image (1)  pra cima do  Background

Magnatah escreveu:Coloque a  Image (1)  pra cima do  Background

Funcionou! Muito obrigado, Magnatah!
Mas confesso que não entendi a lógica.

Tenha um bom dia!

alvarolima escreveu:

Magnatah escreveu:Coloque a  Image (1)  pra cima do  Background

Funcionou! Muito obrigado, Magnatah!
Mas confesso que não entendi a lógica.

Tenha um bom dia!

Simples o Background Estava em cima da Image (1)

Magnatah escreveu:

alvarolima escreveu:

Magnatah escreveu:Coloque a  Image (1)  pra cima do  Background

Funcionou! Muito obrigado, Magnatah!
Mas confesso que não entendi a lógica.

Tenha um bom dia!

Simples o Background Estava em cima da Image (1)

Pessoal, eu confesso que não domino programação em C#.
Esse é o código que eu uso no movimento do meu personagem com o NavMesh Agent. A minha dúvida é: como inserir o código do Joystick virtual aqui?

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.AI;

public class MovePlayer : MonoBehaviour
{
    NavMeshAgent agent;

    void Start()
    {
        agent = gameObject.GetComponent<NavMeshAgent>();        
    }


    void Update()
    {
        if (Input.GetMouseButtonDown(0))
        {
            RaycastHit hit;

            if (Physics.Raycast(Camera.main.ScreenPointToRay(Input.mousePosition), out hit, 70))
            {
                agent.destination = hit.point;

            }
        }
    }
}

Desde já agradeço qualquer ajuda.


What do you want to do ?
New mail
Copy

não consegui encontrar o erro no meu,mas o meu player não se movimenta,apenas o joystick.agradeço se poderem me ajudar

Pessoal, eu troquei o movimento do seu jogador por um código mais simples, sem o NavMeshagent que funciona perfeitamente no teclado.

o problema é que não sei como inserir o código do input do Joystick virtual. sei que pode ser uma pergunta boba para quem domina C#, mas realmente estou encalhado nesse ponto. Agradeceria qualquer ajuda.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Player : MonoBehaviour
{
    public float movementSpeed = 10;
    public float turningSpeed = 60;

    private void Update()
    {
        float horizontal = Input.GetAxis("Horizontal") * turningSpeed * Time.deltaTime;
        transform.Rotate(0, horizontal, 0);

        float vertical = Input.GetAxis("Vertical") * movementSpeed * Time.deltaTime;
        transform.Translate(0, 0, vertical);
    }
}

cara esse script só faz com que o player se mova de forma fixa não dá pra girar nem pra direita nem esquerda

francisco barroso escreveu:cara esse script só faz com que o player se mova de forma fixa não dá pra girar nem pra direita nem esquerda

Oi, Francisco.
Então é feitiçaria, pois ele gira, tanto para esquerda quanto para direita e vai para frente e para trás! 
Inclusive, acho melhor que o modelo de movimento apresentado no tutorial.
Acho que o segredo da "magia" é a linha 13do código: Transform.Rotate (0,horizontal, 0);

De qualquer obrigado pelo comentário.

alvarolima escreveu:

francisco barroso escreveu:cara esse script só faz com que o player se mova de forma fixa não dá pra girar nem pra direita nem esquerda

Oi, Francisco.
Então é feitiçaria, pois ele gira, tanto para esquerda quanto para direita e vai para frente e para trás! 
Inclusive, acho melhor que o modelo de movimento apresentado no tutorial.
Acho que o segredo da "magia" é a linha 13do código: Transform.Rotate (0,horizontal, 0);

De qualquer obrigado pelo comentário.

Mas eu falo girar tipo se a pessoa tiver num corredor e quiser voltar pra trás não dá só se for de costas..falo de girar 360 com a tela mano e não ir pra direita e esquerda

Claro que dá!
Se você usar a seta da esquerda ou da direita, o cubo gira 360 graus e volta de frente pelo corredor! 
Acabei de testar agora!

alvarolima escreveu:Claro que dá!
Se você usar a seta da esquerda ou da direita, o cubo gira 360 graus e volta de frente pelo corredor! 
Acabei de testar  

Seta do pc? queria pra Android mano

francisco barroso escreveu:

alvarolima escreveu:Claro que dá!
Se você usar a seta da esquerda ou da direita, o cubo gira 360 graus e volta de frente pelo corredor! 
Acabei de testar  

Seta do pc? queria pra Android mano

Oi, Francisco.
Essa é exatamente a minha dúvida. Como inserir o código do Joystick virtual do Android nesse modelo.
O pessoal fala que é fácil, dá para usar até o NavMeshAgent... mas eu não consigo...

alvarolima escreveu:

francisco barroso escreveu:

alvarolima escreveu:Claro que dá!
Se você usar a seta da esquerda ou da direita, o cubo gira 360 graus e volta de frente pelo corredor! 
Acabei de testar  

Seta do pc? queria pra Android mano

Oi, Francisco.
Essa é exatamente a minha dúvida. Como inserir o código do Joystick virtual do Android nesse modelo.
O pessoal fala que é fácil, dá para usar até o NavMeshAgent... mas eu não consigo...

Mas o navMesh não é automático pra inimigos?

https://i.imgur.com/WBYIWyO.png

oque que tem de errado com meu codigo ta dando um erro

JohnVitor escreveu:Meu joystick ta funcionando, mas quando eu solto o dedo do joystick e a bolinha vai voltar pro meio ela fica se movendo sozinha, fazendo o personagem se movimentar sozinho.

Olá. Eu estava com o mesmo problema no meu jogo, e resolvi modificando o método:

Código:

void LateUpdate() {
 if (!_isDragging) {
 if (_axis != Vector2.zero) {
 Vector2 newAxis = _axis - (_axis * Time.deltaTime * 25.0f);
 if (newAxis.sqrMagnitude <= 0.1f) {
 newAxis = Vector2.zero;
 }
 SetAxisMS (newAxis);
 }
 }
}

Por:

Código:

void LateUpdate() {
 if (!_isDragging) {
 SetAxisMS (Vector2.zero);
 }
}

Aparentemente havia um if desnecessário que acabava causando o bug no Joystick, pois ao verificar "newAxis.sqrMagnitude <= 0.1f" provavelmente o resultado era false e acabava não zerando a posição do Joystick. Espero ter ajudado.