Unity UI射线检测 道具拖拽

通过PointerEventData和EventSystem实现UI的射线检测

**1.**调用IPointerClickHandler接口,实现方法

**2.**声明一个返回射线结果的List List<RaycastResult> result = new List<RaycastResult>();

**3.**向eventData的位置发射射线 EventSystem.current.RaycastAll(eventData, results);

4. 场景中只能有一个EventSystem,因为 EventSystem.current 会返回当前场景中的 EventSystem 实例

如何实现道具拖拽

1. 因为每次实现道具拖拽都是在背包中,所以先说背包实现的个人思路。创建很多格子在一个面板下,通过List<Img>Slots存储所有格子的img,调用List.Addrange方法,放入Content节点下的所有格子,这样我们就可以拿到格子的数量,并且Slots[i].Transform就可以代表预制体的父节点,将道具创建在这个格子下。在刷新的时候,通过foreach去便利该List,判断当他的childCount>0,调用DestroyImmediate立即清理掉每个格子下的子物体。

**2.**道具拖拽,调用三个接口IBeginDragHandler, IEndDragHandler, IDragHandler,实现方法

第一个是当移动时会调用一次

第二个是鼠标在拖动物品发生位置变化时每帧都会调用

第三个是松开时会调用一次

**3.**如果是按照上面的思路,我们在拖拽的时候会产生一个问题,因为格子的渲染层级问题,我们在拖拽道具的时候,是会被后渲染的格子挡住的,所以我们在拖拽的时候,应该将他放入一个渲染更靠后的Gameobject中即可。

**4.关键写法:**一般都是在面板中去for循环,调用子UI实例化,此时我们要把父节点传入子UI的初始化中。这样我们就可以通过transform.parent = lastParent = parent(传入的父节点)设置当前的父节点,并且记录当前的父节点。

**在IBeginDragHandler中:**Vector2记录当前UI所在的位置,如果道具拖拽到不必要的区域,自动归位的时候会用到,并且把该UI的父节点就可以设置为Gameobject了,这样拖拽的时候就不会被遮挡。

**在IDragHandler中:**拖拽过程中,我们需要让物体随着鼠标移动, rectTransform.anchoredPosition += eventData.delta;

eventData.delta代表了鼠标的位移量

**在IEndDragHandler中:**最关键的一步也就是松鼠标这里,这时候就可以用到之前记录的父节点了,然后我们根据需求去判断就可以了,比如物体合成,A物体和B物体的标签是否一致(如果射线检测的物体顺序不好控制,也可以先将A物体的标签在移动时就换了,在放置时再换回去);物体交换位置,那就通过C = A A = B B = C的方式交换;物体到了不该放的位置,调用Begin中记录的初始位置即可。

相关推荐
北极糊的狐1 天前
光标放在引入的xxx组件行(import { xxx } from ‘element-ui‘;)出现标黄,显示报错:无法解析符号 ‘xxx‘ 解决办法
ui
子春一1 天前
Flutter for OpenHarmony:构建一个 Flutter 习惯打卡应用,深入解析周视图交互、连续打卡逻辑与状态驱动 UI
flutter·ui·交互
我的xiaodoujiao1 天前
使用 Python 语言 从 0 到 1 搭建完整 Web UI自动化测试学习系列 44--将自动化测试结果自动推送至钉钉工作群聊
前端·python·测试工具·ui·pytest
avi91111 天前
Unity Data Excel读取方法+踩坑记;和WPS Excel的一些命令
unity·游戏引擎·excel·wps·data
UI设计兰亭妙微1 天前
UI 设计新范式:从国际案例看体验与商业的融合之道
人工智能·ui·b端设计
郁闷的网纹蟒1 天前
虚幻5---第12部分---蒙太奇
开发语言·c++·ue5·游戏引擎·虚幻
子春一1 天前
Flutter for OpenHarmony:构建一个 Flutter 天气卡片组件,深入解析动态 UI、响应式布局与语义化设计
javascript·flutter·ui
雨季6661 天前
Flutter 三端应用实战:OpenHarmony “极简文本行数统计器”
开发语言·前端·flutter·ui·交互
布兰妮甜1 天前
Photoshop中通过图层混合模式实现图像元素透明度渐变过渡的完整指南
人工智能·ui·生活·photoshop·文化
AIGCmitutu1 天前
Photoshop抠图插件2026选择指南,Ps抠图插件哪个好用?
人工智能·ui·ai绘画·photoshop·ps