Unity中零基础实现人物控制摇杆（下篇）

   上篇：（可供使用）下篇：（供学习者学习）

摇杆素材：
https://pan.baidu.com/s/1FdcLgPvvUIft7CWbHpmLbQ
提取码：22z9

UI阶段

步骤：
1.在Canvas下新建一个GameObject(空物体),命名为LeftButtomPin,锚点设置为左下，默认大小即可。
2.在LeftButtomPin下新建一个 image,将该 image 命名为 imgTouch，透明度设为0，宽高自己设置（推荐：Pox:200,Pox:165 Poz:0 Width:400 Height:330），作用：摇杆点击的触碰。
3.在 imgTouch 新建一个image,命名为 imgDirBg ,将摇杆背景赋给 imgDirBg. 大小自己设置。（后期会用到,这里本人是 Width 150 Height 150 ）
4.在imageDirBg 下新建一个image ,命名为 imgDirPoint. 大小自己设置。（后期会用到,这里本人是 Width 50Height 50）
效果图：

代码阶段

代码脚本请按顺序复制粘贴。
新建第一个脚本：命名为PEListener, 用于监听按钮的触碰，不用挂给物体，此脚本为工具脚本

using System;
using UnityEngine;
using UnityEngine.EventSystems;
public class PEListener : MonoBehaviour, IPointerDownHandler, IPointerUpHandler, IDragHandler
{public Action<PointerEventData> onClickDown;  //监控按下的操作public Action<PointerEventData> onClickUp;   //监控抬起的操作public Action<PointerEventData> onDrag;     //监控按下拖拽的操作// 按下后会调用此方法,eventData 是所返回的参数,会反馈摇杆点的位置,方向信息.public void OnPointerDown(PointerEventData eventData){if (onClickDown != null){onClickDown(eventData);}}public void OnPointerUp(PointerEventData eventData){if (onClickUp != null){onClickUp(eventData);}}public void OnDrag(PointerEventData eventData){if (onDrag != null){onDrag(eventData);}}
}

新建第二个脚本：命名为WindowRoot, 用于监听按钮的触碰，不用挂给物体，此脚本为工具脚本

using System;
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.EventSystems;public class WindowRoot : MonoBehaviour
{// 判断物体身上有没有摇杆组件
//   where T:Component 限定条件， 必须保证当前T的参数是 Component 的子类               protected T GetTOrAddComponect<T>(GameObject go) where T:Component{T t = go.GetComponent<T>();// 如果物体身上没有,则获取if (t == null) {t = go.AddComponent<T>();}return t;}#region Click Evtsprotected void OnClickDown(GameObject go,Action<PointerEventData> cb) {PEListener listener = GetTOrAddComponect<PEListener>(go);listener.onClickDown = cb;}protected void OnClickUp(GameObject go, Action<PointerEventData> cb){PEListener listener = GetTOrAddComponect<PEListener>(go);listener.onClickUp = cb;}protected void OnDrag(GameObject go, Action<PointerEventData> cb){PEListener listener = GetTOrAddComponect<PEListener>(go);listener.onDrag = cb;}#endregionprotected void SetActive(Image img, bool state = true){img.transform.gameObject.SetActive(state);}
}

新建第三个脚本：命名为Constants , 用于监听按钮的触碰，不用挂给物体，此脚本为工具脚本

public class Constants
{//屏幕标准宽高// 屏幕标准宽高 就是Canvas 的宽高public const int ScreenStandardWidth = 1334;public const int ScreenStandardHeight = 750;//摇杆点标准距离public const int ScreenOPDis = 65;
// 摇杆点的标准距离  也就是将摇杆点拖拽至摇杆背景边界时,摇杆点的 Pos Y 值;
// 这个值取决于 摇杆背景 和 摇杆点的大小
}

新建第四个脚本：命名为MainWnd, 赋给Canvas.

using UnityEngine;
using UnityEngine.EventSystems;
using UnityEngine.UI;
public class MainWnd : WindowRoot
{public Image imgTouch;    //触碰背景public Image imgDirBg;    //摇杆背景public Image imgDirPoint;  //摇杆点private float pointDis;   //自适应摇杆位置private Vector2 startPos = Vector2.zero; //摇杆点起始位置private Vector2 defaultPos = Vector2.zero;//摇杆点的初始位置private void Awake(){InitWnd();}private  void InitWnd(){pointDis = Screen.height * 1.0f / Constants.ScreenStandardHeight * Constants.ScreenOPDis; //当前屏幕实际的高度/标准屏幕高度*在标准情况下,摇杆点和摇杆背景间的长度defaultPos = imgDirBg.transform.position; //摇杆点的初始位置为 当前图片的位置SetActive(imgDirPoint, false);  //隐藏摇杆点RegisterTouchEvts();}public void RegisterTouchEvts(){OnClickDown(imgTouch.gameObject, (PointerEventData evt) => {startPos = evt.position;  // 按下时刻赋值摇杆点起始位置SetActive(imgDirPoint, true);   //按下去瞬间 激活摇杆点imgDirBg.transform.position = evt.position;});OnClickUp(imgTouch.gameObject, (PointerEventData evt) => {imgDirBg.transform.position = defaultPos; //手指抬起后,摇杆点的位置等于摇杆点的初始位置SetActive(imgDirPoint, false);  //手指松开后，隐藏摇杆点imgDirPoint.transform.localPosition = Vector2.zero; //摇杆点的位置复原 默认为0//TODO 方向信息Debug.Log(Vector2.zero);  //Vector.zero  没有方向});OnDrag(imgTouch.gameObject, (PointerEventData evt) => {Vector2 dir = evt.position - startPos;  //拖拽的向量 当前位置-初始位置（初始位置也就是按下时的位置）float len = dir.magnitude;if (len > pointDis){//  把这个方向长度 限制距离  (最小值,最大值)Vector2 clampDir = Vector2.ClampMagnitude(dir, pointDis);imgDirPoint.transform.position = startPos + clampDir; //当前的摇杆点位置 = 开始按下位置 + 方向向量限制完成后偏移的一个量}else{// 如果拖拽过程在摇杆背景内，则直接等于该距离imgDirPoint.transform.position = evt.position;}//TODO 方向信息Debug.Log(dir.normalized);  //Vector.zero  没有方向});}
}

最终效果图：