Introduction to computing

Introduction to computing

• 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 createa ‘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 theopen 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 thewindow 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