**

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