Mouse drag movement

Ever wondered how to drag and move an object depending on the way you move the mouse? This tutorial shows us the basics of making an object respond to the mouse's movement, displacement and speed. A great example of this technique is in the GameMaker game, 'Gm Hoops'.
To start off, create a new game in GameMaker and create a sprite:
+ Give it the name 'sprBall'
+ Give it the following image, or make your own similar

Create a new object and give is the name 'objBall'
Assign the new object the sprite 'sprBall'

We will start off by initializing and setting the variables in the create event.

Add the create event and place the following code

xpart=0; ypart=0; direction=0; speed=0; friction=0.5; grabbed=false;

We set the direction and speed of the ball to 0 because at the start we want it to be stationary. The Friction is set to 0.5 but we can change this if we want to. The xpart and ypart variables will be used later and they will be the mouse coordinates compared to the objBall coordinates, which is necessary for precise drag movement. We set grabbed to false because objBall has not yet been clicked on.

Now that our variables are set we may start our drag movement.

Add the 'Left Pressed' event under the mouse section and add in the following code

grabbed=true; speed=0; direction=0; xpart=mouse_x-x; ypart=mouse_y-y;

Because we have just clicked on objBall we set grabbed to true. Speed and direction are both set to 0 incase the object is already moving, and we want it to stop when clicked in order for it to then follow the mouse. We set xpart and ypart which are how far away the mouse is from the actual objBall coordinates. These will be used in order to correctly position the ball when dragging it.

In the step event we place this code

if grabbed=true then { x=mouse_x-xpart; y=mouse_y-ypart; friction=0; } else { friction=0.5; }

First we check if objBall is currently grabbed. If true, then we set the ball to where the mouse is and according to where it was the mouse grabbed objBall. We do not want friction to be in place if we are dragging the ball, so we set friction to 0 temporarily. If grabbed=false then the 'else' section will be executed and friction will be set back to 0.5

Put the following code in the 'End Step' event

if grabbed=true then { if not mouse_check_button(mb_left) then { grabbed=false; direction=point_direction(xprevious,yprevious,x,y); speed=point_distance(xprevious,yprevious,x,y)/2; } } if speed>25 then { speed=25; }

First we check if the object is grabbed, if it isn't then we won't execute anything. We then do another check to see if the mouse button is down, if it isn't then it means the user just released the mouse and we will move objBall accordingly. We set grabbed to false because objBall is no longer held onto. We set the direction to the direction the mouse was moving. We set the speed to half the speed the mouse was moving at.

At the end of this event we set the maximum speed, in this case, 25.

If the speed is greater than 25 then it will be lowered to 25.

Add the objBall object into a room and try it out.

You might want to make a wall object and make the ball bounce off of it like I have done in the final .gm6 file.

Download .gm6

Want to get in touch? Got some feedback for me? or a couple of requests? Follow me at twitter:

Need a reliable webhost? Take my word for it and go with Hostgator Green Web Hosting by HostGator

Warning: fread(): Length parameter must be greater than 0 in /customers/f/2/7/ on line 17