How do i remove the offset for dragging the frame?

I’m trying to make a system where you can drag a frame, but there’s a slight offset when dragging the frame, how can i fix this? (the position will start at 0.5,0.5 scale and the anchorpoint 0.5,0.5)

	self.Instance.Title.InputBegan:Connect(function(input:InputObject)
		if input.UserInputType == Enum.UserInputType.MouseButton1 then
			local offset = UIS:GetMouseLocation() - self.Instance.AbsolutePosition
			 connection = Mouse.Move:Connect(function()
				local mousePos = UIS:GetMouseLocation() - Main.AbsolutePosition - offset
				local scaleMousePos = mousePos / Main.AbsoluteSize
				self.Instance.Position = UDim2.fromScale(scaleMousePos.X,scaleMousePos.Y)
			end)
		end
	end)
	
2 Likes

From your video, the frames offsets toward the left.
From your code, the lines might be causing the problem. Maybe try instead of using the minus sign, play around with the addition sign?

local offset = UIS:GetMouseLocation() - self.Instance.AbsolutePosition
--and
local mousePos = UIS:GetMouseLocation() - Main.AbsolutePosition - offset

I have a feeling that it’s the last line of code that I quoted.

1 Like

I tried setting it to the addition sign, but the popup just sort of disappeared, probably going far from the screen as i have not made the frame be limited to the screen yet

1 Like

Hi! After watching your video again, I noticed that you camera moves up and down as your mouse moves. Well, this is affecting the UIS:GetMouseLocation() in the code for both lines that I mentioned in my previous post.

Because of this, you aren’t able to use UIS:GetMouseLocation() or other wise you’ll have to do some math since you camera looks at the computer from angle to angle, not flat up and down.

I would recommend you use input Delta (can’t recall 100%) to calculate mouse movement, or you can use mouse to screen surface raycast.

1 Like

Interesting, i’ll see if there’s any post or documentation that can help me

1 Like

For some logic (probably wouldn’t work if you copy and paste it) that could help you (perhaps)

local orginalPos
UIS:Input<something method, perhaps Changed>(function(inputObject)
   print(inputObject.Delta)
end))
1 Like

The issue you are facing might be related to how you calculate the offset variable. To ensure that the frame is dragged with the correct offset, you need to consider the position of the mouse relative to the center of the frame.

Modified Script:

self.Instance.Title.InputBegan:Connect(function(input:InputObject)
    if input.UserInputType == Enum.UserInputType.MouseButton1 then
        local offset = Vector2.new(self.Instance.Size.X.Offset / 2, self.Instance.Size.Y.Offset / 2)
        connection = Mouse.Move:Connect(function()
            local mousePos = UIS:GetMouseLocation() - Main.AbsolutePosition - offset
            local scaleMousePos = mousePos / Main.AbsoluteSize
            self.Instance.Position = UDim2.fromScale(scaleMousePos.X, scaleMousePos.Y)
        end)
    end
end)

In this version, I set the offset to half of the frame’s size, assuming that the anchor point is set to (0.5, 0.5). This should provide a better dragging experience with a slight offset.

1 Like

Is there a way to make it work with scale? the frames use scale, but i can make it use offset if not

self.Instance.Title.InputBegan:Connect(function(input:InputObject)
    if input.UserInputType == Enum.UserInputType.MouseButton1 then
        local offset = Vector2.new(self.Instance.Size.X.Scale / 2, self.Instance.Size.Y.Scale / 2)
        connection = Mouse.Move:Connect(function()
            local mousePos = UIS:GetMouseLocation() - Main.AbsolutePosition - offset
            local scaleMousePos = mousePos / Main.AbsoluteSize
            self.Instance.Position = UDim2.fromScale(scaleMousePos.X, scaleMousePos.Y)
        end)
    end
end)

In this case, I used Size.X.Scale and Size.Y.Scale to get the scale values.

1 Like

Still seems to have a position error, this time to the bottom right corner, if you want i can show you a video

Current code:

	self.Instance.InputBegan:Connect(function(input:InputObject)
		if input.UserInputType == Enum.UserInputType.MouseButton1 then
			local offset = Vector2.new(self.Instance.Size.X.Scale / 2, self.Instance.Size.Y.Scale / 2)
			 connection = Mouse.Move:Connect(function()
				local mousePos = UIS:GetMouseLocation() - Main.AbsolutePosition - offset
				local scaleMousePos = mousePos / Main.AbsoluteSize
				self.Instance.Position = UDim2.fromScale(scaleMousePos.X,scaleMousePos.Y)
			end)
		end
	end)

Yes I would like to see a video, and also try the offset since the scale didn’t work.

1 Like


This is the video, i’ll try offset
I think it may be because of the camera moving thing, so i can also disable that for testing

local UIS = game:GetService("UserInputService")
 
local draggableFrame = script.Parent
 
local IsDragging = false
local dragInput 
local StartingPoint
local oldPos 
 
local function update(input)
    local delta = input.Position - StartingPoint
    draggableFrame.Position = UDim2.new(oldPos.X.Scale, oldPos.X.Offset + delta.X, oldPos.Y.Scale, oldPos.Y.Offset + delta.Y)
end
 
draggableFrame.InputBegan:Connect(function(input)
    if input.UserInputType == Enum.UserInputType.MouseButton1 then
        IsDragging = true
        StartingPoint = input.Position
        oldPos = draggableFrame.Position
 
        input.Changed:Connect(function()
            if input.UserInputState == Enum.UserInputState.End then
                IsDragging = false
            end
        end)
    end
end)
 
draggableFrame.InputChanged:Connect(function(input)
    if input.UserInputType == Enum.UserInputType.MouseMovement then
        dragInput = input
    end
end)
 
UIS.InputChanged:Connect(function(input)
    if input == dragInput and IsDragging then
        update(input)
    end
end)
1 Like

I’ll try and see the results, if it works with the current script or not

Same issue happens, i don’t know what to do really, and i mean really the same issue, it still ends up getting into the bottom right corner

You tried the most recent script I sent?

Yes

self.Instance.InputBegan:Connect(function(input:InputObject)
		if input.UserInputType == Enum.UserInputType.MouseButton1 then
			IsDragging = true
			StartingPoint = input.Position
			oldPos = self.Instance.Position
			
			input.Changed:Connect(function()
				if input.UserInputState == Enum.UserInputState.End then
					IsDragging = false
				end
			end)
		end
	end)
	
	self.Instance.InputEnded:Connect(function(input:InputObject)
		if input.UserInputType == Enum.UserInputType.MouseMovement then
			dragInput = input
		end
	end)
	
	
	UIS.InputChanged:Connect(function(input)
		if input == dragInput and IsDragging then
			Update(self.Instance,input)
		end
	end)
local UIS = game:GetService("UserInputService")
 
local draggableFrame = script.Parent
 
local IsDragging = false
local dragInput 
local StartingPoint
local oldPos 
 
local function update(input)
    local delta = input.Position - StartingPoint
    
    local parentSize = draggableFrame.Parent.Size
    local scaleX = delta.X / parentSize.X
    local scaleY = delta.Y / parentSize.Y
    
    draggableFrame.Position = UDim2.new(oldPos.X.Scale + scaleX, oldPos.X.Offset, oldPos.Y.Scale + scaleY, oldPos.Y.Offset)
end
 
draggableFrame.InputBegan:Connect(function(input)
    if input.UserInputType == Enum.UserInputType.MouseButton1 then
        IsDragging = true
        StartingPoint = input.Position
        oldPos = draggableFrame.Position
 
        input.Changed:Connect(function()
            if input.UserInputState == Enum.UserInputState.End then
                IsDragging = false
            end
        end)
    end
end)
 
draggableFrame.InputChanged:Connect(function(input)
    if input.UserInputType == Enum.UserInputType.MouseMovement then
        dragInput = input
    end
end)
 
UIS.InputChanged:Connect(function(input)
    if input == dragInput and IsDragging then
        update(input)
    end
end)

I changed it so it uses scale.

Don’t edit my script just put it in directly and see what happens.

I have to edit it slightly for it to fit within the OOP structure of the code but it is exactly the same, also, there is an error attempt to perform arithmetic (div) on number and UDim, should it be Offset or Scale in that case?