blog

Yanan Gemilere Bakarak Hayal Kurulmaz

Unity Simple Joystick

Unity Simple Joystick

--> Bu yazımızda internette pek Türkçe kaynağa rastlamadıgım Joystick yapımını inceleyecegiz.

--> Ilk olarak 'Canvas' objemizi olusturarak baslayalım.

--> Canvas objemizin 'Canvas Scaler' componentindeki 'UI Scale Mode' secenegini 'Scale With Screen Size' moduna getiriyorum.
Bu secenek UI objelerini 'Reference Resolution' daki belirmis oldugumuz cözunurluge gore ayarlarak cozunurluk degisiminde su anki oranı korur.
Tabi reference res. ayarını kendi 'Standolone' ayarımıza esitlemiliyiz ki objelerin nasıl gorunecegini onizleyelim.



--> Ardından Canvas objeme bir Image objesi ekliyorum ve ismini 'JoystickBG' olarak degistiriyorum ve resimde gormus oldugunuz ayarlamaları yapıyorum.



--> Ardından Background Objemizin icine 'Joystick' isminde yeni bir Image objesi olusturup resimde gorulen ayarlamaları yapıyorum.


--> Daha Sonra Joystick_Controller' isimli bir script olustup 'Main Camera' objemize ekliyoruz.

--> Burada mühim olan Unity'nin biza saglamıs oldugu 'Event Trigger' componentidir.
Bu componenti 'JoystickBG' objemize veriyoruz ve 'Pointer Down'(Basıldıgınde) ve 'Pointer Up'(Cekildiginde) isimli Event Type'ı vererek dokunma/tıklama olayını yakalayabiliyoruz.

--> Artık kodları yazabiliriz.



        public RectTransform joystick;
        public RectTransform joystickBG;
        Vector2 startPoint,endPoint,currentPoint;
        bool isSelected;

    

--> UI objelerinin transform componenti RectTransform oldugu icin Joystick ve joystickBG adlı RectTransform tipinde degiskenlerimi olusturuyorum.
Bu sayede Background ve Joystick UI objemizi bu degiskenlere atayıp position ve size ayarlarını ulasabiliriz.

--> Joystick objesini hareket ettirirken startPoint,endPoint ve currentPoint olmak üzere Vector2 tipinde degisken olusturduk

--> endPoint'den startPoint vektorunu cıkarırsak currentPoint elde ederiz ve bu pointe joystick objemizi tasıyabiliriz.


--> joystick objesinin secilme durumunu kontrol etmek icin ise isSelected degiskeni olusturduk


    void Start()
    {
        isSelected = false;

        startPoint = new Vector2(joystickBG.position.x + joystickBG.sizeDelta.x / 2,
        joystickBG.position.y + joystickBG.sizeDelta.y / 2);
    }
    

--> Oncelikle isSelected degiskenini baslangıcta false yapıyoruz

--> Ardından startPoint'i belirliyoruz



    public void MoveStart(){
        isSelected = true;
    }

    public void MoveEnd(){
        isSelected = false;
        joystick.anchoredPosition = Vector2.zero;
    }

    

--> MoveStart ve MoveEnd methodlarını baslangıcta olusturmus oldugumuz Event Trigger componentine atıyoruz.

--> Pointer Down(MoveStart) ve Pointer Up(MoveEnd) event de kullanıyoruz

--> joystick objemize basıldıgında isSelected = true oluyor, kaldırdıgımızda ise isSelected = false oluyor ve tabiki joysticki bıraktıgımız icin baslangıc konumuna gitmesi yani (0,0) gerek.



    void Update()
    {
        if(isSelected){
            endPoint = new Vector2(Input.mousePosition.x,Input.mousePosition.y);
            currentPoint = endPoint - startPoint;
            currentPoint = Vector2.ClampMagnitude(currentPoint,joystickBG.sizeDelta.x / 2);

            joystick.anchoredPosition = currentPoint;
        }
    }
    

--> endPoint noktamızı belirliyoruz.

--> currentPoint noktamız endPoint ve startPoint arasındaki fark

--> Burada mühim olan yer ise Vector2.ClampMagnitude, bu method sectigim vectorun uzunlugunun sınırlandırır, bunu yapıyoruz cunku joystick objesinin arka plandaki resimden dısarı cıkmasını istemiyoruzç

--> En son olarak joystick objemizi currentPoint noktamıza tasıyoruz.


--> Ve scriptin son hali



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

public class Joystick_Controller : MonoBehaviour
{

    public RectTransform joystick;
    public RectTransform joystickBG;
    Vector2 startPoint,endPoint,currentPoint;
    bool isSelected;

    void Start()
    {
        isSelected = false;

        startPoint = new Vector2(joystickBG.position.x + joystickBG.sizeDelta.x / 2,
        joystickBG.position.y + joystickBG.sizeDelta.y / 2);
    }

    void Update()
    {
        if(isSelected){
            endPoint = new Vector2(Input.mousePosition.x,Input.mousePosition.y);
            currentPoint = endPoint - startPoint;
            currentPoint = Vector2.ClampMagnitude(currentPoint,joystickBG.sizeDelta.x / 2);

            joystick.anchoredPosition = currentPoint;
        }
    }

    public void MoveStart(){
        isSelected = true;
    }

    public void MoveEnd(){
        isSelected = false;
        joystick.anchoredPosition = Vector2.zero;
    }
}
        

--> Ve ufak bir goruntu

--> Sonraki Gonderide gorusmek uzere...


Yorumlar


Yorum Yap