Beginning Visual Basic .NET - Project 8

Menus

The 8th Project

Removing your old project and creating a new one

Run Visual Basis .NET and open your Solution (<your name>.sln).

Right-click on the Project7 project in the Solution Explorer window and select Remove from the context menu.  Click the OK button when warned that Project7 will be removed from the Solution.  Drop down the File menu,  Under the Add Project menu item, select New Project.  When the Add New Project dialog appears, be sure that the Visual Basic Projects folder is open in the Project Types pane, and that the Windows Application template is selected in the Templates pane.  Type Project8 in the Name textbox.  Then click the OK button.  This creates a new folder inside the \Visual Studio Projects\<Your Name> folder named Project8:

        ...My Documents\Visual Studio Projects\<Your Name>\Project8.

Note: When class is over, be sure to follow the instructions at the end of this project that tell you how to copy your project to your floppy diskette so you can take it home with you.

Rename the Form file and change it's Name and Text properties

With the form file (Form1.vb) selected in the Solution Explorer window, so that it's File properties are displayed in the Properties window, change the File Name property to frmProj8.vb (don't forget to include the .vb extension).

Now click on the form in the Designer window to display it's properties:

Setting the Startup Object

Right-click on the Project8 project in your Solution Explorer window, click on the Properties item at the bottom of the context-menu.  In the Project8 Property Pages dialog drop down the Startup object list and choose frmProj8 and click the OK button.

Before going on, click on the Save All button on the toolbar to save your project.

 

Creating a Menu

For your eighth Visual Basic project, you will create a program that displays 3 Labels and an Exit Button. A Menu with the following structure will allow the user to choose the background color of each Label. A check mark will appear on the Menu next to the color that has been selected, and the corresponding Label’s background color will change to that color. Suggested Names (use them!) for the menu items follow the Text names.

Menu Table
Level 1
Text		 Level 2
Text		 Level 3
Text		 Name Checked
&File     (default name)  
  Box &1   (default name)  
    &White mnuB1White True
    &Red mnuB1Red False
    &Blue mnuB1Blue False
    &Purple mnuB1Purple False
  Box &2   (default name)  
    &White mnuB2White True
    &Red mnuB2Red False
    &Blue mnuB2Blue False
    &Purple mnuB2Purple False
  Box &3   (default name)  
    &White mnuB3White True
    &Red mnuB3Red False
    &Blue mnuB3Blue False
    &Purple mnuB3Purple False
  (Insert Separator)      
  E&xit   mnuExit False

The Menu Table above builds this menu:

Adding a MainMenu control to the form

Double-click on the MainMenu item on the Control toolbox to add a MainMenu control (MainMenu1) to the Component Tray.  Once added to your project, the MainMenu control appears in the Component Tray, like this:

Note: The Component Tray at the bottom of the screen is normally hidden when it is empty.  Items that appear in the Component Tray either have no visual interface (like a Timer control for example) or, in the case of a MainMenu control, can be used on multiple forms in the same project. 

To add MainMenu1 to the form, set the Menu property of the form to MainMenu1, like this:

After setting the Menu property to MainMenu1, click once on the MainMenu1 control in the Component Tray to selected it.  Once ManuMenu1 is selected in the Component Tray, the new blank menu should appear in the upper left corner of the form, like this:

Place the cursor on the Type Here text by clicking on it, and the menu will look like this:

Type &File for the text value, leave the default name (MenuItem1) unchanged. Now place the cursor in the first menu entry on the File menu by clicking it:

Type Box &1 for the text value, leave the default name (MenuItem2) unchanged. Place the cursor in the first menu item on the Box 1 submenu by clicking on it:

Type &White as the text value, then click in the Properties window to display it's Properties. Now type mnuB1White for the name:

Now place the cursor in the second Box 1 submenu item:

Type &Red as the text value, then click in the Properties window to display it's Properties. Name this menu item mnuB1Red.  Use the Menu Table above to guide you, and complete the rest of the menu.  When you get to the addition of the separator (near the bottom of the Menu Table), right-click on the menu item where the separator is to go and choose Insert Separator from the context menu:

Don't forget to set the Checked Property of mnuB1White, mnuB2White, and mnuB3White, to True.

Adding the Label controls to the form

Use the following illustration as a guide and add the 3 Labels as shown:

Set the properties of the labels like so:

First Label Second Label Third Label
Property Value Property Value Property Value
Name lblBox1 Name lblBox2 Name lblBox3
BackColor White BackColor White BackColor White
BorderStyle Fixed3D BorderStyle Fixed3D BorderStyle Fixed3D
Text (blank) Text (blank) Text (blank)

Here’s how you do it

To set the BackColor property of the Labels, we will be using the System.Drawing.Color.FromKnownColor method, like this (don't type this line of code):

lblBox1.BackColor =  _
    System.Drawing.Color.FromKnownColor(<Color Value>)

For the <Color Value> parameter, we will create a set of constants.  These will be assigned values from the KnownColor enumeration, like this:

Const WHITE As Integer = System.Drawing.KnownColor.White
Const BLUE As Integer = System.Drawing.KnownColor.Blue
Const RED As Integer = System.Drawing.KnownColor.Red
Const PURPLE As Integer = System.Drawing.KnownColor.Purple

Add the above lines of code to the Declarations section right now, as show in the following illustration:

A constant (Const) is a name that represents a value, that can be used in your code in place of that actual value.  The purpose of constants is to make your code more readable.  So that a line of code like this:

lblBox1.BackColor = _
    System.Drawing.Color.FromKnownColor(System.Drawing.KnownColor.White)

Which is long and hard to read, can be converted to this, with a constant that represents the System.Drawing.KnownColor.White value with a single word:

lblBox1.BackColor =  _
    System.Drawing.Color.FromKnownColor(WHITE)

Constants are not like variables, because the value in a constant can never be modified.

Scope (again)

The declarations for these constants are placed in the Declarations section so that they can be usable throughout the entire program (within every event procedure). Once declared in the Declarations section of a form, these constants have Public (or global) Scope. A variable’s Scope determines its range of visibility:

An example of the code in mnuB1Blue_Click

As an example of the code which should appear in the Click event procedure for each sub-menu item—White, Red, Blue, and Purple—here is the code from the mnuB1Blue_Click event procedure. The mnuB1Blue_Click event procedure is executed whenever the User selects the Blue sub-menu item under the Box 1 menu. Each line is described below:

'Is the Box1 Blue menu item not checked?
If mnuB1Blue.Checked <> True Then
    mnuB1White.Checked = False
    mnuB1Red.Checked = False
    mnuB1Blue.Checked = True
    mnuB1Purple.Checked = False
    lblBox1.BackColor =  _
            System.Drawing.Color.FromKnownColor(BLUE)
End If

  1. The first line of code above examines the Checked property of mnuB1Blue. If it’s value is True then it’s already checked and there’s nothing left to do (<> means not equal to).
  2. The second line above sets the Checked property of the mnuB1White menu item to False. Why? Because the User just selected the mnuB1Blue menu item; if the mnuB1White menu item was checked before, setting its Checked property to False un-checks it.
  3. The third line above sets the Checked property of the mnuB1Red menu item to False, for the same reason mentioned in 2 above.
  4. The fourth line above sets the Checked property of the mnuB1Blue menu item to True, to add a check mark to the menu item.
  5. The fifth line above sets the Checked property of the mnuB1Purple menu item to False, for the same reason mentioned in 2 above.
  6. The sixth line above uses the FromKnownColor method to set the BackColor property of lblBox1 to the color blue.
This code structure is virtually identical for all the Click event procedures of all the other menu items. Good luck.

Save and test your program thoroughly. That completes this project.

Suggested Enhancement

To copy a Project folder from your Solution on the Hard Drive to a floppy diskette, follow these steps:

  1. Exit Visual Basic .NET and insert the floppy diskette, that you want to copy the Project folder to, into drive A:
  2. Select the My Documents item on the Start Menu to open the My Documents folder.
  3. In the My Documents folder, double-click the Visual Studio Projects folder to open it.
  4. Double-click on your Solution folder to open it (it should have your name).
  5. Open the Project folder that you want to copy, by double-clicking on it.

Deleting the Obj and Bin folders from inside the Project folder before copying it.

  1. Inside the Project folder, delete the Obj and Bin folders--these folders are created automatically when you open a project.  You do not need to copy them, or their contents, to your floppy diskette.
  2. Hit the Backspace key once--or click the Back button on the toolbar.  This moves you from inside the Project folder to back inside your Solution folder.
  3. Right-click on the Project folder and selected: 3 1/2" Floppy A: on the Send To fly-out menu.  This copies the Project folder to your floppy diskette.