UE4 二维地图的缩放与拖拽操作

最新推荐文章于 2025-05-31 11:01:54 发布
原创 最新推荐文章于 2025-05-31 11:01:54 发布 · 3k 阅读 · 32 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#ue4

这里写自定义目录标题

UE4 二维地图的缩放与拖拽操作

纯蓝图实现

拖拽和缩放

基础搭建

新建一个MainUI，CanvasPanel_Parent存放地图和CanvasPanel_Child，注意MainUI锚点为左上角，否则无法正确获取大小与位置，Map为要缩放和拖拽的地图，CanvasPanel_Child存放小图标，Map和CanvasPanel_Child锚点为铺满全屏，否则缩放会有问题，Image和TextBlock为固定ui，用来对比操作是否正确，不重要。
在这里插入图片描述

新建ChildUI，用做小图标，大小为20*20（可随意），只需要两张图片即可在这里插入图片描述

添加小图标

position为图标位置的二维数组，ChildUISizeHalf为子UI的大小的一半，这里为10*10。Icon Overlap为后续图标重叠的方法，暂时不需要连。
在这里插入图片描述

地图缩放

首先设置大小，Magnify布尔值判断是放大还是缩小，放大则为1.1倍，缩小则为0.9倍。总的限制在1-5倍，width为原视口宽，这里值1920，height为原视口高，这里值为1080。
在这里插入图片描述
然后因为大小改变了，需要调整CanvasPanel_Parent的位置，用scale来存储缩放的值方便后续使用。位置和大小的获取与计算都是为了以鼠标为中心进行放大，并且确保缩小后ui不会露出边界之外。
在这里插入图片描述
每次缩放调整了CanvasPanel_Parent之后，小图标的位置也需要更新，ChildUISizeHalf为小图标的一半大小，这里为10*10。
在这里插入图片描述

地图拖拽

两个方法即可
在这里插入图片描述
在这里插入图片描述

实现部分

在关卡蓝图调用MainUI对应方法
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

效果展示

在这里插入图片描述

小图标的重合显示

简单的以区域划分的方式重合，所以不会很自然。
在MainUI里面新建一个存放ChildUI数组的结构体，以及以vector2d为key，结构体为value的变量。
在这里插入图片描述在这里插入图片描述
创建用来确定缩放后小图标重叠的层级依据和范围大小的变量
在这里插入图片描述

下面是Icon Overlap方法的逻辑，TemporaryUI为ChildUI的数组
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在子UI里简单改一下颜色用来区分
在这里插入图片描述

最后在添加小图标之后和每次缩放之后调用
在这里插入图片描述
在这里插入图片描述

效果展示

在这里插入图片描述

曾强调说
关注
UE4蓝图制作场景小地图
zzzzz周绍辉的博客
09-24 4977
教程使用版本 4.16，工程文件请戳我。提示本教程参考于风之神韵，想要了解更多的UE4教程，请百度风之神韵。内容制作一个用于显示当前位置的小地图，使用的并不是摄像机，而是在二维图上进行移动。所以需要事先准备好一个和场景相差无几的图片。由于是移动二维图片，所以需要涉及到部分计算。1. 准备 首先，先将工程文件中BPTUTAD复制到自己的工程中的content文件夹下。 可以将做好的那一部分先行删除
UE4蓝图 控制物体移动缩放且不受帧率影响的方法
猹先生的瓜棚
09-02 3873
最近在做虚拟仿真相关场景的研究，之前使用过场动画驱动物体移动和缩放，现在需要使用外部数据驱动UE4关卡中的物体，于是参照在unity里的做法，将物体移动和缩放的方法放在Tick事件中，使用Delta Seconds作为基础参数乘以一个速度变量。在正常状态下运行良好，如果将鼠标切出窗口，帧率明显下降，代码执行也变慢了，物体移动固定长度的时间延长了。熟悉unity的可以得出UE4中Tick相当于unity的Update方法，易受到机器性能影响，但UE4中没有Unity的FixedUpdate类似的方法。还是尝试
Ue4 制作高端小地图的方法（非Capture2D）
gaofei7439的博客
09-29 1901
Ue4 制作高端小地图的方法（非Capture2D） 一，背景 在一些RPG 游戏中， 一般都需要增加的一个功能就是小地图。 角色在运动过程中，可以通过小地图看到当前的 全局地图以及 当前角色的相对位置。 二，种类 根据目前流出的教程， 基本上有两套教程可以参考。 方法一： 利用Capture2D 这是目前最快捷的一种方式，主要针对的是场景不复杂的情况。主要利用一个顶视图的效果来实现。基本原理可以等同于反射镜的制作流程。 1,创建一个 Capture2d 的蓝图。 BP_SceneCapture ; 我
UE4自适应小地图
05-23
UE4自适应小地图
地图交互基础：点、缩放和拖动的简易工具
最新发布
weixin_28931507的博客
05-31 912
Leaflet是一个开源的、易于使用的、轻量级的地图库。它专注于提供一个强大的基础，以便开发者可以在此基础上构建复杂的交互式地图。Leaflet以其简洁的API和强大的性能而受到开发者的喜爱。OpenLayers 是一个开源的 JavaScript 库，用于在网页上展示动态地图。它支持多种地图服务，例如 WMS、WFS、KML 等，并能提供丰富的地图操作功能。OpenLayers 的优势在于其高度的可定制性和扩展性，允许开发者通过插件或者自定义代码实现复杂的地图功能。
UE4 UMG 可拖动窗口 可缩放窗口
Fighter
01-09 7953
https://docs.unrealengine.com/latest/INT/Engine/UMG/HowTo/DragAndDrop/index.html 官方文档 十分详细地讲了怎么创建和使用可拖动窗口 https://pan.baidu.com/s/1bGNEpg 这是下载的人家的工程，可拖动可缩放窗口，模板实例，youtube上一位惊天地泣鬼神的大大友爱分享。 https:
eharts 地图实现拖拽和缩放
qq_45402495的博客
07-02 2425
为了解决这个问题我曾经尝试过使用geoIndex 想着把series的那层给丢掉直接指向geo的图层，但是这个方法会影响样式，之前是有两层的可以实现阴影的效果，但是现在只有一层是实现不了的。以上主要是对geotoam事件的监听，其中最重要也是我耗费时间最长的一部分就是要获取正确的option，并且这个option不是上文的直接使用的this.option，而是。到目前为止能实现的基本上就已经实现了，还有一个问题就是动画相关的拖动会出现的重影或卡顿问题，要加上。预计阅读时间为五分钟。为了拖拽和缩放不分层。
虚幻引擎UE4,UE5小地图制作 简单版
m0_65376116的博客
11-23 625
利用贴图进行的效率确实很高，而且简单。如果需要更换场景，只需调整参数和重新制作素材，但也有些繁琐。
UE4 鼠标拖拽图片
zhangmei126的博客
06-08 5674
1.设置一个小的UI（只有一张图片），一个可以拖拽的东西，比如背包里的武器2.在这个ui中重载两个方法（1）判断鼠标按下后是否有拖拽（2）拖拽过程中设置拖拽样式3.在内容浏览器中创建蓝图（拖拽的样式）4.在想要拖拽的UI中重载On Drop方法5.设置拖拽后放置的位置（为鼠标的位置）6.注意：因为鼠标在窗口中的位置是按左上角（0，0）为起点因此在需要拖拽的UI中，应该设置小UI（可拖拽）的锚点为左...
ue4 android 地图瓦片,UE4中地图功能的实现（利用相对位置RenderTarget的办法）
weixin_29664739的博客
05-29 1367
UE4中的小地图有很多种实现办法，但是现在网上的办法大多是人物头顶绑摄像机，这样的办法大多low而且低效，不适合作为正式的游戏功能使用，这里使用RenderTarget渲染2D图片的办法，通过获得人物/npc/物体在现实世界中的位置以及地图边界位置，算出在2D地图上的相对位置，从而更新2D图标在地图上的位置。需要用到RenderTarget(渲染目标)具体参考了这位老哥给出的项目中的做法，并做出了...
UE4 InteractiveToolsFramework研究
山中传奇工作室
10-07 1568
目录 一、框架总体结构 1) 交互框架（InteractiveToolsFramework） 2）工具系统（Tools, ToolBuilders, ToolManager） 3）输入接口（Input Behavior System） 4）小部件（Gizmos） 5）对象管理（SceneObjectsManager） 二、总体工作流程 三、编辑工具绘制 开发三维图形工具软件，开发者往往需要在Runtime模式下进行几何对象的交互编辑，如果完全从头开发难度非常巨大，我们可以通过UE4.26提
用鼠标滚轮控制图片的缩放
11-08
通过文本框TextBox里对鼠标滚轮的响应，来控制图片框的缩放。这个功能的实现是利用MouseWheel事件下，对MouseEventArgs.Delta属性的值的判断来进行的。
UE4触控屏手势输入SDK，单指点击，双指缩放，功能齐全
11-09
该工具适用于UE4的触控屏开发，单指，双指，点击缩放等等，功能齐全
【UE4_UE5触摸交互从入门到精通】：平移、旋转、缩放实现指南
本文综述了UE4/UE5环境下触摸交互的设计与实现，从基础交互机制到高级应用技巧，全面覆盖了触摸交互技术的各个层面。首先，介绍了平移、旋转和缩放三种基本触摸交互机制，并探讨了其理论基础、代码实现和性能优化...
ue4缩放区、改变缩放
m0_51808323的博客
12-29 4520
设置一个区域可以变大变小。 这次我们拉出一个立方体，来作为载体。 实际上就是设置缩放 当跳进立方体上时可以变换大小的倍数，变换的倍数为这颗球最初是本身的倍数，设置一倍则是复原为原来的大小 其他的中间内容全部和上一篇一样 ...
UE4自适应小地图制作
萌蛋蛋の博客
05-19 3825
注意角色方向就可以  只要修改上面2个变量即可
UE4/Unity绘制地图基础元素-面和体
腾讯位置服务
02-05 767
前言 基于UE4/Unity绘制地图基础元素-线（上篇） 基于UE4/Unity绘制地图基础元素-线（下篇） 搞定地图画线之后，接下来就是绘制面和体了： 面作为地图渲染的基本元素之一，在地图中可以代表各种形式的区域，例如海面、绿地等。面数据通常以离散点串形式存储，因此渲染时最关注的是如何将其展现为闭合的图形。 体可以理解为带有高度的面，在地图中代表各种建筑，通常是由其顶部面数据和高度数据处理得到。 本文记录了绘制面和体的流程以及解决闪烁问题的方案。 绘制多边形区域面 面数据通常以离散点串形式存储，面的绘制与
UE4 制作UI Button缩放效果
执手画眉弯的博客
09-11 7529
      UE4对于按钮本身按下去状态的padding只能让按钮内部元素产生位移，并不能真正的缩放，所以使用Animation来实现这个效果比较好。通过动画实现时候也有两种选择，一种是调节padding大小来实现，这种方法对于按钮内部元素的锚点会产生一定的变化，不太通用，使用起来相对麻烦，第二种是直接调节Transform中的Scale大小来实现，这种就相对简单而且效果也OK。      在下...
UE4鼠标滚轮控制镜头缩放
weixin_44840850的博客
07-01 5282
蓝图： 因为其实实现起来比较简单，所以直接上蓝图： 主要是用到了UE4的鼠标滚轮操作映射，每当滑动鼠标滚轮的时候就会传出一个数值，有正有负有0，然后将角色的相机摇臂组件拖进蓝图，获取其中的Target Arm Length变量加上一个数值再重新设置该变量就能改变摄像机距离玩家的远近实现镜头拉近拉远的效果了。 ...
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值