Click here to Skip to main content
15,868,016 members
Articles / Multimedia / GDI+

Free Image Transformation

Rate me:
Please Sign up or sign in to vote.
4.94/5 (39 votes)
10 May 2009CPOL 133.4K   6.9K   80   35
Introducing a method to transform an image freely with C#
picture.JPG

Introduction

I have written a small but powerful C# application that can scale, rotate, skew and distort an image. This program includes a user control Canvas and a class FreeTransform. Canvas can keep the picture in the center of window always, and let the user zoom the image by mouse wheel. You can pick up the corner of the picture by mouse left button and move it freely in Canvas. Image transformation is done by the class FreeTransform. When you set its Bitmap and FourCorners, you can get the transformed Bitmap. If you like high quality of picture, you can set IsBilinearInterpolation to true. How does it work? The following diagram demonstrates the key to this method:

Image 2

The shortest distances of point P to image borders are w1, w2, h1 and h2. The position of point P on the original image is supposed to be at:

C#
([w1/(w1+w2)]*imageWidth, [h1/(h1+h2)]*imageHeight) 

Then the colors at...

C#
([w1/(w1+w2)]*imageWidth, [h1/(h1+h2)]*imageHeight) 

... on the original image were put on the point P and thus the result.
To calculate of the distances, the vector cross product was used:

C#
dab = Math.Abs((new YLScsDrawing.Geometry.Vector(vertex[0], srcPt)).CrossProduct(AB));
dbc = Math.Abs((new YLScsDrawing.Geometry.Vector(vertex[1], srcPt)).CrossProduct(BC));
dcd = Math.Abs((new YLScsDrawing.Geometry.Vector(vertex[2], srcPt)).CrossProduct(CD));
dda = Math.Abs((new YLScsDrawing.Geometry.Vector(vertex[3], srcPt)).CrossProduct(DA));

ptInPlane.X = (float)(srcW * (dda / (dda + dbc)));ptInPlane.Y = 
					(float)(srcH*(dab/(dab+dcd)));

Thanks for trying it!

History

  • 2nd May, 2009: Initial post
  • 8th May, 2009: Added Config and Save functions

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Unknown
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
QuestionAre you still here. Pin
Fat and long member28-Dec-21 5:40
Fat and long member28-Dec-21 5:40 
Bugbug report Pin
wingnet1-Dec-13 15:07
wingnet1-Dec-13 15:07 
SuggestionUsing Parallel.For to be faster Pin
WiiMaxx23-Jul-13 5:32
WiiMaxx23-Jul-13 5:32 
QuestionGreat Example! Can you also do the reverse transform (from warped image to rectangle)? Pin
NGErndt2-Jul-13 6:07
NGErndt2-Jul-13 6:07 
AnswerRe: Great Example! Can you also do the reverse transform (from warped image to rectangle)? Pin
NGErndt2-Jul-13 14:01
NGErndt2-Jul-13 14:01 
QuestionPowerful But Need A Faster Way Pin
goddgoh14-May-13 21:04
goddgoh14-May-13 21:04 
AnswerRe: Powerful But Need A Faster Way Pin
WiiMaxx23-Jul-13 5:39
WiiMaxx23-Jul-13 5:39 
QuestionCan you show me in your project where is smooth applied? Pin
nambatre29-Nov-12 16:58
nambatre29-Nov-12 16:58 
QuestionVery Important!! How do I apply Perspective transformation on the image? Pin
S Keller12-Nov-12 7:39
S Keller12-Nov-12 7:39 
GeneralMy vote of 5 Pin
S Keller5-Nov-12 0:12
S Keller5-Nov-12 0:12 
QuestionMust be doing something wrong. Pin
Member 88456084-Sep-12 13:29
Member 88456084-Sep-12 13:29 
I keep getting an error. When rotating image to the right everything is good. But when rotating left, I get a displacement of the image downward even though my points are correct as indicated by a blue path that is drawn.

Same on elevation. One direction works well and the other direction shifts the image.

Any thoughts? Thanks ahead of time.

Code I used is below...

protected override void OnPaint(PaintEventArgs e)
{
    Point ptTopLeft = new Point(320, 97);
    Point ptTopRight = new Point(653, 24);
    Point ptBottomRight = new Point(653, 553);
    Point ptBottomLeft = new Point(320, 481);


    YLScsDrawing.Imaging.Filters.FreeTransform filter = new YLScsDrawing.Imaging.Filters.FreeTransform();
    filter.Bitmap = (Bitmap)((System.Drawing.Image)(global::ChartThumbnailDesign.Properties.Resources.Castle));

    // assign FourCorners (the four X/Y coords) of the new perspective shape
    filter.FourCorners = new System.Drawing.PointF[] { (PointF)ptTopLeft, (PointF)ptTopRight, (PointF)ptBottomRight, (PointF)ptBottomLeft };
    filter.IsBilinearInterpolation = true; // optional for higher quality

    using (System.Drawing.Bitmap perspectiveImg = filter.Bitmap)
    {
        e.Graphics.DrawImage(perspectiveImg, ptTopLeft);

        using (GraphicsPath path = new GraphicsPath())
        {
            path.AddPolygon(new Point[] { ptTopLeft, ptTopRight, ptBottomRight, ptBottomLeft });
            e.Graphics.DrawPath(new Pen(Color.Blue, 4.0f), path);
        }
    }
}

AnswerRe: Must be doing something wrong. Pin
Member 88456084-Sep-12 14:21
Member 88456084-Sep-12 14:21 
GeneralMy vote of 5 Pin
thams15-Aug-12 18:36
thams15-Aug-12 18:36 
GeneralGreat job Pin
thams15-Aug-12 18:35
thams15-Aug-12 18:35 
QuestionNeed anti-aliasing along the edges Pin
peter p.16-May-12 16:04
peter p.16-May-12 16:04 
GeneralMy vote of 5 Pin
Kevin.zsh27-Feb-12 20:17
Kevin.zsh27-Feb-12 20:17 
QuestionAs previous post Pin
Tim Grindley5-Nov-11 4:54
Tim Grindley5-Nov-11 4:54 
GeneralMy vote of 5 Pin
Tim Grindley5-Nov-11 4:50
Tim Grindley5-Nov-11 4:50 
GeneralAwesome Pin
ScrappyPup23-Sep-10 17:59
ScrappyPup23-Sep-10 17:59 
Questiontransforming from points Pin
iLens8-Jul-10 4:50
iLens8-Jul-10 4:50 
AnswerRe: transforming from points Pin
love2xlr828-Jan-13 20:43
love2xlr828-Jan-13 20:43 
GeneralThank this program! Pin
rizherong28-Nov-09 4:54
rizherong28-Nov-09 4:54 
Generalnot implementing rotation Pin
miadmahmud14-Jun-09 0:40
miadmahmud14-Jun-09 0:40 
GeneralExcellent Pin
emarti10-May-09 9:30
emarti10-May-09 9:30 
GeneralGreat solution! Pin
dherrmann5-May-09 22:50
dherrmann5-May-09 22:50 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.