Resumé

Perspective Puzzle with GDIplus and .NET

Cristian Merighi () 0.00

Howto use the - already posted - methods about images' distortion and overlaying on order to obtain a prospectical composition. C# code.
This article is obsolete. Some functionalities might not work anymore. Comments are disabled.

This article provides a common scenario usage for two of the features of my Pacem.Drawing.Image GDI+ API.
I've been talking about image distortion and image overlaying, here they are the relevant articles:

The goal is to create a sort of "perspective puzzle" distorting and positioning 5 different images, the following way:

scheme

Now I'll expose the code lines; they refer to my Pacem.Drawing.Image class members but they (Distort and OverlayImage methods) can be easily substituted with the correspondant functions posted in the two articles above.

protected void Page_Load(object sender, EventArgs e)
{
    // the rectangle A'B'C'D' in figure has the following dimensions
    System.Drawing.Rectangle innerRect = new Rectangle(new Point(50, 100), new Size(150, 50));

    Pacem.Drawing.Image xc = new Pacem.Drawing.Image(Server.MapPath("~/1.jpg"));
    // AB segment = 480px
    // BC segment = 360px
    xc.ResizeImage(480, 360, true);

    Point A = new Point(0, 0);
    Point B = new Point(480, 0);
    Point C = new Point(480, 360);
    Point D = new Point(0, 360);
    Point A1 = new Point(innerRect.X, innerRect.Y);
    Point B1 = new Point(innerRect.X + innerRect.Width, innerRect.Y);
    Point C1 = new Point(innerRect.X + innerRect.Width, innerRect.Y + innerRect.Height);
    Point D1 = new Point(innerRect.X, innerRect.Y + innerRect.Height);

    // image 1
    using (MemoryStream ms = new MemoryStream())
    {
        using (Pacem.Drawing.Image xc1 = new Pacem.Drawing.Image(Server.MapPath("~/1.jpg")))
        {
            xc1.Distort(A, B, A1, B1);
            xc1.Flush(ms, "image/png");
            using (System.Drawing.Image bmp = Bitmap.FromStream(ms))
            {
                xc.OverlayImage(bmp, A);
            }
        }
    }

    // image 2
    // distorted using A2BB' coordinate system
    using (MemoryStream ms = new MemoryStream())
    {
        using (Pacem.Drawing.Image xc2 = new Pacem.Drawing.Image(Server.MapPath("~/2.jpg")))
        {
            xc2.Distort(new Point(0, B1.Y), new Point(B.X-B1.X, 0) , new Point(0, D1.Y), new Point(B.X-B1.X, C.Y));
            xc2.Flush(ms, "image/png");
            using (System.Drawing.Image bmp = Bitmap.FromStream(ms))
            {
                xc.OverlayImage(bmp, new Point(B1.X, 0));
            }
        }
    }

    // image 3
    // distorted using A3D'D coordinate system
    using (MemoryStream ms = new MemoryStream())
    {
        using (Pacem.Drawing.Image xc3 = new Pacem.Drawing.Image(Server.MapPath("~/3.jpg")))
        {
            xc3.Distort(new Point(D1.X, 0), new Point(C1.X, 0), new Point(0, D.Y - D1.Y), new Point(C.X, C.Y - C1.Y));
            xc3.Flush(ms, "image/png");
            using (System.Drawing.Image bmp = Bitmap.FromStream(ms))
            {
                xc.OverlayImage(bmp, new Point(0, D1.Y));
            }
        }
    }

    // image 4
    using (MemoryStream ms = new MemoryStream())
    {
        using (Pacem.Drawing.Image xc4 = new Pacem.Drawing.Image(Server.MapPath("~/4.jpg")))
        {
            xc4.Distort(A, A1, D, D1);
            xc4.Flush(ms, "image/png");
            using (System.Drawing.Image bmp = Bitmap.FromStream(ms))
            {
                xc.OverlayImage(bmp, A);
            }
        }
    }

    // image 5
    using (MemoryStream ms = new MemoryStream())
    {
        using (Pacem.Drawing.Image xc5 = new Pacem.Drawing.Image(Server.MapPath("~/5.jpg")))
        {
            // using ResizeImage(width, height, mantainProportions) method
            xc5.ResizeImage(innerRect.Width, innerRect.Height, false);
            xc5.Flush(ms, "image/png");
            using (System.Drawing.Image bmp = Bitmap.FromStream(ms))
            {
                xc.OverlayImage(bmp, A1);
            }
        }
    }

    xc.Save(Server.MapPath("~/puzzle.png"), "image/png");
    xc.Dispose();
}

The code is pretty straightforward, so let's take a look at the result:

result

Take care. Bye.

feedback
 

Syndicate

Author

Cristian Merighi facebook twitter google+ youtube

Latest articles

Top rated

Archive

Where am I?

Author

Cristian Merighi facebook twitter google+ youtube

I'm now reading

Feeds