How to make a GUI draggable?

[KrimsonWoIf]

Hello, I’m currently trying to make a GUI draggable, but I’m experiencing some issues.

Here is my code:

while dragging do
    Task.wait(.1)		
    script.Parent.Position = UDim2.new(0,Mouse.X,0,Mouse.Y)
end

As you can see, the GUI is way far away from the mouse. This is completely unexpected and nonsensical. Considering the Mouse.X and Mouse.Y should return the offset position, this makes no sense.

[VSCPlays]

Draggable GUI Elements Module

About This module allows you to make a GUI element draggable. There is already a similar module for this, but this one has more features. Everything will be explained later on. This module only works with ScreenGui. I do plan on making it possible for SurfaceGui. How to use We must first require the module. Let’s also make a variable for the GUI element that will be draggable as well. local Draggable_UI = require(...) local Frame = script.Parent.Frame Then we create our draggable elemen…

Try this out

[MilkyFiend (Demonic)]

Well I haven’t used mouse service that much but if it returns offset then try only putting offset values to your frame position and maybe size Else the mouse is getting the 3D position.

[KrimsonWoIf]

Thank you for giving me this resource, and I assure you, I’ve already seen and used it in the past. I want to actually do it myself, as I think it’s better to learn not to. Thanks again though.

[KrimsonWoIf]

These are good theories, but I assure you that

• its not getting the 3d position
• the size doesnt affect the position
• the mouse.X returns offset.

I likely have to mess with like Mouse.ViewportXSize or something

[KrimsonWoIf]

actually TBH its kind of annoying when people spam modules for dragging GUI. It basically says, “Hey, I’m ignorant and lazy, and cant script!” Like bro, don’t be an NPC. there were probably a hundred other bots ready to spam this same module, ready to be deployed.

[cuberoot5 (lohak)]

If there is an off-set in position but the UI object still follows the mouse, you could try negating / adding this difference to the position.

[cuberoot5 (lohak)]

To be fair, you can always just learn from the module and see what it does differently by looking at the code.
If you want direct help for your script without quick solutions, mention that in the post.

[KrimsonWoIf]

The module is a bit unclear and never really “gets to the point” on what I am doing.

I am having trouble determining what Is wrong. I think something along the lines of using AbsoluteSize, AbsolutePoint, AbsolutePosition, but I’m really unsure.

[KingBlueDash (Dash)]

I have tested my following scripts and they work fine from what I’ve tested

With Tween:

local TweenService = game:GetService("TweenService")
local button = Instance.new("TextButton", Instance.new("ScreenGui", game.StarterGui))
button.Size = UDim2.fromScale(.5, .5)
button.AnchorPoint = Vector2.new(.5, .5)
local mouse
local mouseHeld = false

local a = button.InputBegan:Connect(function(input)
	
	if input.UserInputType == Enum.UserInputType.MouseButton1 then 

		mouseHeld = true
		
		while mouseHeld == true do

			task.wait()
			
			mouse = game:GetService("UserInputService"):GetMouseLocation()
			
			TweenService:Create(button, TweenInfo.new(.5, Enum.EasingStyle.Exponential, Enum.EasingDirection.Out), {Position = UDim2.new(0, mouse.X, 0, mouse.Y)}):Play()

		end

	end

end)

local b = button.InputEnded:Connect(function(input)

	if input.UserInputType == Enum.UserInputType.MouseButton1 then 

		mouseHeld = false

		while mouseHeld == false do

			task.wait()

		end

	end

end)

Without Tween:

local TweenService = game:GetService("TweenService")
local button = Instance.new("TextButton", Instance.new("ScreenGui", game.StarterGui))
button.Size = UDim2.fromScale(.5, .5)
button.AnchorPoint = Vector2.new(.5, .5)
local mouse
local mouseHeld = false

local a = button.InputBegan:Connect(function(input)
	
	if input.UserInputType == Enum.UserInputType.MouseButton1 then 

		mouseHeld = true
		
		while mouseHeld == true do

			task.wait()
			
			mouse = game:GetService("UserInputService"):GetMouseLocation()
			
            button.Position = UDim2.new(0, mouse.X, 0, mouse.Y)

		end

	end

end)

local b = button.InputEnded:Connect(function(input)

	if input.UserInputType == Enum.UserInputType.MouseButton1 then 

		mouseHeld = false

		while mouseHeld == false do

			task.wait()

		end

	end

end)

[KrimsonWoIf]

Hey, I tried your method but Roblox really hates me.

Here is what I did:

while dragging do	
	local mousePos = game:GetService("UserInputService"):GetMouseLocation()
	script.Parent.Position = UDim2.new(0, mousePos.X, 0, mousePos.Y)
	task.wait(.1)	
end

[KingBlueDash (Dash)]

try making the anchor point .5, .5

[KrimsonWoIf]

Still the same. Do you think the thing its parented to is screwing up calculations?

[KingBlueDash (Dash)]

maybe, as my test had no ui parent except for ScreenGui.

[cuberoot5 (lohak)]

I think it shouldnt if youre working with only offset. but scale can intefere, so im not sure whats causing it.

[KrimsonWoIf]

yea bro, that was the issue. It was because of parenting. Also I found a better method than your system…

	local mousePos = Vector2.new(Mouse.X, Mouse.Y)
	local screenSize = Vector2.new(Mouse.ViewSizeX, Mouse.ViewSizeY)
	local finalCalculation = mousePos/screenSize
		
	guiFolder.Parent.dragCategory.Position = UDim2.new(finalCalculation.X, 0, finalCalculation.Y, 0)

This not only is offset but also calculates it based on screen size which ensures it works for all devices!