Unity2D—利用UGUI纯代码实现简易摇杆

目标：拖动摇杆实现平面物体的移动

一、制作摇杆UI、平面物体
（1）新建画布Canvas，将Canvas的UI缩放模式设置为屏幕大小播放（如不设为该模式则会因界面缩放而导致UI消失）。
（2）在Canvas下新增图片，名为Bound，源图像设置为圆形图片，作为摇杆外圈。
（3）在Bound下新增图片，名为Center，源图像设置为圆形图片、缩小宽度和高度，作为摇杆外圈。

（4）创建空对象，名为Actor，重置坐标并修改Sprite。

（5）示例界面

二、实现代码
（1）JoyStick.cs //摇杆通用脚本

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

public struct JoyStickData //结构体——摇杆数据
{
    
    
    public Vector2 dir; //移动方向
    public float radius; //移动半径
    public JoyStickData(Vector2 d,float r)
    {
    
    
        this.dir = d;
        this.radius = r;
    }
    public Vector2 GetPos()
    {
    
    
        return dir*radius;
    }

}
public class JoyStick : MonoBehaviour,IPointerDownHandler,IPointerUpHandler,IDragHandler    //三个接口，点击、抬起、拖拽
{
    
    
    public RectTransform bound; //外圈
    public RectTransform center; //内圈
    public float radius; //移动限制的半径

    private JoyStickData HandleEventData(PointerEventData eventData)
    {
    
    
        Vector2 dir;
        RectTransformUtility.ScreenPointToLocalPointInRectangle(bound,eventData.position,eventData.pressEventCamera,out dir);
        float r =dir.magnitude;
        dir =dir.normalized;
        r=Mathf.Clamp(r,0,radius);

        return new JoyStickData(dir,r);
    }
    public void OnDrag(PointerEventData eventData)
    {
    
    
        var data=HandleEventData(eventData);
        center.localPosition=data.GetPos();
        onJoystickMove(data.dir,data.radius);
    }

    public void OnPointerDown(PointerEventData eventData)
    {
    
    
        var data=HandleEventData(eventData);
        center.localPosition=data.GetPos();
        onJoystickDown(data.dir,data.radius);
        
    }

    public void OnPointerUp(PointerEventData eventData)
    {
    
    
        var data=HandleEventData(eventData);
        center.localPosition=Vector2.zero; //抬起后回到0坐标
        onJoystickUp(data.dir,data.radius);
    }
    public virtual void onJoystickDown(Vector2 V,float R)
    {
    
    

    }
    public virtual void onJoystickUp(Vector2 V,float R)
    {
    
    
        
    }
    public virtual void onJoystickMove(Vector2 V,float R)
    {
    
    
        
    }
}

（2）MoveJoyStick.cs //移动摇杆脚本，继承JoyStick

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

public class MoveJoyStick : JoyStick 
{
    
    
    public ActorController actorController;
    public override void onJoystickDown(Vector2 V, float R)
    {
    
    
        actorController.Move(V);
    }
    public override void onJoystickUp(Vector2 V, float R)
    {
    
    
        actorController.Move(Vector2.zero);
    }

    public override void onJoystickMove(Vector2 V, float R)
    {
    
    
        actorController.Move(V);
    }
}

(3)ActorController.cs //角色控制脚本

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

public class ActorController : MonoBehaviour
{
    
    
    private Vector2 moveDir;
    public float moveSpeed;
    public void Move(Vector2 dir)
    {
    
    
        moveDir = dir;
        
    }
    private void Update()
    {
    
    
        transform.Translate(moveDir * moveSpeed * Time.deltaTime);
    }
}

三、为物体添加脚本
（1）为Bound挂上MoveJoyStick.cs，并为其中变量赋值。
（2）为ActorController挂上ActorController.cs，并为MoveSpeed赋值。
运行成功，这样我们就实现了利用UGUI自己手写一个简单的摇杆，欢迎小伙伴们在评论区留言！