Skewing Images in GDI+

This article has been excerpted from book "Graphics Programming with GDI+".

So far, we have seen that we can draw various images on graphics surfaces by using DrawImage. We have also seen how to implement rotate, flip, fit-height, fit-width, and zoom features. An imaging application may need to provide even more features, including scaling, skewing and high-performance rendering. Using GDI+ we can do all of this very easily. We will discuss some of these issues in this article.

The DrawImage method has about two dozen overloaded forms- one of which lets us provide the destination point for an image. The original image will be drawn after its coordinates are mapped to the destination points- a process called skewing. We will see an example in a moment. First let's examine the necessary from of DrawImage.

To translate an image from its original coordinates to the mapped coordinates an application needs to create an array of new coordinates and call DrawImage, passing this array as the second parameter. For example, the following code snipped creates an array as the second parameter. For example, the following code snippet creates an array of points and passes it to the DrawImage method.

Point[] pts=

new Point (X0, Y0),

new Point (X1, Y1),

new Point (X2, Y2)

};

g.DrawImage (curImage, pts);

Now let's create a Windows application and add a MainMenu control with an Open File menu item. Let's also add a button to the form. Our final form will look like Figure 7.36.

FIGURE 7.36: A skewing application

Now we add the following variable to the application:

        private Bitmap curBitmap = null;

        private bool skewImage = false;

        Point[] pts =

        {

                new Point (150, 20),

                new Point (20, 50),

                new Point (150, 300)

        };

The complete code is given in Listing 7.23. The Open file menu item click event handler opens an image and creates a Bitmap object from the selected file. The paint event handler views the image. If skewImage is true, the paint event handler calls the DrawImage method with an array of points. The Skew Image button click event handler simply sets skewImage to true.

LISTING 7.23: Skew Image button click event handler

        private void OpenFileMenu_Click(object sender, System.EventArgs e)

        {

            OpenFileDialog openDlg = new OpenFileDialog();

            openDlg.Filter = "All Bitmap files | *.bmp; *.gif; *.jpg;";

            string filter = openDlg.Filter;

            openDlg.Title = "Open Bitmap File";

            openDlg.ShowHelp = true;

            if (openDlg.ShowDialog() == DialogResult.OK)

            {

                curBitmap = new Bitmap(openDlg.FileName);

            }

            Invalidate();

        }

        private void Form1_Paint(object sender, PaintEventArgs e)

        {

            //Create a Graphics object

            Graphics g = e.Graphics;

            g.Clear(this.BackColor);

            if (curBitmap != null)

            {

                if (skewImage)

                {

                    g.DrawImage(curBitmap, pts);

                }

                else

                {

                    g.DrawImage(curBitmap, 0, 0);

                }

            }

            //Dispose of object

            g.Dispose();

        }

        private void SkewImageBtn_Click(object sender, System.EventArgs e)

        {

            skewImage = true;

            Invalidate();

        }

If you run the application and open an image, the normal view looks like Figure 7.37.

If you click Skew Image, the new output looks like figure 7.38.

FIGURE 7.37: Normal view of an image

FIGURE 7.38: Skewed image

Conclusion

Hope the article would have helped you in understanding Skewing Images in GDI+. Read other articles on GDI+ on the website.

This book teaches .NET developers how to work with GDI+ as they develop applications that include graphics, or that interact with monitors or printers. It begins by explaining the difference between GDI and GDI+, and covering the basic concepts of graphics programming in Windows.