弹幕怎么做视频网站,wordpress 云标签小工具,做presentation的网站,网站经营网络备案信息一、前言 本文使用的虚幻引擎5.3.2#xff0c;继点击场景3D物体的两种处理方式的基础完成对3D物体的点击触发后#xff0c;我们需要制作一个可以弹窗显示该物体信息的UI面板#xff0c;同时保证弹窗可以跟随物体。另外还讲了一种UI上的悬浮提示跟随弹窗。
二、实现
2.1、创…一、前言 本文使用的虚幻引擎5.3.2继点击场景3D物体的两种处理方式的基础完成对3D物体的点击触发后我们需要制作一个可以弹窗显示该物体信息的UI面板同时保证弹窗可以跟随物体。另外还讲了一种UI上的悬浮提示跟随弹窗。
二、实现
2.1、创建一个弹窗UI创建一个如图2.1.1所示的UI主要包含一个显示信息的文本和一个处理的 标题 按钮。将按钮的“是变量”勾选上。
2.2、 创建目标物体变量在图表中创建一个点击场景3D物体的两种处理方式创建的蓝图物体变量并后勾选其“可编辑实例”在按钮的点击事件创建一个处理方法比如销毁物体或者关闭弹窗等。如图2.2.1所示的蓝图 图2.2.1 点击按钮时先判断是否有效这是一个容错率高的处理方式。文本直接绑定“目标物体”的名字。 图2.2.2 2.3、在点击场景3D物体的两种处理方式的点击物体处理事件中创建弹窗如图2.3.1所示在创建弹窗后将自身传给目标物体 图2.3.1 通过这种方式将点击的物体传递给弹窗UI并显示该物体的信息如图2.3.2所示此时的弹窗只 图2.3.2 能显示在左上角“蓝色3”即点击目标物体的名字。点击销毁目标可以将3D物体和UI一起销毁。
2.4、让弹窗显示在3D物体所在的位置在添加到视口后面增加“设置视口的位置“蓝图如图2.4.1 图2.4.1 所示获取玩家控制器中的”Project world to Screen方法将此时物体的位置转换成屏幕位置。
但是此时的弹窗只是在点击时出现在物体位置镜头转动就不会在物体的位置我们还需要做到跟随物体的运动而动。
2.5、弹窗跟随3D物体在点击场景3D物体的两种处理方式的自定义蓝图Actor中新建“控件组件”如图2.5.1所示将控件类 图2.5.1 设置为“弹窗”默认的空间为场景此时在视口或场景中可以看到物体上面都有一个“弹窗”控件绑定在物体上。空间中有两种设置分别为场景和屏幕。这个概念和Unity的Canvas的3D world和2D 视图有点类似。
1场景即固定在场景中成为3D场景的一部分摄像机绕到弹窗后面还有可能会看不到弹窗
如图2.5.2所示此时的弹窗说是UI其实更像是一个3D的面板 图2.5.2 2屏幕这个设置会一直跟随物体的位置并始终显示正面在屏幕上无论摄像机怎么转都会显示在物体的位置屏幕处。
2.6、UI弹窗和3D弹窗关联设置了弹窗后发现UI上的文本不能显示3D物体的信息。怎么讲信息进行关联并将信息传递给UI弹窗了。如图2.6.1所示在“自定义蓝图Actor”的开始事件中将此时的 图2.6.1 控件转换成“弹窗”并赋值自己给“弹窗”的“目标物体”。这样弹窗中的文本和点击事件才能有效使用。
2.7、增加点击3D物体开关上面完成的弹窗是一开始就显示在屏幕上在蓝图中增加开关处理弹窗的可视性如图2.7.1所示可实现点击开再点击即关闭的效果。然后将弹窗默认可视性设置为false。 图2.7.1 2.8、UI的Tips弹窗
1文本提示跟随随便选中一个UI控件在其“高级-工具提示文本”中创建绑定如图2.8.1所示 图2.8.1 绑定一个变量或者其他数值在鼠标悬浮在该按钮时即可弹窗显示预设的内容。
2随便选中一个UI控件在其“高级-工具提示控件”中创建一个提示绑定如图2.8.2所示在事件 图2.8.2 处理时创建一个预设的UI控件作为弹窗t如图2.8.3所示这里创建的UI无需额外处理添加视口和销毁等操作应该时虚幻自处理这部分销毁。 图2.8.3 2.9、UI的可视性上述设置中用到了UI的“可视性”这个属性如图2.9.1所示在UI细节面板中可以 图2.9.1 看到可视性有如下几种类型
1可视顾名思义即可以显示并且也可交互。
2已折叠和隐藏不可见也不可交互。
3非命中测试可见但是不能交互并且如果该UI的ZOrder在别的UI前面时点击该UI可以穿透点击后面的UI组件。
三、总结
3.1、弹窗的空间设置为“场景”和“屏幕”是有区别的“场景”会成为3D物体的一部分“屏幕”会一直跟随显示在屏幕上。
3.2、UI的几种可视性交互区别。
