Mouse coordinates

Getting the coordinates of the mouse with OnMouseMove and making something interesting with them.

The position of the mouse cursor on the screen is determined by the X and Y coordinates.
In C#, X and Y are the properties of MouseEventArgs. X is the horizontal position of the cursor relative to the client area (the form usually), and Y is the vertical position.

This means we can easily get the mouse pointer coordinates on a form by using these properties and overriding the OnMouseMove method:

protected override void OnMouseMove(MouseEventArgs mouseEv)

    txtMouseX.Text = mouseEv.X.ToString();
    txtMouseY.Text = mouseEv.Y.ToString();

Use the above code with a form with two textboxes.

OK, let’s do something more interesting than some textBoxes displaying mouse coordinates.

Start a new ‘Windows Application’ project. Change the background color of the form to white.
At the beginning of the public class declare two int variables, xMouse and yMouse and set them to 0:

int xMouse = 0;
int yMouse = 0;

Again, we’ll use OnMouseMove:

protected override void OnMouseMove(MouseEventArgs mouseEv)

    // Create new graphics object
    Graphics gfx = CreateGraphics();
    // Create a pen that has the same background color as the form
    Pen erasePen = new Pen(Color.White);
    // Draw a line that will erase the previous line created
    gfx.DrawLine(erasePen, 0, 0, xMouse, yMouse);
    // Create a pen that will draw the blue line
    Pen linePen = new Pen(Color.Blue);
    // Store the X coordinate
    xMouse = mouseEv.X;
    // Store the Y coordinate
    yMouse = mouseEv.Y;
    // Actually draw the blue line
    gfx.DrawLine(linePen, 0, 0, xMouse, yMouse);

The result is a line starting from the top left corner of the form and ending at the mouse pointer position, following him every time.

The code is simple, but we need to use a little trick to erase the previous line created.
This is why we create a pen that has the same background color as the form.
When we create the blue line, we use the coordinates stored in the variables xMouse and yMouse.
After the blue line is created and the mouse continues to move, the OnMouseMove event fires again.
First it makes a new white line in the same exact position of the previous blue line because it uses the old variables.
Then it updates the variables with the new coordinates and creates a new blue line.

If we don’t make a new white line over the previous blue one, the result will be similar to this:

To see it for yourself just comment the following line:

gfx.DrawLine(erasePen, 0, 0, xMouse, yMouse);

Leave a Reply

Your email address will not be published. Required fields are marked *

Back To Top