Roblox Studio Tutorials - June 6, 2022

How to Make a DraggableGUI


Buzzy Beth


Download – DraggableGUI Script

How To – Make a DraggableGUI in Roblox Studio

What’s up everyone welcome to buzzygames, my name is BuzzyGamesBeth and today I’ll be teaching you how to make your GUI draggable!

  • Right now I can open up my GUI, but i’m not able to drag it around my screen and I want it so that anytime I have this GUI open I want to be able to drag it all over the place. So let’s get started!
  • Alrighty so inside of our GUI where the frame is at go ahead and add a localscript, delete the print statement. Okay we have a few variables, we have a variable for our userinputservice, a variable for our frame, our toggle speed, the old position of our frame, and the starting position of our frame!
  • Now you can go ahead and change the speed to whatever you want, but for me it’s going to take 30 seconds for you know our frame to update every time.
  • For our first our first function we’re going to go ahead and update the input position of our frames. What we want to do is go ahead and get the new location of our mouse and subtract that to the old location of our frame.
  • Once we have that, we’re going to adjust the position of our screen and calculate the distance the frame is going to move. So it’s just simultaneously updating the frame based on where we are dragging our mouse. Then once we have that finished it’s going to go ahead set the tween service in our frame with the speed of our drag.
  • Next up we need to set our userinputservice. So inside of this function we have it so that anytime a player is clicking on the frame, then they’re able to drag the frame around. Now if the user releases the mouse then they’re no longer able to drag the frame! Pretty simpl (concept) right?
  • Cool so then we’re gonna have our last function which updates our userinputservice so anytime our toggle is true or anytime we are toggling the tween service or the draggable frame. Then the userinputservice is always going to be simultaneously updated!