Title: Let the user select rectangular areas in an image in C#

This program lets the user click and drag to select rectangular areas in an image.

The program starts by defining a couple of variables that it uses while selecting the area.

// The original image. private Bitmap OriginalImage; // True when we're selecting a rectangle. private bool IsSelecting = false; // The area we are selecting. private int X0, Y0, X1, Y1;

The OriginalImage variable holds a copy of the original image so we don't mess it up. The value IsSelecting is true while the user is selecting an area. Finally, X0, Y0, X1, and Y1 are the corners of the selected rectangle.

To let the user select an area, this example uses a PictureBox's MouseDown, MouseMove, and MouseUp events. When the user presses the mouse down, the following MouseDown event handler starts the process.

// Start selecting the rectangle. private void picOriginal_MouseDown(object sender, MouseEventArgs e) { IsSelecting = true; // Save the start point. X0 = e.X; Y0 = e.Y; }

This code sets IsSelecting to true and saves the current mouse position in variables X0 and Y0.

When the user moves the mouse, the following MouseMove event handler executes.

// Continue selecting. private void picOriginal_MouseMove(object sender, MouseEventArgs e) { // Do nothing it we're not selecting an area. if (!IsSelecting) return; // Save the new point. X1 = e.X; Y1 = e.Y; // Make a Bitmap to display the selection rectangle. Bitmap bm = new Bitmap(OriginalImage); // Draw the rectangle. using (Graphics gr = Graphics.FromImage(bm)) { gr.DrawRectangle(Pens.Red, Math.Min(X0, X1), Math.Min(Y0, Y1), Math.Abs(X0 - X1), Math.Abs(Y0 - Y1)); } // Display the temporary bitmap. picOriginal.Image = bm; }

This code saves the mouse's current location in variables X1 and Y1. It then copies the original Bitmap and draws a rectangle with corners (X0, Y0) and (X1, Y1) on the copy. The event handler finishes by displaying the result in the PictureBox.

The following MouseUp event handler finishes the process.

// Finish selecting the area. private void picOriginal_MouseUp(object sender, MouseEventArgs e) { // Do nothing it we're not selecting an area. if (!IsSelecting) return; IsSelecting = false; // Display the original image. picOriginal.Image = OriginalImage; // Copy the selected part of the image. int wid = Math.Abs(X0 - X1); int hgt = Math.Abs(Y0 - Y1); if ((wid < 1) || (hgt < 1)) return; Bitmap area = new Bitmap(wid, hgt); using (Graphics gr = Graphics.FromImage(area)) { Rectangle source_rectangle = new Rectangle(Math.Min(X0, X1), Math.Min(Y0, Y1), wid, hgt); Rectangle dest_rectangle = new Rectangle(0, 0, wid, hgt); gr.DrawImage(OriginalImage, dest_rectangle, source_rectangle, GraphicsUnit.Pixel); } // Display the result. picResult.Image = area; }

This code sets IsSelecting to false so future MouseMoves don't do anything. It then makes the selection PictureBox display the original image.

The event handler then makes a new Bitmap big enough to hold the selected area and copies that area from the original image. Finally the code displays the copied part of the image in the picResult PictureBox. (Your program could do something different, such as copying the new Bitmap to the clipboard or saving it into a file.)

Download the example to experiment with it and to see additional details.