Hello World in Visual Basic An Introduction to the Visual Basic IDE and some Vocabulary

Open a Standard Exe Project Select StandardEXE and click the Open button.

Project Explorer menu bar toolbar Toolbox Properties Window Form Layout Window

Change the name of the Form from Form1 to frmHello Click in the (Name) box and type in the adjacent textbox, then hit Enter. Note that the name of the form is changed in the Project Explorer.

Renaming the Form The string entered in the (Name) textbox is the “programming” name of the form, i.e. how one refers to it within a program “frmHello” is an example of the Hungarian notation, a naming convention in VB consisting of two parts A prefix, every VB control has a standard prefix A self-documenting name, a name that conveys something about the project In the convention, the first letter after the prefix is capitalized

Some Hungarian Prefixes chk CheckBox cbo ComboBox cmd CommandButton dlg CommonDialog frm Form fra Frame hsz Hscrollbar img Image lbl Label lst ListBox mnu Menu opt OptionButton pic PictureBox rtf RichTextBox sha Shape txt TextBox tmr Timer upd UpDown

Form Properties The form is the platform on which one builds the graphical user interface (GUI) in VB The form is an object (an instantiation of the Form class) It has a number of properties which are given default values, such as BackColor, Height, Width, etc. The properties’ values can be set At design time: before the program runs At runtime: while the program is executing

Change the color of the form (at design time) Click on the BackColor box, then click on the dropdown arrow in the adjacent box, click on the Palette tab, and click on a color

Result of color change

Change the form’s caption Click in the Caption box and enter the caption in the adjacent textbox. Note that the form’s caption changes accordingly.

Saving the form and project Click on File on the menubar and choose Save Project As …

Saving It is convenient if all of the files for a given project are in a folder designated for that purpose. Minimally a VB project will have a form file having the extension .frm and a project file having the extension .vbp The .frm file contains the code one writes and is the more important file

Creating a project folder if one was not prepared ahead of time

Creating a project folder if one was not prepared ahead of time Use the dropdown arrow next to the “Save in” box to determine the location of the project folder Right click in the region below and choose New from the context-sensitive menu Choose Folder from the resulting submenu A new folder will appear in the region with the name New Folder highlighted in blue Click in the highlighted region and rename the folder Double click on the folder just created

Save the form file in the project folder VB will automatically give the file the same name as entered in the (Name) textbox in the Properties Window. Click Save.

Save the project file in the project folder Next one is prompted to save the project, change the file name from its default value and click Save.

Programming name vs. file name These two names can be the same or different. One can use the File/Save frmHello.frm As … to change the save a copy of the file with another name.

Warning about Saving When building a project around a pre-existing form it is easy to save the project file (.vbp) in a different location which is usually undesirable If one tries to use Save Project As … to transfer a project to another location, one may only succeed in transferring the project (.vbp) file and not the form (.frm) files which are more important

Adding a Control from the Toolbox To add a control to the form click on the icon for that control on the toolbox (it will be surrounded by light gray if it is selected) place the cursor over the form (it will have a cross-hairs icon) Drag the mouse from the upper left-hand corner to the lower right-hand corner of where the control is to appear of the form This process automatically instantiates a control object of the type selected

Example: Adding a CommandButton Dragging the cross hairs determines the Width and Height properties of the object; their values are shown in the tooltip. (These values can be changed.)

Result of Adding a CommandButton A CommandButton with the default name Command1 has been added to the dropdown list in the Properties Window

Changing the CommandButtons properties (at design time) Enter the (Name) cmdPrint and Caption Print in the appropriate textboxes. Note that the BackColor property was changed but the CommandButton remains the default gray color.

The BackColor and Style property of a CommandButton Only when the Style property is changed to Graphical does the BackColor change from default gray.

Adding a Label Click on the label icon on the toolbox, on the form drag from the upper left-hand corner to the lower right-hand corner of where the label is to appear on the form.

Result of adding a Label A Label with the default name Label1 has been added to the dropdown list in the Properties Window

Changing a Label’s properties (at design time) Click in the (Name) box and enter lblMessage in the adjacent textbox. Click on the BackColor box and use the dropdown arrow to select a color.

Changing a Label’s properties (at design time) Click on the BorderStyle box and use the dropdown arrow to select Fixed Single. Next click on the Caption box and clear out the adjacent textbox.

Label versus TextBox One could have chosen to use a TextBox instead of a Label here, but the TextBox would have been overkill A TextBox not only displays text but also allows the user to enter or delete text and thus has many more features associated with this action Another difference is that a TextBox can have scrollbars, making it useful for large amounts of text

Writing code Thus far one has instantiated objects of the control classes, but no code has been written Most VB code is event-driven, that is, a set of statements is executed only as a result of event. An event is an action of the user or occurrence in the system that is detected by the operating system and reported to the program. The set of statements is known as a method.

Viewing the Code To prepare to write code, click on the View Code button in the Project Explorer or click on View on the menubar and choose Code.

Option Explicit VB allows the programmer to use variables that have not been declared; however, doing so can lead to errors that are easy to make and difficult to find Placing “Option Explicit” at the top of the code forces one to declare the variables used therein There is a setting in the VB IDE to add the Option Explicit statement automatically Click on Tools on the menubar, choose Options from the menu, under the Editor tab check Require Variable Declaration

Automatically Include Option Explicit Statement Checking this box is not retroactive, any forms that existed before checking the box will not be affected. In such a case, one simply types Option Explicit at the top of the code.

Identify the event In this simple example the user will click on the button and the message “Hello World” will appear in the label below it Thus the relevant event is clicking the cmdPrint CommandButton and so the code will be placed in the corresponding method (subroutine) To avoid typos, one should not type the first and last lines of the method but have the VB IDE supply them To do this use the Object and Procedure dropdown boxes at the top of the code area

Using the Object and Procedure dropdown boxes Click on the Object dropdown box and select the object of interest. This action will provide the template for the default event/method associated with that object.

Result of selecting an object from Object dropdown box The template for the default method. If the event/method desired is not the default one, click on the Procedure dropdown box and choose the event/method from the list. (Eliminate the default template if it is not being used.)

Adding code to the cmdPrint_Click method Start typing code in the template provided. Dropdown list of properties and methods appears (part of IntelliSense).

About code It is conventional to indent all the code within a block. VB is not case-sensitive, the name of the control was lblMessage, but lblmessage works as well. In fact, VB will eventually capitalize the M automatically The properties and methods associated with an object are accessed using the dot notation (e.g. lblMessage.Caption). If VB recognizes the object, it provides a drop-down list of properties and methods available. One can select from the list or just type it oneself. The absence of a dropdown box often indicates a typo.

Assigning a string to the lblMessage’s Caption property The value on the right (the literal string “Hello World”) is placed in the memory location associated with what’s on the left (the Caption property of the lblMessage object). Labels automatically display their Caption property.

Executing the program One runs the program by clicking on the Start button (with the arrow) or clicking on Run on the menubar and choosing Start.

Hello World Executing

After Clicking the Print button One stops the program by clicking on the Close () button at the upper right-hand corner of the form or by clicking on the End () button on VB’s toolbar. There is a distinction that is important in projects having multiple forms.

Saving Unlike standard C++ and Java IDEs in which the code is saved when it is compiled, the default in VB is that it is not saved at this time. This is both good and bad. Pro: changes can be tried without their being saved Con: it is easy to forget to save changes There is a setting which will prompt one to save each time the program is run. Go to Tools/Options and click on the Environment tab.

Prompting to Save Changes

Being prompted to Save

Using Form Layout to determine where the executing Form is placed Move the Form icon to the desired position on the screen in the Form Layout window.

Result of Form Layout change

Disabling the button after it is clicked One can prevent the user from clicking the button a second time by setting its Enabled property to False.

Result of Disabling the Button The cmdPrint CommandButton becomes gray indicating that there is no longer any action associated with clicking it.

Visible button

Comments In VB a comment is preceded by a single quote.

Comments Comments do not affect the computer’s execution of the code, rather they are meant to help the human reading code. One sometimes “comments out” code, preventing the code from being compiled or executed without completely eliminating it. There are buttons on the Edit toolbar for commenting out and restoring code

Obtaining the Edit toolbar

Edit toolbar Indent Outdent Comment block Uncomment block

Questions for Steve What is the .vbw file for? What is the .frx (?) file for? Make a point about not declaring controls (under normal circumstances)