Crop a picture in C#

The program uses three Bitmap objects to hold different copies of the current image.

// The original image.
private Bitmap OriginalImage;

// The currently cropped image.
private Bitmap CroppedImage;

// The cropped image with the selection rectangle.
private Bitmap DisplayImage;
private Graphics DisplayGraphics;

OriginalImage holds the image originally loaded from the file.

CroppedImage holds the currently displayed bitmap as cropped without the selection rectangle.

DisplayImage holds the current image with the selection rectangle. DisplayGraphics is a Graphics object for drawing on DisplayImage. The program uses it to draw the selection rectangle.

The following code shows how the program lets you select an area.

// Let the user select an area.
private bool Drawing = false;
private Point StartPoint, EndPoint;
private void picCropped_MouseDown(object sender, MouseEventArgs e)
{
    Drawing = true;
    StartPoint = e.Location;

    // Draw the area selected.
    DrawSelectionBox(e.Location);
}

private void picCropped_MouseMove(object sender, MouseEventArgs e)
{
    if (!Drawing) return;

    // Draw the area selected.
    DrawSelectionBox(e.Location);
}

private void picCropped_MouseUp(object sender, MouseEventArgs e)
{
    if (!Drawing) return;
    Drawing = false;

    // Crop.
    // Get the selected area's dimensions.
    int x = Math.Min(StartPoint.X, EndPoint.X);
    int y = Math.Min(StartPoint.Y, EndPoint.Y);
    int width = Math.Abs(StartPoint.X - EndPoint.X);
    int height = Math.Abs(StartPoint.Y - EndPoint.Y);
    Rectangle source_rect = new Rectangle(x, y, width, height);
    Rectangle dest_rect = new Rectangle(0, 0, width, height);

    // Copy that part of the image to a new bitmap.
    DisplayImage = new Bitmap(width, height);
    DisplayGraphics = Graphics.FromImage(DisplayImage);
    DisplayGraphics.DrawImage(CroppedImage,
        dest_rect, source_rect, GraphicsUnit.Pixel);

    // Display the new bitmap.
    CroppedImage = DisplayImage;
    DisplayImage = CroppedImage.Clone() as Bitmap;
    DisplayGraphics = Graphics.FromImage(DisplayImage);
    picCropped.Image = DisplayImage;
    picCropped.Refresh();
}

The MouseDown event handler saves the starting point, sets Drawing = true, and calls DrawSelectionBox. The MouseMove event handler updates the mouse’s current point and calls DrawSelectionBox to update the selection box.

The MouseUp event handler finds the selected area. It makes a new Bitmap to fit the selected area and copies the selected part of the previous version of the image into the new bitmap. It then updates DisplayImage and CroppedImage.

This example uses code from the examples:


Download Example   Follow me on Twitter   RSS feed   Donate




This entry was posted in graphics, image processing and tagged , , , , , , , , , , , . Bookmark the permalink.

13 Responses to Crop a picture in C#

  1. Me says:

    You forgot this function:

     // Draw the area selected.
    private void DrawSelectionBox(Point end_point)
    {
    // Save the end point.
    EndPoint = end_point;
    if (EndPoint.X < 0) EndPoint.X = 0;
    if (EndPoint.X >= CroppedImage.Width) EndPoint.X = CroppedImage.Width - 1;
    if (EndPoint.Y < 0) EndPoint.Y = 0;
    if (EndPoint.Y >= CroppedImage.Height) EndPoint.Y = CroppedImage.Height - 1;
    // Reset the image.
    DisplayGraphics.DrawImageUnscaled(CroppedImage, 0, 0);
    // Draw the selection area.
    int x = Math.Min(StartPoint.X, EndPoint.X);
    int y = Math.Min(StartPoint.Y, EndPoint.Y);
    int width = Math.Abs(StartPoint.X - EndPoint.X);
    int height = Math.Abs(StartPoint.Y - EndPoint.Y);
    DisplayGraphics.DrawRectangle(Pens.Red, x, y, width, height);
    picCropped.Refresh();
    } 
  2. Rod Stephens says:

    You’re right. Sorry about that.

  3. Sea Writer says:

    How can we use the application in zoom mode?

    • RodStephens says:

      You would have to do a bit more work. Probably the best approach would be to make the program create a scaled bitmap and work with that. You might want to not smooth the result so it looks pixellated and the user can see exactly which pixels are selected. You could also snap the selection box to integral pixel locations to make it easier to tell exactly which pixels are being selected.

      After the user selects an area, you would un-scale the coordinates selected to get back to the original image’s coordinates. Then you could copy the selected area as before.

      Snapping the selection rectangle and un-scaling the selected area would be a bit tricky because you’d probably want to make the rectangle’s edges lie between the enlarged pixels.

  4. Sea Writer says:

    Photos application does not work in preview mode. How can we make it?

  5. Sea Writer says:

    How can we do the picturebox size mode: StretImage to then cutting images?

    Example Image Link: http://www.medikalcin.net/abort.png

  6. Asdf says:

    Still works in VS2015, tested at the time of writing. VS2015 converts it to a project for the latest version first though.

    • RodStephens says:

      I usually save projects for Visual Studio 2008 because they should be compatible with later versions. Once you open them in a newer version, however, they are converted and you can’t go back.

  7. akshay says:

    How can i crop a selected area and divide it in 30 equal parts like 10 rows and 3 columns and save these 30 images separately in a folder

    thanks in advance

Leave a Reply

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