Drag and Drop script is not working well

Hi everybody,

I am trying to implement a drag and drop system in my game,
but after implementing it, I realized that it is not working very well.

I explain :
As you can see in the attached file, I have a UI Panel with a "mini-game", where the player is supposed to drag the books with roman numerals to the empty spaces slots on the second shelf.
I have a script "DragDrop" on each of my book items, and a script "DropItem" on each of my slots. And it works quite well, but as soon as I place one book, it gets really hard to place a second on the slot next to him, as if it doesn't detect my book element.
I tried to space my slots to see if that solved the problem, and indeed I no longer had the problem but I must keep them close like this so they all fit in the window.
I also have two or three other small problems with it but this is the main bug that I have.

if anyone has any idea to help me out i would appreciate it ! I answer fast.

I also post the two scripts, if you want to look at them.
thank you very much.

Code (CSharp):

1. public class DragDrop : MonoBehaviour, IBeginDragHandler, IEndDragHandler, IDragHandler {
2.  
3.     [SerializeField] private Canvas canvas;
4.     private RectTransform rectTransform;
5.     private CanvasGroup canvasGroup;
6.     public Vector2 defaultPosition;
7.     public Vector2 actualPosition;
8.     public bool droppedOnSlot;
9.  
10.     private void OnDisable()
11.     {
12.         actualPosition = defaultPosition;
13.         rectTransform.anchoredPosition = actualPosition;
14.     }
15.  
16.  
17.     private void Awake() {
18.         rectTransform = GetComponent<RectTransform>();
19.         canvasGroup = GetComponent<CanvasGroup>();
20.         defaultPosition = transform.localPosition;
21.         actualPosition = transform.localPosition;
22.     }
23.  
24.     public void OnBeginDrag(PointerEventData eventData) {
25.         canvasGroup.alpha = .8f;
26.         canvasGroup.blocksRaycasts = false;
27.         droppedOnSlot = false;
28.     }
29.  
30.     public void OnDrag(PointerEventData eventData) {
31.         rectTransform.anchoredPosition += eventData.delta / 208;
32.     }
33.  
34.     public void OnEndDrag(PointerEventData eventData) {
35.         canvasGroup.alpha = 1;
36.         canvasGroup.blocksRaycasts = true;
37.    
38.         if(droppedOnSlot)
39.         {
40.             actualPosition = rectTransform.anchoredPosition;
41.         }
42.         else
43.         {
44.             rectTransform.anchoredPosition = actualPosition;
45.    
46.     }

Code (CSharp):

1. public class DropItemSlot : MonoBehaviour, IDropHandler {
2.  
3.     public GameObject elementDrop;
4.     public void OnDrop(PointerEventData eventData) {
5.  
6.         if (eventData.pointerDrag != null)
7.         {
8.             eventData.pointerDrag.GetComponent<RectTransform>().anchoredPosition = GetComponent<RectTransform>().anchoredPosition;
9.             eventData.pointerDrag.GetComponent<DragDrop>().droppedOnSlot = true;
10.             elementDrop = eventData.pointerDrag;
11.         }
12.         else
13.         {
14.             eventData.pointerDrag.GetComponent<DragDrop>().droppedOnSlot = false;
15.             elementDrop = null;
16.         }
17.     }
18. }

 

Hi,

I didn't read the code completely, there are several things I would change, but it has been long since I've touch UI stuff...

I tested your code and it seems to be working OK, I simply had to change the movement code to get it working (in different resolution):

Code (CSharp):

1. public void OnDrag(PointerEventData eventData)
2. {
3.     rectTransform.position = eventData.position;
4. }

Is this what you were looking for? The difference here is the fact that my cursor will always be centered to dragged item (you could calculate the offset when you start dragging), but I'm not exactly sure what is going on in your setup.

 

Hi, thanks for your reply
I updated my OnDrag function with yours but now when I drag the book, it moves directly to a point really far from my map,
You can see on my capture that my book has gone really far from the map, and I barely touched the mouse. I zoomed out a lot to take the picture.

Maybe it is because my map is too small ? I'm lost right now.

 

How have you setup your Canvas and Canvas Scaler?

 

Here are my canvas settings,

I also put a capture of my hierarchy. :/

 

Is there a specific need to use World Space Canvas (I only see a flat 2D UI)?

Then you probably need to calculate object position in different manner.

When Canvas is in Screen Space - Overlay mode and Canvas Scaler is set to Scale with Screen Size, what I used will work. Edit. Reason for this is the fact that in this mode, canvas world size will pretty much match the screen (1 screen pixel = 1 Unity world unit in Canvas), you can see this in Canvas object's Inspector/RectTransform settings.

 

Oh my god it worked !!
I can't believe I was stuck all the week because of this Camera.

Thanks you so much, that helped me a lot !

 

OK good to hear!

I would recommend you go through some Unity UI tutorials, as it is essential to understand how Canvas and Canvas Scaler work.

 

Yes, I understand !
It is not a bad idea and it would have saved me a lot of problems !

Thanks again