Make a part follow the mouse

In this tutorial, I will teach you how to make a part follow the players mouse when the player clicks it (a simple version). Only the player will be able to see this. It is a good mechanic for obbies.

Before we start, here is the final code to show you that it really isn’t that much

local player = game.Players.LocalPlayer 

local mouse = player:GetMouse()

local billBoardGui = script.Parent
local imageButton = billBoardGui:WaitForChild("ImageButton")

local runService = game:GetService("RunService")
local isMoving = false 

local movePart

local part = billBoardGui.Adornee 

imageButton.MouseButton1Click:Connect(function()
	if not isMoving then isMoving = true
		movePart = runService.RenderStepped:Connect(function()
			mouse.TargetFilter = part 
			part.Position = mouse.Hit.Position
		end)
	else
		movePart:Disconnect()
		mouse.TargetFilter = nil
		isMoving = false
	end
		
end)

Okay lets begin:

  1. Insert a part and rename it to “movePart.” Anchor it

  2. Add a billboard gui to the part

  3. In the properties window of the billboard gui, find “adornee” and set it to the part
    settingAdornee

  4. In the properties window of the billboard gui, turn on “AlwaysOnTop”
    alwaysOnTop

  5. In the properties window of the billboard gui, change the size to “{1, 0},{1, 0}”
    changeSize

  6. add an image button to the billboard gui
    addingImageButton

  7. In the properties tab of the image button, set the size to “{1, 0},{1, 0}”
    changingImageButtonSize

The next step is important

  1. Set the billboardGui’s parent to "starterGui"

  2. Insert a local script into the billboard gui
    insertingScript

SETTING UP THE LOCAL SCRIPT

  1. First, we will define all the variables needed
local player = game.Players.LocalPlayer 

local mouse = player:GetMouse() --Getting the players mouse

local billBoardGui = script.Parent
local imageButton = billBoardGui:WaitForChild("ImageButton")

local isMoving = false -- Our debounce variable. This will tell us when the player is / isn't moving the part

local movePart --Not too sure how to explain this but we are setting up a variable for the run service

local part = billBoardGui.Adornee --This gives us access to the part
  1. Q: How do we get access to the part from the client side?
    A: I found that you can easily access the part through its adornee

the last variable we need

local part = billBoardGui.Adornee --This gives us access to the part
  1. creating an event to see when the part is clicked
imageButton.MouseButton1Click:Connect(function()
	
end)
  1. Inside this event, we will first check to see if the part is already moving or not
imageButton.MouseButton1Click:Connect(function()
	if not isMoving then isMoving = true --Debounce
			
	else
		
	end
end)
  1. Remember that lonely variable we set up earlier? This is where it comes into play.
imageButton.MouseButton1Click:Connect(function()
	if not isMoving then isMoving = true
		movePart = runService.RenderStepped:Connect(function() 
			
		end)
	
		else
	end
end)

^You might be wondering why we set the function to a variable. When the player clicks the second time, the part should stop following the mouse. So we need to stop the “renderStepped” event. The only way to do that is to define it to a variable and later using “movepart:Disconnect.” You will see later

  1. Now we will make the part follow the mouse
imageButton.MouseButton1Click:Connect(function()
	if not isMoving then isMoving = true
		movePart = runService.RenderStepped:Connect(function()
			mouse.TargetFilter = part -- We need to make sure the mouse doesn't keep hitting the part. So we tell the mouse to avoid
			the part
			part.Position = mouse.Hit.Position --The part's position will follow the mouse's hit position
			
		end)

	else	
	end
end)

Here is the result so far
robloxapp-20220729-1017126_Trim.wmv (275.6 KB)

Lastly, we stop the part from moving when the player clicks again

 imageButton.MouseButton1Click:Connect(function()
	if not isMoving then isMoving = true
		movePart = runService.RenderStepped:Connect(function()
			mouse.TargetFilter = part --[[ We need to make sure the mouse doesn't keep hitting the part. So we tell the mouse to avoid
			the part--]]
			part.Position = mouse.Hit.Position --[[ The part's position will follow the mouse's hit position --]]
		end)
	else
		movePart:Disconnect() --Disconnecting render stepped event
		mouse.TargetFilter = nil -- this doesn't matter much
		isMoving = false -- resetting debounce
	end
		
end)

AND WE ARE DONE, here is the final code

local player = game.Players.LocalPlayer 

local mouse = player:GetMouse()

local billBoardGui = script.Parent
local imageButton = billBoardGui:WaitForChild("ImageButton")

local runService = game:GetService("RunService")
local isMoving = false 

local movePart

local part = billBoardGui.Adornee 

imageButton.MouseButton1Click:Connect(function()
	if not isMoving then isMoving = true
		movePart = runService.RenderStepped:Connect(function()
			mouse.TargetFilter = part 
			part.Position = mouse.Hit.Position
		end)
	else
		movePart:Disconnect()
		mouse.TargetFilter = nil
		isMoving = false
	end
end)

Thank you. Please provide any constructive criticism. ^This was my first community tutorial

13 Likes

All good tutorials have a way of showing the final product, a video or pictures perhaps

It is a good tutorial, its well explained and it probably works
Good job

1 Like

Everything in this is perfect.

The way you explained it, showed pictures, and proved on how this would work is absolutely stunning!

Terrific job man, keep up the good work. :grinning:

1 Like