Working with PictureBox

A PictureBox is a control in Visual Basic 2015 that is used to display images. In earlier lessons, you learned how to place controls on a form, including the PictureBox. In this lesson, the focus is on loading and displaying image files properly.

There are several ways to load an image into a PictureBox:

• Load the image at design time using the Properties window.
• Load the image at runtime using code.
• Let the user browse for an image using OpenFileDialog.

This flexibility makes PictureBox useful in many practical programs such as picture viewers, slideshows, product catalogs, and educational applications.

The easiest way to load an image is at design time. First, insert a PictureBox on the form. Then set some useful properties:

• Set the form text to something like Picture Viewer.
• Set the PictureBox BorderStyle to FixedSingle.
• Set the background color to white.
• Optionally set the SizeMode so the image stretches to fit the box.

After that, go to the Image property in the Properties window and click the button on the right side to choose an image source.

Choose Local resource, then click Import. This will open a standard file browsing dialog where you can search for image files on your computer.

Once you select an image and click Open, the image will be displayed in the PictureBox.

In Visual Basic 2015, you can also load an image with code while the program is running. This is done using the Image.FromFile(...) method.

Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
    PictureBox1.Image = Image.FromFile("C:\Users\Toshiba\Pictures\sporetrip2014\fish.jpg")
End Sub

This code tells the program to load the image from the specified file path when the form loads. You must know the full file path of the image before writing the code.

When you run the program, the selected image will appear in the PictureBox just like in Figure 7.4.

A more flexible method is to let the user browse for image files while the program is running. This can be done by using the OpenFileDialog control.

First, add a button to the form and change its text to View. Then add the OpenFileDialog control to the form. This control is invisible at runtime, but it helps you display a file browser.

Rename the control to OFGSelectImage. Then set its Filter property so it shows common image types only:

JPEG Files|*.JPG|GIF Files|*.GIF|Windows Bitmaps|*.BMP

You should also delete the default filename in the properties window.

Next, double-click the View button and type the following code:

Private Sub BtnView_Click(sender As Object, e As EventArgs) Handles Button1.Click
    If OFGSelectImage.ShowDialog = Windows.Forms.DialogResult.OK Then
        PictureBox1.Image = Image.FromFile(OFGSelectImage.FileName)
    End If
End Sub

Here is what the code does:

• ShowDialog opens the file selection dialog.
• If the user clicks OK, the program continues.
• OFGSelectImage.FileName stores the selected file path.
• Image.FromFile(...) loads the selected image into the PictureBox.