UI in Unity: Draggable Interface

In the previous article, I introduced the first Event System Interface interaction by creating a Charge Bar.

This article, we will look at creating a Drag Event System Interface.

For this example, we will use 3 images (sprites).

We get reference to the Event Systems namespace, and add the IDragHandler to the class.

OnDrag method, we get the transform position of the data position from PointerEventData class.

We can attach the script to an image, and test out the Drag event.

Additionally, we can have effects where the OnBeginDrag and OnEndDrag methods have visual cues associated with the drag behavior.

Here I made a property reference to the Color data type, where we will get reference to the Image color property values.

We can adjust the alpha channel and set the color value applied to the image color.

Now we have a simple draggable event system to move our images around.

Next, we will look at how to snap the images to a drop item image slot.