C# : GDI+ Image cropping

Question

I have an image .I want to crop 10 px from left and 10px from right of the image.I used the below code to do so

    string oldImagePath="D:\\RD\\dotnet\\Images\\photo1.jpg";
    Bitmap myOriginalImage = (Bitmap)Bitmap.FromFile(oldImagePath);
    int newWidth = myOriginalImage.Width;
    int newHeight = myOriginalImage.Height;
    Rectangle cropArea = new Rectangle(10,0, newWidth-10, newHeight);

    Bitmap target = new Bitmap(cropArea.Width, cropArea.Height);
    using (Graphics g = Graphics.FromImage(target))
    {
        g.DrawImage(myOriginalImage,cropArea);
    }

    target.Save("D:\\RD\\dotnet\\Images\\test.jpg");

But this is not giving me the results which i expect. This outputs an image which has 10 px cropped from the right and a resized image.Instead of cropiing it is resizing the width i think.So the image is shrinked(by width). Can any one correct me ? Thanks in advance

Answer 1

Okay, I totally fail at explaining this, but hang on:

The DrawImage function requires the location of the image, as well as it's position. You need a second position for cropping as how the old relates to the new, not vice versa.

That was entirely incomprehensible, but here's teh codez:

g.DrawImage(myOriginalImage, -cropArea.X, -cropArea.Y);

I hope that explains it more then I did.

Answer 2

My guess is this line

Rectangle cropArea = new Rectangle(10,0, newWidth-10, newHeight);

should be

Rectangle cropArea = new Rectangle(10,0, newWidth-20, newHeight);

Set the width of the new rectangle to be 20 less than the original - 10 for each side.

Some indication what result it is giving you would be helpful in confirming this.

Answer 3

Your new width should be reduced by twice the crop margin, since you'll be chopping off that amount from both sides.

Next, when drawing the image into the new one, draw it at a negative offset. This causes the area that you aren't interested in to be clipped off.

int cropX = 10;
Bitmap target = new Bitmap(myOriginalImage.Width - 2*cropX, myOriginalImage.Height);
using (Graphics g = Graphics.FromImage(target))
{
    g.DrawImage(myOriginalImage, -cropX, 0);
}

Answer 4

Corey Ross is correct. Alternately, you can translate along the negative x axis and render at 0.0, 0.0. Should produce identical results.

using (Graphics g = Graphics.FromImage(target))
{
    g.TranslateTransform(-cropX, 0.0f);
    g.DrawImage(myOriginalImage, 0.0f, 0.0f);
}

Answer 5

You need to use the overload that has you specify both Destination Rectangle, and Source Rectangle.

Below is an interactive form of this using a picture box on a form. It allows you to drag the image around. I suggest making the picture box 100 x 100 and have a much larger image such as a full screen window you've captured with alt-prtscr.

class Form1 : Form
{
    // ...
    Image i = new Bitmap(@"C:\Users\jasond\Pictures\foo.bmp");
    Point lastLocation = Point.Empty;
    Size delta = Size.Empty;
    Point drawLocation = Point.Empty;
    bool dragging = false;
    private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
    {
        if (e.Button == MouseButtons.Left)
        {
            if (!dragging)
            {
                lastLocation = e.Location;
                dragging = true;
            }
            delta = new Size(lastLocation.X - e.Location.X, lastLocation.Y - e.Location.Y);
            lastLocation = e.Location;
            if (!delta.IsEmpty)
            {
                drawLocation.X += delta.Width;
                drawLocation.Y += delta.Height;
                pictureBox1.Invalidate();
            }
        }
        else
        {
            dragging = false;
        }
    }

    private void pictureBox1_Paint(object sender, PaintEventArgs e)
    {
        Rectangle source = new Rectangle(drawLocation,pictureBox1.ClientRectangle.Size);
        e.Graphics.DrawImage(i,pictureBox1.ClientRectangle,source, GraphicsUnit.Pixel);
    }
    //...