UnityUI在屏幕范围内拖拽

一、单个Image拖拽

using UnityEngine;

using UnityEngine.EventSystems;

public class Draggable : MonoBehaviour, IBeginDragHandler, IDragHandler, IEndDragHandler

{

    private RectTransform rectTransform;

    private RectTransform canvasRectTransform;

    private Vector2 canvasSize;

    void Start()

    {

        rectTransform = GetComponent<RectTransform>();

        canvasRectTransform = rectTransform.parent.GetComponent<RectTransform>();

        canvasSize = canvasRectTransform.rect.size;

    }

    public void OnBeginDrag(PointerEventData eventData)

    {

        // 可以记录开始拖拽时的位置，如果需要的话

    }

    public void OnDrag(PointerEventData eventData)

    {

        // 计算新的位置

        Vector2 newPosition = rectTransform.anchoredPosition + eventData.delta;

        // 获取Image的尺寸

        Vector2 imageSize = rectTransform.rect.size;

        // 限制拖拽在Canvas范围内

        // 限制x轴

        newPosition.x = Mathf.Clamp(newPosition.x, -canvasSize.x / 2 + imageSize.x / 2, canvasSize.x / 2 - imageSize.x / 2);

        // 限制y轴

        newPosition.y = Mathf.Clamp(newPosition.y, -canvasSize.y / 2 + imageSize.y / 2, canvasSize.y / 2 - imageSize.y / 2);

        // 设置新的位置

        rectTransform.anchoredPosition = newPosition;

    }

    public void OnEndDrag(PointerEventData eventData)

    {

        // 可以在这里处理拖拽结束的逻辑

    }

}

单个Image拖拽

二、拖拽子Image

using UnityEngine;

using UnityEngine.EventSystems;

public class Draggable : MonoBehaviour, IBeginDragHandler, IDragHandler, IEndDragHandler

{

    public RectTransform smallImageRect; // 小Image的RectTransform

    private RectTransform largeImageRect; // 大Image的RectTransform，即脚本所在的RectTransform

    private RectTransform canvasRect; // Canvas的RectTransform

    void Start()

    {

        largeImageRect = GetComponent<RectTransform>();

        canvasRect = largeImageRect.parent as RectTransform; // 假设大Image直接在Canvas下

    }

    public void OnBeginDrag(PointerEventData eventData)

    {

        // 可以在这里添加开始拖拽的逻辑

    }

    public void OnDrag(PointerEventData eventData)

    {

        // 计算小Image相对于大Image的拖拽增量

        Vector2 delta = eventData.delta / canvasRect.localScale.x; // 考虑Canvas的缩放

        // 更新大Image的位置，使得小Image跟随拖拽

        Vector2 newPosition = largeImageRect.anchoredPosition + delta;

        largeImageRect.anchoredPosition = ClampPositionToBounds(newPosition);

    }

    public void OnEndDrag(PointerEventData eventData)

    {

        // 可以在这里添加结束拖拽的逻辑

    }

    private Vector2 ClampPositionToBounds(Vector2 newPosition)

    {

        // 计算大Image的边界

        Vector2 minPosition = new Vector2(

            -canvasRect.rect.width / 2 + largeImageRect.rect.width / 2,

            -canvasRect.rect.height / 2 + largeImageRect.rect.height / 2

        );

        Vector2 maxPosition = new Vector2(

            canvasRect.rect.width / 2 - largeImageRect.rect.width / 2,

            canvasRect.rect.height / 2 - largeImageRect.rect.height / 2

        );

        // 限制大Image的位置，确保它不会超出Canvas的范围

        newPosition.x = Mathf.Clamp(newPosition.x, minPosition.x, maxPosition.x);

        newPosition.y = Mathf.Clamp(newPosition.y, minPosition.y, maxPosition.y);

        return newPosition;

    }

}

拖拽子Image

三、拖拽吸附边缘

using UnityEngine;

using UnityEngine.EventSystems;

public class Draggable : MonoBehaviour, IBeginDragHandler, IDragHandler, IEndDragHandler

{

    public RectTransform smallImageRect; // 小Image的RectTransform

    private RectTransform largeImageRect; // 大Image的RectTransform，即脚本所在的RectTransform

    private RectTransform canvasRect; // Canvas的RectTransform

    void Start()

    {

        largeImageRect = GetComponent<RectTransform>();

        canvasRect = largeImageRect.parent as RectTransform; // 假设大Image直接在Canvas下

    }

    public void OnBeginDrag(PointerEventData eventData)

    {

        // 可以在这里添加开始拖拽的逻辑

    }

    public void OnDrag(PointerEventData eventData)

    {

        // 计算小Image相对于大Image的拖拽增量

        Vector2 delta = eventData.delta / canvasRect.localScale.x; // 考虑Canvas的缩放

        // 更新大Image的位置，使得小Image跟随拖拽

        Vector2 newPosition = largeImageRect.anchoredPosition + delta;

        largeImageRect.anchoredPosition = ClampPositionToBounds(newPosition);

    }

    public void OnEndDrag(PointerEventData eventData)

    {

        // 可以在这里添加结束拖拽的逻辑

        if (largeImageRect.anchoredPosition.x < 0)

        {

            // 吸附到左侧边缘

            largeImageRect.anchoredPosition = new Vector2(-canvasRect.rect.width / 2 + largeImageRect.rect.width / 2, largeImageRect.anchoredPosition.y);

        }

        else

        {

            // 吸附到右侧边缘

            largeImageRect.anchoredPosition = new Vector2(canvasRect.rect.width / 2 - largeImageRect.rect.width / 2, largeImageRect.anchoredPosition.y);

        }

}

    private Vector2 ClampPositionToBounds(Vector2 newPosition)

    {

        // 计算大Image的边界

        Vector2 minPosition = new Vector2(

            -canvasRect.rect.width / 2 + largeImageRect.rect.width / 2,

            -canvasRect.rect.height / 2 + largeImageRect.rect.height / 2

        );

        Vector2 maxPosition = new Vector2(

            canvasRect.rect.width / 2 - largeImageRect.rect.width / 2,

            canvasRect.rect.height / 2 - largeImageRect.rect.height / 2

        );

        // 限制大Image的位置，确保它不会超出Canvas的范围

        newPosition.x = Mathf.Clamp(newPosition.x, minPosition.x, maxPosition.x);

        newPosition.y = Mathf.Clamp(newPosition.y, minPosition.y, maxPosition.y);

        return newPosition;

    }

}

拖拽吸附边缘