10.15 Loading and Displaying Images

You want to load an image on the file system and display it on a Windows Form.

Technique

To load an image, use the FromFile static method defined in the Image class, passing a filename as the parameter. You can also obtain an Image object by using the FromHbitmap method, passing a handle to an existing bitmap. This method primarily applies when you directly access GDI+ in an interoperability scenario. Chapter 12, "File I/O and Serialization," details stream-based data access, which you can use with the FromStream method to read image data directly from a stream object:

 private void menuOpen_Click(object sender, System.EventArgs e) {     if( openFileDialog1.ShowDialog() == DialogResult.OK )     {         image = Image.FromFile( openFileDialog1.FileName );         this.Text = "Image Test - " + openFileDialog1.FileName;         Invalidate();     } } protected override void OnPaint(PaintEventArgs e) {     if( animating == true )         ImageAnimator.UpdateFrames();     e.Graphics.DrawImage( image, 0, 0 ); } 

Comments

To say that GDI+ along with the .NET Framework makes loading and displaying images simple is an understatement. Not only is bitmap display much simpler with GDI+ than previous technologies, but you also get the added benefit of a slew of other image types to work with. Furthermore, your code doesn't even have to change to work with different file formats. As far as you are concerned , you have an Image object. It's up to GDI+ to make sure the file is parsed and rendered correctly based on its file format.

The Image class itself loads and displays images, but support for any type of image manipulation is sparse. For instance, if you want to rotate the image, you can call the RotateFlip method, passing a value from the RotateFlipType enumerated data type. However, if you want to scale the image, there is no corresponding method to easily perform this operation. To perform this type of operation, you can use a technique that creates a new image object whose size is the final size of the scaled image and then use the DrawImage method to copy the old image to the newer scaled image, as in the following code:

 private void menuScale_Click(object sender, System.EventArgs e) {     if( image == null )         return;     ScaleImageForm scale = new ScaleImageForm();     if( scale.ShowDialog(this) == DialogResult.OK )     {         int newHeight = (int)(image.Height * (scale.ScaleHeight/100.0f));         int newWidth = (int)(image.Width * (scale.ScaleWidth/100.0f));         Image oldImage = (Image) image.Clone();         image = new Bitmap( newWidth, newHeight );         Graphics g = Graphics.FromImage( image );         g.DrawImage( oldImage, new Rectangle(0,0,image.Width, image.Height), 0, 0,                      oldImage.Width, oldImage.Height, GraphicsUnit.Pixel );         Invalidate();     } } 

Likewise, if you want to crop out parts of an image, you must follow the same procedure. Listing 10.4 demonstrates how to crop an image. Whenever you select the Crop menu item, the application is placed into cropping mode, indicated by changing the current Cursor . Event handlers are created to handle mouse events. When a user initially clicks a mouse button, the location of that click is saved into a cropping rectangle variable. As the mouse moves, the Form1_MouseMove method updates the cropping rectangle's Width and Height properties. Once the user releases the mouse button, a new Image object is created whose size is the same as the cropping rectangle that was constructed . The corresponding area of the main image is then placed into that new Image , and the form is updated to reflect the new cropped image.

Listing 10.4 Cropping Images

 private void menuCrop_Click(object sender, System.EventArgs e) {     if( image != null )     {         this.Cursor = Cursors.Cross;         cropping = true;     } } private void Form1_MouseDown(object sender,     System.Windows.Forms.MouseEventArgs e) {     if( cropping == true )     {         cropRect.X = e.X;         cropRect.Y = e.Y;     } } private void Form1_MouseMove(object sender,     System.Windows.Forms.MouseEventArgs e) {     if( cropping == true )     {         cropRect.Width = e.X - cropRect.X;         cropRect.Height = e.Y - cropRect.Y;         Invalidate();     } } private void Form1_MouseUp(object sender,System.Windows.Forms.MouseEventArgs e) {     if( cropping == true )     {         cropping = false;         // move old picture         Image oldImage = (Image) image.Clone();         // create new image object         image = new Bitmap( cropRect.Width, cropRect.Height );         // get graphics object from new image         Graphics g = Graphics.FromImage( image );         // draw old image into new image using crop rect         g.DrawImage( oldImage, new Rectangle(0,0,image.Width, image.Height),             cropRect.X, cropRect.Y, cropRect.Width,             cropRect.Height, GraphicsUnit.Pixel );         // reset         cropRect.X = cropRect.Y = -1;         this.Cursor = Cursors.Default;         Invalidate();     } }