UMG————拖拽

**

UMG 中拖拽的功能

**

**背景：**UMG 中要实现拖拽。我想做一个拖拽图标放在新的位置的功能。

重要的蓝图节点记录：

1，OnDrop： 检测鼠标按键松开的事件

这是一个鼠标按住之后松开的事件。可以理解为 松开鼠标的时候， 鼠标对应的位置 的事件。
这是一个非常有意思的蓝图节点。一定也好注意，在你松开鼠标的时候，你的鼠标 下面对应的是哪个是slot ,就在哪个slot 中调用这个函数。 比如 你从2号位 拖动图标到三号位。 你在2号位置 执行了 on mouse down 和 On Drag Detected。 但是当你在3号位置松开的时候， 就在3号位置对应的 slot 执行了 on drop 函数。

2，On mouse Button Down 检测鼠标按下的事件

这个事件 针对拖拽 可以搭配 另外一个节点一起使用。

搭配的节点： Detect Drag if pressed 。 可以理解为一个绑定的事件。如果在鼠标按下的时候 ，发生了拖拽，就会触发 On Drag Detect 事件。

3， On Drag Detected ： 检测拖拽功能

这个蓝图节点也是经常搭配一个 节点： 创建 Drag Drop Operation


Drag Drop Operation : 可以理解为一个 拖拽的对象。我们可以从这个对象中获取一些信息。上图直接把这个拖拽的信息赋值给了 Operation , 这样就可以在 Operation 里面获取拖拽的信息了。
PayLoad: 可以理解为负载，或者要传递的数值。此处用的是 self 。意思就是当前点击开始或者拖拽的时候 对用的 slot 的所有的变量信息。
default Drag Visual : 默认进行拖拽时，显示的画面。就是拖拽时鼠标的显示图片。 比如你从一个正方体区域拖拽，鼠标上显示的是一个 小猫的头。

4， 废话少说 show me the code。 从一个框内的图标拖到另外一个框内的效果实现

(1) 重建Inventory 库存的UMG WBP_Inventory

设置两个 Horizontal , 然后 填充了 6个 slot

为了 对这些 slot 进行区别， 我们 对每一个slot 里面的 Slot Index 的初始默认值进行设置。
上面一排 0-5
下面一排 6-11

（2）对框 进行初始赋值

上面的一排框， 初始状态应该按照我们设定的顺利，排上特定的图案。

在UMG 的 初始化过程中

将 Inventory 里面存储的 Item 按照顺利 ，对 UMG slot 中的 item 进行赋值。

Inventory 这个数组，我们放置在GameMode 中，
GameMode:

箭头部分的序号有特定的作用。除了排序之外，我们在原来的 BPItem 中 设定了 Texture 数组的选择列表。 其中有空白贴图的情况。所以 可以通过Index 可以控制 Inventory 中的 item 有的有贴图，有的没有贴图。

BP_item

我想做的事情

（1）0-5 里面的图标可以直接拖动到 6-11 里面。 0-5 之间的图标互相拖动，是无法实现位置互换的： 3和4 是无法位置互换的。

（2）上面的一排可以任意拖动到 6-11 的 槽点里面
（3）6-11 之间 任意两个有图标的是可以互相拖拽互换的。
（4）对于6-11 之间 。只能将图标拖动到空白的槽点或者 两个图标互换位置
（5）对6-11 上的任意一个槽点。双击 可以让 该槽点 变成空白的

剩下关键的逻辑 都在 inventory-Slot——UMG 中进行逻辑构建：

On Drop 函数 重载： 实现 所有的位置互换。
关键点：

（1）每一个slot 都有一个变量 Slot Index , 这个是每一个slot 的身份ID 。 剩下的就是针对这个ID 的逻辑操作。

双击事件：

有一个事件 On mouse Button Double Click ：

在双击的时候，如果对应的 slot 里面的 item 的贴图不为空。 不要直接将贴图设置为空。 需要自己提前定义一个 Item_Blank 。用这个 Item_Blank 去替换当前的 Item 。 否则会出现神奇的事情。 点击一个有贴图的图标， 上面和下面居然同时消失，原因还未破解出来。

留给我们的事件不多了，就写到这里ba . TMD