UE5功能杂项从UI中拖拽物体方法2(下篇)
目标:UE5在Runtime下现实UI拖拽三维物体Actor,拖拽时生成Actor物体步骤1。蓝图函数库
接着上面工程,因为射线检测使用的比较多,所以我们创建一个蓝图函数库把射线检测代码封装到新建函数LineTrace中,给他一个返回值Location
步骤2。优化WBPDragUI代码
顺便使用LineTrace优化WBPDragUI射线检测代码,如下
步骤3。在WBPDragActor重写OnMouseButtonDown事件
1:在WBPDragActor重写OnMouseButtonDown事件
2:增加鼠标左键检测
3:根据鼠标左键拖拽的位置产生射线,并且返回射线射到的位置调用SpawnActorBPCube
4:新生成的Actor我们使用变量BPCube存起来,新增变量BCanMove用来控制拖拽结束后BPCube物体停止跟随移动。
步骤4。在WBPMain重写OnMouseMove实现物体跟随鼠标射线移动
1:在WBPMain重写OnMouseMove实现物体生成后跟随鼠标移动
2:根据鼠标的位置调用我们封装的LineTrace函数产生射线在3D场景结束点的位置,并且把这个位置给到上面创建的BPCube。
步骤5。鼠标谈起结束拖拽
1:同样的方法在WBPMain重写OnMouseButtonUp处理拖拽结束,首先WBPDragActor的BCanMove设置为false,但是经过测试发现在第一次拖拽的时候,3D场景会跟随移体验不好,目前采用解决方案是在拖拽的时候,限定交互只在UI,所以我们回到WBPDragActor的OnMouseButtonDown函数中在刚开始进行拖拽的时候,鼠标交互锁定在UI上。
2:在拖拽结束后,也就是WBPMain的OnMouseButtonUp函数中回复对UI和游戏场景的交互
步骤6。最后处理拖拽移动的范围
由于在WBPMain重写的事件都是针对WBPMain的UI范围的,所以我们如果想在整个屏幕中进行拖拽,就需要为WBPMain增加一个全屏的底图,
1:这里我们新增一个Image,
2:把Image的着色改成透明
3:Image的ZOrder改成1确保在最下方
好了,我们本期要做的就这么多,看一下效果吧
至此两种方式的拖拽都已经实现,体验较流畅!
最后补充说明一下,方法1拖拽UI采用的检测拖拽的OnDragDetected函数,通过创建CreateDragDropOperation节点让新创建的UI跟随载体移动
能不能用来实现方法2的Actor物体移动哪?答案是不能的,因为CreateDragDropOperation节点中能控制的DefaultDragVisual必须是Widget类型的,也就是说这个节点是针对UI的,所以方法1可以用,方法2不能直接使用,一种方式是自己实现节点可以直接Actor物体移动,另一种就是把跟随鼠标移动的功能自己实现,本文就是在WBPMain中通过重载OnMouseButtonDown实现的,当然这种方法也有个小局限就是WBPMain限制了移动范围。
好了这一期就到这里了,希望对你有所帮助!辛苦之至,希望点赞支持一下!