A short presentation to get you started working with Visual Basic .NET and using Visual Studio creating a simple windows form application.

2. AS Computing
Unit F452

3.  Building Applications
◦ Creating computer applications in Visual Studio
◦ Creating program code using VB.NET
◦ Testing Code (when it goes wrong!)

4.  First thing you need to do in every Computing class is open
Visual Studio. It can take a while so be patient…

6. You will create a ‘Windows Form Application’
that will allow you to choose and view a picture
in the window that your program runs in.
Follow the instructions on the following slides
to produce your first program!

7. TOOLBOX
PROJECT /
SOLUTION
EXPLORER
DESIGN
WINDOW
OBJECT
PROPERTIES
CODE VIEW

8.  Requirements:
◦ To choose an image file
◦ To show the chosen image file as a picture in a
window of a program
◦ To be able to quit/close the program when required

9.  File
◦ New
 Windows Form Application
 Give it the name ‘Picture Viewer’

10.  Go to the Properties Window
◦ Find Form 1 > Text
◦ Change the ‘Text’ property from ‘Form1’ to ‘Picture
Viewer’
 Click the Save icon at the top!
(do this quite often to prevent losing work)
 Change the Form Size
◦ Form Properties > Size
 Height > 500
 Width > 350

11.  Double-click to add objects:
◦ Add a ‘Button’ from the Toolbox with properties:
 Name – btnSelectPicture
 Location – 295,10 (x and y coordinates!)
 Size - 85,23
 Text - Select Picture

12.  Right click on the button, then copy, then
paste within the form
 This will be the ‘Quit’ Button with properties:
 Name – btnQuit
 Location – 295,40
 Text - Quit

13.  Back to the Toolbox
 Double click on ‘PictureBox’
 This need the following properties:
 Name – picShowPicture
 BorderStyle - FixedSingle
 Location – 8,8
 SAVE!!!

14.  Toolbox
◦ Double-click OpenFileDialog (in Dialogs category)
◦ Note that it is hidden at the bottom!
 Select OpenFileDialog and set properties:
◦ Name - ofdSelectPicture
◦ Filename - (leave this bit blank)
◦ Filter - Windows Bitmaps|*.BMP|JPEG Files|*.JPG
◦ Title - Select Picture

15.  Double-click on the ‘Select Picture’ button
◦ Now you can add code to make it do stuff!
 Enter the code from the following slides

16. ' Show the open file dialog box
If ofdSelectPicture.ShowDialog = DialogResult.OK Then
' Load the picture into the picture box
picShowPicture.Image = Image.FromFile(ofdSelectPicture.FileName)
' Show the name of the file in the form's caption
Me.Text = "Picture Viewer(" & ofdSelectPicture.FileName & ")"
End If

17. ' Close the window and exit the application
Me.Close()

18.  Click SAVE!
 Click the green RUN (triangle) button at the
top in the main toolbar
 Try choosing a picture!
 Click ‘Quit’ to close your program

19. 1. What type of VB program creates a standard
Windows program?
2. What window is used to change attributes of
a form or control in the IDE?
3. How do you access the code of a control?
4. What property of a picture box do you set to
display an image?
5. What is the default event for a button
control?

20. 1. Windows Form Application
2. Properties Window
3. Double-click an object in design view
4. The IMAGE property
5. The CLICK event