Unity 模拟百度地图,使用鼠标控制图片在固定区域内放大、缩小、鼠标左键拖拽移动图片

效果展示:

步骤流程:

1.使用的是UGUI,将下面的脚本拖拽到图片上即可。

cs 复制代码
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.EventSystems;

public class CheckImage : MonoBehaviour, IDragHandler, IBeginDragHandler, IEndDragHandler, IPointerEnterHandler, IPointerExitHandler
{
    public float MaxRange = 5f;
    public float MinRange = 0.5f;
    private Vector3 offPos;
    private Vector3 arragedPos;
    private bool isEnter = false;
    private bool isDrag = false;

    void Update()
    {
        if (!isEnter) return;
        if (!isDrag)
        {
            SetPivotAndPos();
            if (Input.GetAxis("Mouse ScrollWheel") > 0)
            {
                transform.localScale += (transform.localScale.x >= MaxRange ? Vector3.zero : Vector3.one * 0.1f);
            }
            else if (Input.GetAxis("Mouse ScrollWheel") < 0)
            {
                transform.localScale -= (transform.localScale.x <= MinRange ? Vector3.zero : Vector3.one * 0.1f);
            }
        }
    }

    public void OnBeginDrag(PointerEventData eventData)
    {
        isDrag = true;
        if (RectTransformUtility.ScreenPointToWorldPointInRectangle(transform.GetComponent<RectTransform>(), Input.mousePosition, null, out arragedPos))
        {
            offPos = transform.position - arragedPos;
        }
    }

    public void OnDrag(PointerEventData eventData)
    {
        transform.position = offPos + Input.mousePosition;
    }

    public void OnEndDrag(PointerEventData eventData)
    {
        transform.position = offPos + Input.mousePosition;
        isDrag = false;
    }

    public void OnPointerEnter(PointerEventData eventData)
    {
        isEnter = true;
    }

    public void OnPointerExit(PointerEventData eventData)
    {
        isEnter = false;
    }

    private void SetPivotAndPos()
    {
        float OffsetX = Input.mousePosition.x - transform.position.x;
        float OffsetY = Input.mousePosition.y - transform.position.y;

        float PivotX = OffsetX / transform.GetComponent<RectTransform>().rect.width / transform.localScale.x;
        float PivotY = OffsetY / transform.GetComponent<RectTransform>().rect.height / transform.localScale.y;

        transform.GetComponent<RectTransform>().pivot += new Vector2(PivotX, PivotY);
        transform.localPosition += new Vector3(OffsetX, OffsetY, 0);
    }
}

2.再给图片的父物体添加个Mask遮罩就ok了。

相关推荐
qq_170264751 天前
unity升级对ab变更的影响
unity·游戏引擎
AA陈超1 天前
虚幻引擎5 GAS开发俯视角RPG游戏 P05-04 使用效果应用游戏标签
c++·游戏·ue5·游戏引擎·虚幻
不伤欣1 天前
Unity Mask镂空效果(常用于新手引导或高亮显示UI元素)
游戏·ui·unity·游戏引擎
zhangzhangkeji2 天前
cesium126,230217,Pixel Streaming in Unreal Engine 像素流 - 1 基本概念:
游戏引擎·虚幻
AA陈超3 天前
虚幻引擎UE5专用服务器游戏开发-33 在上半身播放组合蒙太奇
c++·游戏·ue5·游戏引擎·虚幻
软泡芙3 天前
【Unity】HybridCLR:原生C#热更新革命
unity·游戏引擎
AA陈超3 天前
虚幻引擎5 GAS开发俯视角RPG游戏 P05-05 游戏效果委托
c++·游戏·ue5·游戏引擎·虚幻
大Mod_abfun3 天前
Unity游戏基础-5(一些细节)
游戏·unity·游戏引擎
wan5555cn3 天前
Windows 11系统鼠标键盘被禁用问题的全面解决方案
windows·笔记·深度学习·计算机外设
AA陈超3 天前
虚幻引擎5 GAS开发俯视角RPG游戏 P04-12 可缩放浮点数的曲线表
c++·游戏·ue5·游戏引擎·虚幻