Dragging GUI Item, get mouse to stay at part of box where drag began

Questions & Answers
1

So I’m trying to make a custom timeline and I have boxes that the user can place on the timeline and drag around. They can only be dragged from left to right. Now the problem is that when I drag them, instead of my mouse staying over the part where I started dragging, the beginning x of the rect jumps to my mouse. I would like the x of my rect to move the same amount of pixels as the mouse with my mouse staying in the part of the box that it originally starting dragging from. The boxes can be dragged from left to right. Now I have tried using

if(Event.currrent.type==EventType.MouseDrag&&MyBoxRect.Contains(Event.current.mousePosition){
    MyBoxRect.x+=Event.current.delta.x;
}

and

 MyBoxRect.x+=(Event.current.mousePosition.x-MyBoxRect.x);

and

  MyBoxRect.x+=(Event.current.delta.x * 40);

None of these give the result I want. Delta.x results in my mouse moving pretty far from the box. Event.current.mousePosition.x-MyBoxRect.x results in the mouse always being at the start x of MyBoxRect. Now what would be the proper way to get my mouse to stay at the part of the box it started dragging at and to get the x to move only the amount of pixels that my mouse moved?

2

@arisonu123

You need to get the distance between the mouse and box X. Then subtract the distance from the mouse X.

var distance = Event.current.mousePosition.x - MyBoxRect.x;
MyBoxRect.x = Event.current.mousePosition.x - distance;
3

First Ensure that the Anchor of the Rect Transform is in the bottom left corner (or Top Left)

/* Variables */
Vector2 offset;
bool moving;
    
/* Unity Scripting API */
void OnMouseDown () {
Vector3 tran = GetComponent<RectTransform> ().position;
    
offset = new Vector2 (Input.mousePosition.x - tran.x, Input.mousePosition.y - tran.y);
    
moving = true;
}
    
Update () {
// Button Released
if (Input.GetKeyUp(KeyCode.Mouse0))
      moving = false;
    
// Button Down:
GetComponent<RectTransform> ().position = new Vector3 (Input.mousePosition.x + offset.x, Input.mousePosition.y + offset.y , 0);
}