How to make a image to follow cursor in click?

Development Programming & Scripting UI
, , , , , ,
1

Hello.
My question is: I have an image in User Interface. I want to click on image and it creates a copy of image and follows cursor. NOT Drag and Drop. Same effect, but without pressing a left button whole time. Only 2 clicks.
How to do that?

2

Have the clicked widget create another widget, feed it data from the original and add to viewport. Send its reference to the player controller and then you can simply:

272202-capture.png
272202-capture.png826×337 51.7 KB

1 Like
3

What I´m doing wrong? I have an image, so function OnMouseButtonDown its unique way to interact by click with it, and it kinda works, in both Options image appears above clicked, but it doesnt move (and i cant add tick event to function to referesh coordinates every tick) and appears some 100x and 100y pixels below the point i clicked.

272263-screenshot-1.png
272263-screenshot-1.png1599×861 252 KB

4

What I´m doing wrong?

You’re not sending the widget reference to the player controller or moving the image at all. You just place it on screen once, on click.

In your player controller:

  • create a variable of your widget type
  • on Tick, check if it’s valid; if it is, set its position as shown above

In order to set the widget reference for the PC, in OnMouseButtonDown0:

  • get Player Controller
  • cast to YourPlayerController
  • set Widget Reference

Edit: I mean, you could do it all in one widget but it’s not recommended:

  • widgets don’t Tick when off-screen
  • they don’t have full control over the cursor (it’s complicated)
  • removing the widget that’s driving another widget from the viewport would break the whole thing

Let the Player Controller handle player input, that’s what it’s supposed to do.

5

It works, thank you. Can you just check if I made all correct and can you say how to destroy created widget on mouse click?

6

Looks good at a glance. You cannot directly destroy the widget, in order to get rid of it completely from memory you need to do 2 things:

  • remove it from a container (or get rid of the container housing it)
  • ensure no references to the widget remain

Once nothing is referencing the widget, it will be Garbage Collected and memory cleared.

In your case, when you want to remove it:

  • drag a wire from Image Type and Remove From Parent and then
  • set the Image Type variable to nothing (do not plug anything in it)