【UE 控件蓝图】制作一个指南针

本文详细描述了如何在虚幻引擎中制作图片素材,如圆形、三角形,并利用它们实现一个简单的指南针功能。步骤包括创建图像控件、设置动态旋转以及在第三人称模板工程中集成。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

目录

效果

步骤

一、制作图片素材

二、实现指南针功能


效果

可以看到右上角的指南针一直会指向方块(北极点) 。

步骤

一、制作图片素材

打开PS,新建一个800*800尺寸的文档

新建一个图层,创建一个半径为500像素的圆,圆心为画布中心

Alt+Delete填充前景色

如果感觉圆小了可以Ctrl+T缩放一下

再新建一个图层,用矩形工具款选一个500*25的区域,然后填充为白色

复制一份图层,Ctrl+T,设置旋转角度为90°

添加文字

如果要修改字体可以打开字符面板来修改

将当前图像导出。然后再新建一个800*800的文档,创建一个三角形

填充为红色

复制一份图层,Ctrl+T旋转180°后填充为蓝色,最后选中这两个图层将位置设置在画布中心

最后导出png。

二、实现指南针功能

打开虚幻编辑器,创建一个第三人称模板工程,将步骤一中制作的两个图片素材导入

新建一个控件蓝图

添加一个画布面板和两个图像控件

设置一下控件位置和显示图像

新建一个Actor蓝图,该蓝图只添加一个静态网格体组件,用于表示北极点

放入场景中

打开第三人称角色蓝图,在蓝图事件开始运行时创建控件蓝图并添加到视口,再获取北极点的位置

每一帧去设置指南针应该旋转的角度

最终效果如下:

相关文章链接:

https://zhichao.blog.csdn.net/article/details/135837781?spm=1001.2014.3001.5502

参考视频:

https://www.bilibili.com/video/BV19T4m1U7vk/?spm_id_from=333.999.0.0&vd_source=36a3e35639c44bb339f59760641390a8

<think>好的,用户现在想在Cesium for UE中实现或配置指北针功能。我需要先理解用户的需求,然后根据提供的引用内容来给出解决方案。 首先,查看用户提供的引用内容。引用[1]提到在普通的Cesium.js中,需要通过安装cesium-navigation-es6插件来添加指南针、比例尺等功能。而引用[2]则是在UE中实现指北针效果的步骤,包括设计Widget、实时更新方向等。用户的问题是关于Cesium for UE的,所以应该主要参考引用[2]的内容,因为UE和Cesium for UE的环境更相关。 接下来,我需要确定Cesium for UE是否内置了指北针功能。根据引用[1],原生的Cesium.js没有指南针,需要插件。而Cesium for UE可能也类似,可能没有现成的组件,需要自己实现。引用[2]中的UE实现方法可能适用,但需要结合Cesium for UE的API。 用户的需求是在Cesium for UE中添加指北针,所以步骤可能包括创建UMG Widget,获取相机的旋转角度,计算偏航角,并实时更新Widget的旋转。引用[2]中的蓝图逻辑是关键,特别是如何从Cesium获取相机的Heading(Yaw)信息。 需要注意的是,Cesium for UE中的地理坐标系可能与普通UE项目不同,所以获取相机方向的方法可能需要调整。比如,CesiumGeoreference组件可能涉及坐标转换。因此,在步骤中可能需要通过CesiumCamera或CesiumGeoreference来获取正确的方向数据。 另外,引用[2]中提到UE中的Yaw为0指向东方,而指北针需要将Yaw调整为-90度。在Cesium for UE中,可能需要确认相机的Heading定义是否相同,或者是否需要使用Cesium的API来获取地理方向的Heading。 总结解决方案的步骤:1. 创建UMG Widget设计指北针界面;2. 在Widget蓝图中通过Event Tick实时获取相机旋转;3. 计算正确的旋转角度并应用到Widget;4. 添加到视口显示。同时需要注意Cesium for UE中坐标系的处理,可能需要使用Cesium的相关函数来获取准确的Heading值。 此外,是否需要考虑地理坐标系与UE本地坐标的转换?比如,使用CesiumGeoreference的转换函数来确保方向的正确性。这部分可能需要查阅Cesium for UE的文档,确认如何获取相机的经纬度方向,或者直接使用UE的相机旋转数据,但需要调整计算方式。 最后,验证步骤是否正确,确保指北针能正确反映相机的地理朝向,可能需要测试在不同方向下的旋转是否正确,比如向北时Widget的指针指向0度,向东时指向90度等。</think>在Cesium for UE中实现指北针功能需要结合Unreal Engine的UMG控件系统和Cesium地理空间坐标系,以下是具体实现步骤: ### 一、创建指北针UMG控件 1. 新建**Widget Blueprint**,命名为`BP_Compass` 2. 设计界面元素: - 添加圆形底图作为方位盘 - 添加文本"N"标识北方 - 创建箭头图像作为指针 3. 设置指针的**Render Transform**属性允许旋转 ### 二、获取地理方向数据 通过Cesium地理坐标系获取相机方位: ```cpp // 获取CesiumGeoreference实例 ACesiumGeoreference* Georeference = GetCesiumGeoreference(); // 获取相机地理坐标 FCesiumGeoreferenceCamera CameraGeoData = Georeference->GetPawnGeoreferenceCamera(GetWorld()->GetFirstPlayerController()->GetPawn()); // 获取偏航角(Yaw) float Heading = CameraGeoData.Heading; ``` ### 三、实时更新逻辑 在Widget蓝图中添加**Event Tick**节点: 1. 获取当前相机变换: ```cpp APlayerCameraManager* CameraManager = UGameplayStatics::GetPlayerCameraManager(GetWorld(), 0); FRotator CameraRotation = CameraManager->GetCameraRotation(); ``` 2. 坐标系转换计算: $$ \text{指针角度} = (-\text{Yaw} - 90) \mod 360 $$ 3. 设置控件旋转: ```cpp // 在Widget蓝图中设置图像旋转 CompassImage->SetRenderTransformAngle(ComputedAngle); ``` ### 四、坐标系注意事项 Cesium for UE使用**东-北-上(ENU)**坐标系[^2],需注意: 1. UE默认Yaw=0指向东方 2. 真实北方对应Yaw=-90° 3. 需要补偿地理坐标与引擎坐标的差异 ### 五、完整实现流程 1. 创建`BP_Compass`控件 2. 在关卡蓝图中实例化控件: ```cpp UUserWidget* CompassWidget = CreateWidget<UUserWidget>(GetWorld(), BP_Compass); CompassWidget->AddToViewport(); ``` 3. 绑定相机方向更新事件 ### 六、性能优化建议 1. 降低Tick频率至0.1秒 2. 使用地理坐标系变化事件代替持续轮询 3. 启用控件渲染的LOD优化 [^1]: Cesium地理坐标系采用WGS84标准,方向计算需考虑椭球体曲率 [^2]: UE默认使用左手坐标系,需注意与Cesium坐标系的转换
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Zhichao_97

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值