[4.10] UMG Drag and Drop - widget to drag has big offset from mouse

Hello. I’ve been trying to create UMG drag and drop behavior for some widgets. My learning and implementation comes from [Epic’s Wes Bunn’s Drag and Drop with UMG training videos][1]. The problem I am observing is that once the OnDragDetected function fires in my blueprint my widget will disappear for the duration of the drag and return to the mouse when the OnDrop function fires and repositions it in the viewport. Now the widget isn’t actually disappearing per sei, it is just offsetting itself by huge amounts and so it is often off screen. The distance the widget offsets is directly proportional to how many pixels from the top left corner of the widget that the mouse down occurs on. If I grab the widget at say pixel 1-3 the offset will be about 50-80% of the screen width so I can still see the widget in this case. Grabbing it beyond the 3rd or so pixel will generate an offset that takes the widget offscreen.

So my first attempt at drag and drop was for my own tailored use, which means I deviated from Wes Bunns step by step in his tutorial. I thought perhaps I had done something non-standard and so started a new project and repeated Wes Bunn (part 1 video) faithfully and I experience the same offsetting behavior. It makes me wonder if a bug may have popped up in the latest release (4.10). I have not tried drag and drop in a version prior to 4.10.

The following pictures and attachments are for my attempt at faithfully following Wes Bunn’s (part 1) video.

Attached is a .rar of some of my Content folder (UI widgets, First Person Shooter Blueprint (since Wes Bunn video adjusts a couple of them slightly), Config folder & .uproject). My intention is you should be able to create a vanilla First Person Shooter Blueprint project and extract my files straight over top. You would be able to see all my blueprints and widget Designer settings.

[link text][6]

Thanks.

Hello David Flower,

How exactly are you setting the position of the widget? Are you setting the translation of the widget?

Hi Rudy,

Thanks for your response. I don’t know to what specific time you refer to ‘setting the position’.

  • I position the widget initially in my HUD widget by adding (the red widget to drag seen in above screenshots) and positioning it in the HUDs blueprint Designer window. Anchored to bottom center (as in Wes’ video)

  • during drag and drop operation I don’t set any position or translation on the widget. I’m hoping that’s what the the drag and drop operation handles for me? :slight_smile: I do RemoveFromParent the red widget - I’m new to Unreal so not sure what the widget is parented to\belongs now, should I be transforming it’s position from HUD canvas space to some other global space?

  • the only time I knowingly set position on my dragged widget is during OnDrop (from my HUD widget blueprint) when I re-attach the dragged widget to the canvas and position it appropriate (I guess in the local space of the HUD canvas). Here is the blueprint schematic for OnDrop (I couldn’t include it in my original post as I hit my picture limit and I figured since this was OnDrop and both seems to function correctly and only execute after my observed issue it was likely not an issue)

Please let me know any extra info I could provide or questions to answer. Your help is appreciated.

As a side note, is there a outliner\hierachical way to inspect my UMG objects\scene? It would be great to be able to inspect values and properties. Or can you point me towards any Unreal docs that talks about effective debugging methods for UMG?

Thanks.

Hello David Flower,

If you use the default Create drag and drop operation node, do you still have the offset issue?

Hi Rudy,

I replaced the Create Widget Drag node with a vanilla Create Drag Drop Operation node and the offset issue is still there.

Here is the ActionBar OnDragDetected BP showing the new Create Drag Drop Operation node executing:

And here is the adjustments to HUD OnDrop required since WidgetDrag Operation was removed. (Although this is the part that repositions the widget to where the mouse is when drag stops… and it was already seemingly working and continues to do so with this change)

I feel like everything I’ve done is ‘by the book’ and I have nothing different between mine and Wes Bunn’s tutorial project. Wes’s tutorial video suggested I could find his drag and drop examples on Marketplace to pull and experiment with locally, but I’ve not been able to find anything like that on Marketplace. Can anyone verify if such example\tutorial projects for drag and drop still exist on Marketplace? That way I could pull down a previously known working project and test my local setup.

Thanks,
David

I noticed that you are still using the “offset” variable with the default Drag and drop operation. Could you try unplugging that variable from the default operation and let me know if that changes the offset that you are seeing?

Hi Rudy,

That was it! . Disconnecting any value into the Drag And Drop Operation’s ‘Offset’ pin. I had gleamed (inaccurately) from the tutorial video that the tutorials custom WidgetDrag’s ‘Drop Window Offset’ and default ‘Offset’ served same purpose. Shame on me for not confirming with the tooltip\documentation.

Thanks for your help and patience, the widget is now moving around screen under my mouse as desired.

Thanks,
David

This has helped me a lot, too. I had the same problem and this fixed the issue.

Hi Ruhrpottpatiot. Glad this post was able to help someone else. It’s nice to know it did help someone else. Thanks for posting. Cheers, David.

I’m using 4.22.3 and still have the issue. For whatever reason when the drag starts the widget offsets from my mouse, but when I drop it the original object appears at the right place - that said, the dragged object is the one with a weird offset I have no idea where it comes from. DragDrop’s Offset var stays null all the time as in the tutorial

Putting this here in case someone else stumbles on this page. According to the tooltip the offset is a percentage of the dragged items desired width and height. IE. -1 … 0 … 1.

Epic hasn’t updated their drag and drop tutorial in a long time.