Home

Introduction to Applications Menus

 

The Main Menu

 

Introduction

When it comes to a restaurant, a menu is a list of food items that the business offers to its customers. For a computer application, a menu is a list of actions that can be performed on that program. To be aware of these actions, the list must be presented to the user upon request. On a typical DOS application, a menu is presented with numerical or character options that the user can select from. An example would be:

Here are the various options:
1. Register a new student
2. Review a student's information
3. Enter student's grades
4. Close the application

The user would then enter the number (or character) that corresponds to the desired option and continue using the program. For a graphical application, a menu is presented as a list of words and, using a mouse or a keyboard, the user can select the desired item from the menu.

To enhance the functionality of a graphical application, also to take advantage of the mouse and the keyboard, there are various types of menus. A menu is considered a main menu when it carries most of the actions the user can perform on a particular application. Such a menu is positioned in the top section of the form in which it is used.

A main menu is divided in categories of items and each category is represented by a word. In WordPad, the categories of menus are File, Edit, View, Insert, Format, and Help:

Main Menu

To use a menu, the user first clicks one of the words that displays on top. When clicked, the menu expands and displays a list of items that belong to that category. Here is an example:

Menu Category

There is no strict rule on how a menu is organized. There are only suggestions. For example, actions that are related to file processing, such as creating a new file, opening an existing file, saving a file, printing the open file, or closing the file usually stay under a category called File. In the same way, actions related to viewing documents can be listed under a View menu category.

Main Menu Creation

To support actions that are used to graphically enhance the functionality of an application, the .NET Framework provides the ToolStrip class. To support menus for an application, the .NET Framework provides the MenuStrip class (in Microsoft Visual Studio 2002 and 2003, the main menu was implemented through the MainMenu class, which is still available but lacks some features).

To graphically create a main menu, in the Menus & Toolbars section of the Toolbox, you can click the MenuStrip button MenuStrip and click the form that will use the menu. After clicking the form, an empty menu is initiated:

Main Menu

Like every control, the main menu must have a name. After adding the menu strip to a form, you can accept the suggested name or, in the Properties window, click (Name) and type the desired name. You can then use the menu placeholder to add the necessary menu item(s)..

To programmatically create a main menu, declare a handle to MenuStrip class and initialize it with its default constructor. Because the main menu is primarily a control, you must add it to the list of controls of the form. Here is an example:

Imports System.Drawing
Imports System.Windows.Forms

Module Exercise

    Public Class Starter
        Inherits Form

        Private MenuMain As MenuStrip

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            MenuMain = New MenuStrip
            Controls.Add(MenuMain)
        End Sub

    End Class

    Function Main() As Integer

        Dim frmStart As Starter = New Starter

        Application.Run(frmStart)

        Return 0
    End Function

End Module

Menu Categories

In our introduction, we saw that a main menu was made of categories represented in the top section. After adding a MenuStrip, you can start creating the desired menu categories. To graphically create a menu category:

  • In the menu strip, you can click the Type Here line and type the desired string
  • In the menu strip, you can click Type Here. Then, in the Properties window, click the Text field and type the desired string

To create the next menu category, you can click Type Here on the right side of the previous menu category. In the same way, you can continue creating the desired menu categories.

Here is an example:

Main Menu

Besides clicking Type Here and typing a string, an alternative is to get assisted by a dialog box. To open it:

  • Under the form, you can click the menu strip object and, in the Properties window, you can click the ellipsis button of the Items field
  • Under the form, you can right-click the menu strip and click Edit Items...

A dialog box, titled Items Collection Editor, would come up:

To create a menu category, in the Select Item And Add To List Below combo box, select MenuItem and click the Add button. In the right list, configure the menu item. At a minimum, you should specify its caption in the Text field. Like every control, each menu item has a name. To make sure you can easily recognize it in your code, when creating a menu item, you should give it a name unless you are contempt with the suggested one. After creating the menu categories, you can click OK and keep the dialog box opened for more options.

To support menu items, the .NET Framework provides the ToolStripMenuItem class. Using it, to create a menu category, declare a handle to this class and initialize it using one of its constructors. The default constructor is used to create a menu item without specifying any of its options. Here is an example:

Module Exercise

    Public Class Starter
        Inherits Form

        Private MenuMain As MenuStrip
        Private MenuFile As ToolStripMenuItem

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            MenuMain = New MenuStrip
            MenuFile = New ToolStripMenuItem
            Controls.Add(MenuMain)
        End Sub

    End Class

End Module

To specify the caption that will be displayed on a menu category, you can use the following constructor of the ToolStripMenuItem class:

Public Sub New(text As String)

Here is an example:

Public Sub InitializeComponent()
            MenuMain = New MenuStrip
            MenuFile = New ToolStripMenuItem("File")
            Controls.Add(MenuMain)
End Sub

If you had instantiated the class using its default constructor, to specify its caption, the ToolStripMenuItem class is equipped with the Text property. Therefore, assign a string to this property. Here is an example:

Module Exercise

    Public Class Starter
        Inherits Form

        Private MenuMain As MenuStrip
        Private MenuFile As ToolStripMenuItem
        Private MenuEdit As ToolStripMenuItem

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            MenuMain = New MenuStrip
            MenuFile = New ToolStripMenuItem("File")
            MenuEdit = New ToolStripMenuItem()
            MenuEdit.Text = "Edit"

            Controls.Add(MenuMain)
        End Sub

    End Class

End Module

In the same way, you can create as many menu categories as you judge necessary for your application.

Introduction to Menu Items

In our introduction, we saw that if you click a menu category, a list comes up. Here is an example:

Menu expanded

The objects under a menu category are referred to as menu items. To graphically create a menu item, first access the menu strip, which you can do by clicking it under the form. On the form, click a menu category. Once you do, a placeholder would be displayed under it:

To create a menu item:

  • Under a category, click Type Here and type the desired caption. 
  • Click the menu category. Then, in the Properties window, click Text and type the desired string.

In the same way, to create the next menu item, under the same category, click the next Type Here and type the desired caption or change the Text value in the Properties window.

An alternative is to use a dialog box. To access it, in the menu designer:

  • Right-click the menu category and click Edit Drop Down Items...
  • Click the menu category. Then, in the Properties window, click the ellipsis button of the DropDownItems field

The Items Collection Editor dialog box would come up:

Items Collection Editor

To create a menu item, in the Select Item And Add To List Below combo box, select MenuItem and click Add. On the right side, configure the menu item as you see fit. At a minimum, you should specify its caption in the Text field.

Both the menu category and the menu item are created using the ToolStripMenuItem class. Here are examples:

Module Exercise

    Public Class Starter
        Inherits Form

        Private MenuMain As MenuStrip
        Private MenuFile As ToolStripMenuItem
        Private MenuFileNew As ToolStripMenuItem
        Private MenuFileExit As ToolStripMenuItem
        Private MenuEdit As ToolStripMenuItem
        Private MenuEditCopy As ToolStripMenuItem

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            MenuMain = New MenuStrip()
            MenuFile = New ToolStripMenuItem("File")
            MenuFileNew = New ToolStripMenuItem("New")
            MenuFileExit = New ToolStripMenuItem("Exit")
            MenuEdit = New ToolStripMenuItem("Edit")
            MenuEditCopy = New ToolStripMenuItem("Copy")
        End Sub

    End Class

End Module

Associating Menu Items to Menu Categories

If you visually create your main menu, the form designer takes care of most details behind the scenes. For example, each menu item is automatically added to its parent menu category. If you programmatically create your main menu, you must associate each menu item to its parent menu category.

To support menu categories, ToolStripMenuItem, the class used to create menu categories, is derived from a class named ToolStripDropDownItem. The ToolStripDropDownItem class is abstract, which means you cannot instantiate it. Instead, it provides functionality to other classes derived from it. The ToolStripDropDownItem class is based on the ToolStripItem class.

To support menu items, the ToolStripDropDownItem class is equipped with a property named DropDownItems. This property is of type ToolStripItemCollection, which a collection-based class. The ToolStripItemCollection class implements the IList and the ICollection interfaces.

To specify that a menu item will be part of a menu category, call the Add() method of the ToolStripItemCollection class. This method is overloaded with various versions. One of the versions uses the following syntax:

Public Function Add(value As ToolStripItem) As Integer

This version allows you to pass a ToolStripItem-type of item class, such as a ToolStripMenuItem object. Here is an example:

Module Exercise

    Public Class Starter
        Inherits Form

        Private MenuMain As MenuStrip
        Private MenuEdit As ToolStripMenuItem
        Private MenuEditCopy As ToolStripMenuItem

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            MenuMain = New MenuStrip
            MenuEdit = New ToolStripMenuItem("Edit")
            MenuEditCopy = New ToolStripMenuItem("Copy")
            MenuEdit.DropDownItems.Add(MenuEditCopy)
        End Sub

    End Class

End Module

The ToolStripItemCollection class also allows you to create a menu item without going through a ToolStripItem-type of object. To support this, its provides the following version of its Add() method:

Public Function Add(	text As String) As ToolStripItem

This method takes as argument the text that the menu item would display and it returns the ToolStripItem item that was created. Here is an example:

Module Exercise

    Public Class Starter
        Inherits Form

        Private MenuMain As MenuStrip
        Private MenuEdit As ToolStripMenuItem
        Private MenuEditCopy As ToolStripMenuItem
        Private MenuEditPaste As ToolStripMenuItem

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            MenuMain = New MenuStrip
            MenuEdit = New ToolStripMenuItem("Edit")
            MenuEditCopy = New ToolStripMenuItem("Copy")
            MenuEdit.DropDownItems.Add(MenuEditCopy)
            MenuEditPaste = CType(MenuEdit.DropDownItems.Add("Paste"), _
                            ToolStripMenuItem)
        End Sub

    End Class

End Module

Instead of adding one menu item at a time, you can create an array of menu items and then add it to a category in one row. To support this, the ToolStripItemCollection class implements the AddRange() method. This method is overloaded with two versions. One of the versions uses the following syntax:

Public Sub AddRange(toolStripItems As ToolStripItem())

When calling this method, you must pass it an array of ToolStripItem-type of objects. Here are two examples:

Module Exercise

    Public Class Starter
        Inherits Form

        Private MenuMain As MenuStrip
        Private MenuFile As ToolStripMenuItem
        Private MenuFileNew As ToolStripMenuItem
        Private MenuFileOpen As ToolStripMenuItem
        Private MenuFileExit As ToolStripMenuItem
        Private MenuEdit As ToolStripMenuItem
        Private MenuEditCopy As ToolStripMenuItem
        Private MenuEditPaste As ToolStripMenuItem
        Private MenuHelp As ToolStripMenuItem

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            MenuMain = New MenuStrip

            MenuFile = New ToolStripMenuItem("File")
            MenuFileNew = New ToolStripMenuItem("New")
            MenuFileOpen = New ToolStripMenuItem("Open")
            MenuFileExit = New ToolStripMenuItem("Exit")
            Dim MenuFileItems() As ToolStripMenuItem = _
                {MenuFileNew, MenuFileOpen, MenuFileExit}
            MenuFile.DropDownItems.AddRange(MenuFileItems)

            MenuEdit = New ToolStripMenuItem("Edit")
            MenuEditCopy = New ToolStripMenuItem("Copy")
            MenuEdit.DropDownItems.Add(MenuEditCopy)
            MenuEditPaste = CType(MenuEdit.DropDownItems.Add("Paste"), _
                                  	  ToolStripMenuItem)

            MenuHelp = New ToolStripMenuItem("Help")
            Dim mnuHelpItems() As ToolStripMenuItem = _
                    { _
                        New ToolStripMenuItem("Search"), _
                        New ToolStripMenuItem("Contents"), _
                        New ToolStripMenuItem("Index"), _
                        New ToolStripMenuItem("Support Web Site"), _
                        New ToolStripMenuItem("About this application") _
                        }
            MenuHelp.DropDownItems.AddRange(mnuHelpItems)
        End Sub

    End Class

End Module

Associating Menu Categories to the Main Menu 

If you visually create your main menu, each menu category is automatically assigned to the menu strip. If you programmatically create your main menu, you must take care of this in order to show the whole menu.

After creating the menu categories, you can add them to the main menu. To support this, the ToolStrip class is equipped with a property named Items and it makes this property available to the MenuStrip class. The Items property is of type ToolStripItemCollection. This class implements the IList, the ICollection, and the IEnumerable interfaces. Therefore, to add a menu category to a MenuStrip object, you can call the Add() method of the ToolStripItemCollection class. This method is overloaded with various versions and we saw that one of them uses the following version:

Public Function Add(value As ToolStripItem) As Integer

You can call this version and pass it a ToolStripItem-type of object, such as a ToolStripMenuItem value. Here is an example:

Imports System.Drawing
Imports System.Windows.Forms

Module Exercise

    Public Class Starter
        Inherits Form

        Private MenuMain As MenuStrip
        Private MenuFile As ToolStripMenuItem
        Private MenuFileNew As ToolStripMenuItem
        Private MenuFileOpen As ToolStripMenuItem
        Private MenuFileExit As ToolStripMenuItem
        Private MenuEdit As ToolStripMenuItem
        Private MenuEditCopy As ToolStripMenuItem
        Private MenuEditPaste As ToolStripMenuItem
        Private MenuHelp As ToolStripMenuItem

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            MenuMain = New MenuStrip

            MenuFile = New ToolStripMenuItem("File")
            MenuFileNew = New ToolStripMenuItem("New")
            MenuFileOpen = New ToolStripMenuItem("Open")
            MenuFileExit = New ToolStripMenuItem("Exit")
            Dim MenuFileItems() As ToolStripMenuItem = _
                {MenuFileNew, MenuFileOpen, MenuFileExit}
            MenuFile.DropDownItems.AddRange(MenuFileItems)

            MenuEdit = New ToolStripMenuItem("Edit")
            MenuEditCopy = New ToolStripMenuItem("Copy")
            MenuEdit.DropDownItems.Add(MenuEditCopy)
            MenuEditPaste = CType(MenuEdit.DropDownItems.Add("Paste"), _
                                  ToolStripMenuItem)

            MenuHelp = New ToolStripMenuItem("Help")
            Dim mnuHelpItems() As ToolStripMenuItem = _
                    { _
                        New ToolStripMenuItem("Search"), _
                        New ToolStripMenuItem("Contents"), _
                        New ToolStripMenuItem("Index"), _
                        New ToolStripMenuItem("Support Web Site"), _
                        New ToolStripMenuItem("About this application") _
                        }
            MenuHelp.DropDownItems.AddRange(mnuHelpItems)

            MenuMain.Items.Add(MenuFile)
            Controls.Add(MenuMain)
        End Sub

    End Class

    Function Main() As Integer

        Dim frmStart As Starter = New Starter

        Application.Run(frmStart)

        Return 0
    End Function

End Module

In the same way, you can add the other items. Alternatively, you can create an array of menu categories and add them in a row. To support this, the ToolStripItemCollection is equipped with the AddRange() method that is overloaded with two versions. One of the versions uses the following syntax:

Public Sub AddRange(toolStripItems As ToolStripItem())

When calling this method, pass it an array of ToolStripItem types of values. Here is an example:

Imports System.Drawing
Imports System.Windows.Forms

Module Exercise

    Public Class Starter
        Inherits Form

        Private MenuMain As MenuStrip
        Private MenuFile As ToolStripMenuItem
        Private MenuFileNew As ToolStripMenuItem
        Private MenuFileOpen As ToolStripMenuItem
        Private MenuFileExit As ToolStripMenuItem
        Private MenuEdit As ToolStripMenuItem
        Private MenuEditCopy As ToolStripMenuItem
        Private MenuEditPaste As ToolStripMenuItem

        Private MenuView As ToolStripMenuItem

        Private MenuHelp As ToolStripMenuItem

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            MenuMain = New MenuStrip

            MenuFile = New ToolStripMenuItem("File")
            MenuFileNew = New ToolStripMenuItem("New")
            MenuFileOpen = New ToolStripMenuItem("Open")
            MenuFileExit = New ToolStripMenuItem("Exit")
            Dim MenuFileItems() As ToolStripMenuItem = _
                {MenuFileNew, MenuFileOpen, MenuFileExit}
            MenuFile.DropDownItems.AddRange(MenuFileItems)

            MenuEdit = New ToolStripMenuItem("Edit")
            MenuEditCopy = New ToolStripMenuItem("Copy")
            MenuEdit.DropDownItems.Add(MenuEditCopy)
            MenuEditPaste = CType(MenuEdit.DropDownItems.Add("Paste"), _
                                  ToolStripMenuItem)

            MenuView = New ToolStripMenuItem("View")
            Dim MenuViewItems() As ToolStripMenuItem = _
            { _
                New ToolStripMenuItem("Standard Toolbar"), _
                New ToolStripMenuItem("Formatting Toolbar"), _
                New ToolStripMenuItem("Status Bar") _
            }
            MenuView.DropDownItems.AddRange(MenuViewItems)

            MenuHelp = New ToolStripMenuItem("Help")
            Dim mnuHelpItems() As ToolStripMenuItem = _
            { _
                        New ToolStripMenuItem("Search"), _
                        New ToolStripMenuItem("Contents"), _
                        New ToolStripMenuItem("Index"), _
                        New ToolStripMenuItem("Support Web Site"), _
                        New ToolStripMenuItem("About this application") _
            }
            MenuHelp.DropDownItems.AddRange(mnuHelpItems)

            Dim mnuAccessories() As ToolStripMenuItem = {MenuView, MenuHelp}

            MenuMain.Items.Add(MenuFile)
            MenuMain.Items.AddRange(mnuAccessories)

            Controls.Add(MenuMain)
        End Sub

    End Class

    Function Main() As Integer

        Dim frmStart As Starter = New Starter

        Application.Run(frmStart)

        Return 0
    End Function

End Module

This would produce:

Main menu

Practical LearningPractical Learning: Creating a Menu

  1. Start Microsoft Visual Basic
  2. Create a new Windows Application named AltairRealtors3
  3. In the Solution Explorer, right-click Form1.vb and click Rename
  4. Type AltairRealtors.vb and press Enter
  5. From the Menus & Toolbars section of the Toolbox, click the MenuStrip button MenuStrip and click the form
  6. While the menu strip is still selected, in the Properties window, click (Name), type MenuMain  and press Enter
  7. On the form, click Type Here, type File and press Enter
  8. On the form, click File.
    In the Properties window, click (Name) and type MenuFile
  9. On the form, click File and under it, click the Type Here box
  10. Type New Property and press Enter
  11. On the form, click File and click New Property.
    In the Properties window, click (Name) and type MenuFileNewProperty
  12. On the form, click File and, under New Property, click the Type Here box
  13. Type Exit and press Enter
  14. On the form, click File and click Exit.
    In the Properties window, click (Name) and type MenuFileExit
  15. Complete the design of the form as follows:
     
    Altair Realtors - Available Properties Listing
    Control Text Name Other Properties
    MenuStrip MenuStrip      
    Label Label Altair Realtors - Properties Listing   Font: Times New Roman, 21.75pt, style=Bold
    ForeColor: MediumBlue
    ListView ListView   lvwProperties  
    Columns (Name) Text TextAlign Width
    colPropertyNumber Prop #   50
    colPropertyType Property Type   78
    colAddress Address   130
    colCity City   80
    colState State   40
    colZIPCode ZIP Code Center 58
    colBedrooms Beds Right 40
    colBathrooms Baths Right 40
    colMarketValue Market Value Right 75
  16. On the main menu, click Project -> Add Windows Form...
  17. Set the Name to RealEstateProperty and click Add
  18. Design the form as follows:
     
    Altair Realtors
    Control Text Name Other Properties
    Label Label Property #:    
    TextBox TextBox   txtPropertyNumber Modifiers: Public
    Label Label Property Type:    
    ComboBox ComboBox   cbxPropertyTypes Modifiers: Public
    Items:
    Unknown
    Single Family
    Townhouse
    Condominium
    Label Label Address:    
    TextBox TextBox   txtAddress Modifiers: Public
    Label Label City:    
    TextBox TextBox   txtCity Modifiers: Public
    Label Label State:    
    ComboBox TextBox   cbxStates Modifiers: Public
    Items:
    DC
    MD
    PA
    VA
    WV
    Label Label ZIP Code:    
    TextBox TextBox   txtZIPCode Modifiers: Public
    Label Label Bedrooms:    
    TextBox TextBox 0 txtBedrooms Modifiers: Public
    Label Label Bathrooms:    
    TextBox TextBox 1.0 txtBathrooms Modifiers: Public
    Label Label Market Value:    
    TextBox TextBox 0.00 txtMarketValue Modifiers: Public
    Button Button OK btnOK DialogResult: OK
    Button Button Cancel btnCancel DialogResult: Cancel
    Form
    FormBorderStyle: FixedDialog
    Text: Altair Realtors - Available Property
    StartPosition: CenterScreen
    AcceptButton: btnOK
    CancelButton: btnCancel
    MaximizeBox: False
    MinimizeBox: False
    ShowInTaskBar: False
  19. Display the AltairRealtors form

Coding a Menu Item

If you create a menu as we have just done, to write code for one of the menu items, you can double-click the menu item. This would open the Click event of the menu item in the Code Editor and you can start writing the desired code for that item.

Practical LearningPractical Learning: Writing Code For a Main Menu

  1. Right-click the form and click View Code
  2. In the Class Name combo box, select MenuFileNewProperty
  3. In the Method Name combo box, select Click and implement the event as follows:
     
    Private Sub MenuFileNewProperty_Click(ByVal sender As Object, _
                                              ByVal e As System.EventArgs) _
                                              Handles MenuFileNewProperty.Click
            Dim rndNumber As Random
            Dim number1 As Integer
            Dim number2 As Integer
            Dim PropertyNumber As String
            Dim dlgProperty As RealEstateProperty
    
            rndNumber = New Random(DateTime.Now.Millisecond)
            number1 = rndNumber.Next(100, 999)
            number2 = rndNumber.Next(100, 999)
            PropertyNumber = number1 & number2
            dlgProperty = New RealEstateProperty
    
            dlgProperty.txtPropertyNumber.Text = PropertyNumber
            dlgProperty.Text = "Altair Realtors - New Property"
    
            If dlgProperty.ShowDialog() = Windows.Forms.DialogResult.OK Then
                Dim strPropertyType As String = dlgProperty.cbxPropertyTypes.Text
                Dim strAddress As String = dlgProperty.txtAddress.Text
                Dim strCity As String = dlgProperty.txtCity.Text
                Dim strState As String = dlgProperty.cbxStates.Text
                Dim strZIPCde As String = dlgProperty.txtZIPCode.Text
                Dim strBedrooms As String = dlgProperty.txtBedrooms.Text
                Dim strBathrooms As String = dlgProperty.txtBathrooms.Text
                Dim strMarketValue As String = dlgProperty.txtMarketValue.Text
    
                Dim lviProperty As ListViewItem = _
                    New ListViewItem(dlgProperty.txtPropertyNumber.Text)
    
                lviProperty.SubItems.Add(strPropertyType)
                lviProperty.SubItems.Add(strAddress)
                lviProperty.SubItems.Add(strCity)
                lviProperty.SubItems.Add(strState)
                lviProperty.SubItems.Add(strZIPCde)
                lviProperty.SubItems.Add(strBedrooms)
                lviProperty.SubItems.Add(strBathrooms)
                lviProperty.SubItems.Add(strMarketValue)
                lvwProperties.Items.Add(lviProperty)
            End If
    End Sub
  4. In the Class Name combo box, select MenuFileExit
  5. In the Method Name combo box, select Click and implement the event as follows:
     
    Private Sub MenuFileExit_Click(ByVal sender As Object, _
                                       ByVal e As System.EventArgs) _
                                       Handles MenuFileExit.Click
            End
    End Sub
  6. Execute the application
     
    Using a menu item at execution time
  7. To close the form, click File -> Exit

Contextual Menus

 

Introduction

In our introduction to the main menu, we saw that, to access it, the user clicks one of its categories. A contextual menu is one that appears when the user right-clicks an area of an application or form. In most applications, when the user right-clicks a title bar, the operating system is configured to display a system menu. Here is an example:

Operating system's title bar menu

A menu is considered, or qualifies as, popup if, or because, it can appear anywhere on the form as the programmer wishes. Such a menu is also referred to as context-sensitive or contextual because its appearance and behavior depend on where it displays on the form or on a particular control. The person who creates the application decides if or where the contextual menu would appear. Because this characteristic is up to the programmer, the same application can display different types of popup menus depending on where the user right-clicks. Here are examples:

Context-sensitive menu

Contextual menu

The first difference between a main menu and a popup menu is that a popup menu appears as one category or one list of items and not like a group of categories of menus like a main menu. Secondly, while a main menu by default is positioned on the top section of a form, a popup menu doesn't have a specific location on the form.

Creating a Contextual Menu

To support the creation and management of contextual menus, the .NET Framework provides the ContextMenuStrip class. This class is derived from ToolStripDropDownMenu, which itself is based on the ToolStripDropDown class. The ToolStripDropDown class is derived from ToolStrip.

To visually create a contextual menu, in the Menus & Toolbars section of the Toolbox, click the ContextMenuStrip button and click the form. Once you have a ContextMenuStrip object, you can create its menu items. To do this, as mentioned for the MenuStrip, you can click the first Type Here line, type a string, press Enter, and continue creating the other menu items in the same way.

Unlike a main menu, a popup menu provides a single list of items. If you want different popup menus for your form, you have two options. You can create various popup menus or programmatically change your single popup menu in response to something or some action on your form.

To programmatically create a contextual menu, start by declaring a handle to ContextMenuStrip. Here is an example:

Imports System.Drawing
Imports System.Windows.Forms

Module Exercise

    Public Class Starter
        Inherits Form

        Private Contextual As ContextMenuStrip

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()

            Contextual = New ContextMenuStrip

        End Sub

    End Class

    Function Main() As Integer

        Dim frmStart As Starter = New Starter

        Application.Run(frmStart)

        Return 0
    End Function

End Module

To assist you with each item of a contextual menu, ToolStrip, the ancestor to the ContextMenuStrip class, is equipped with a property named Items. This property is of type ToolStripItemCollection, which is a collection-based class. The ToolStripItemCollection class implements the IList, the ICollection, and the IEnumerable interfaces.

To create one or more menu items, you can use the various techniques we reviewed for the main menu. Here are examples:

Imports System.Drawing
Imports System.Windows.Forms

Module Exercise

    Public Class Starter
        Inherits Form

        Private MenuEditCut As ToolStripMenuItem
        Private Contextual As ContextMenuStrip

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()

            Contextual = New ContextMenuStrip
            MenuEditCut = New ToolStripMenuItem("Cut")

            Dim MenuEdit() As ToolStripMenuItem = _
            { _
                New ToolStripMenuItem("Copy"), _
                New ToolStripMenuItem("Paste") _
            }

        End Sub

    End Class

    Function Main() As Integer

        Dim frmStart As Starter = New Starter

        Application.Run(frmStart)

        Return 0
    End Function

End Module

After creating a menu item, to add it to the contextual menu, you can call the ToolStripItemCollection.Add() method. To add an array of items, you can call the create ToolStripItemCollection.AddRange() method. Here are examples:

Public Sub InitializeComponent()

            Contextual = New ContextMenuStrip
            MenuEditCut = New ToolStripMenuItem("Cut")

            Dim MenuEdit() As ToolStripMenuItem = _
            { _
                New ToolStripMenuItem("Copy"), _
                New ToolStripMenuItem("Paste") _
            }

            Contextual.Items.Add(MenuEditCut)
            Contextual.Items.AddRange(MenuEdit)

End Sub

Practical Learning Practical Learning: Introducing Contextual Menus

  1. From the Menus & Toolbars section of the Toolbox, click ContextMenuStrip and click the form
  2. While the context menu strip is still selected, in the Properties window click (Name) and type MenuWithProperties
  3. Then click Items and click its ellipsis button
  4. Under the Select Item And Add To List combo box, make sure MenuItem is selected and click Add
  5. On the right side, click Text and type Edit
  6. Click (Name) and type MenuEditProperty
  7. On the left side, click Add and, on the right side, change the properties as follows:
    Text: Delete
    (Name): MenuDeleteProperty
  8. On the left side, click Add and, on the right side, change the properties as follows:
    Text: Clear
    (Name): MenuClearProperties
     
    Items Collection Editor
  9. Click OK
  10. From the Menus & Toolbars section of the Toolbox, click ContextMenuStrip and click the form
  11. While the context menu strip is still selected, in the Properties window click (Name) and type MenuNoProperty
  12. On the form, under ContextMenuStrip, click Type Here
  13. Type New Property and press Enter
  14. On the form, under ContextMenuStrip, click New Property
  15. In the Properties window, click (Name), type MenuNewProperty and press Enter

Using a Contextual Menu

By default, a newly created contextual menu is attached neither to the form nor to any control on it. In order to display a context menu, you must assign its name to the control. To support this, Control, the ancestor to all visual controls of the .NET Framework, is equipped, and provides to its children, a property named ContextMenuStrip, which is of type ContextMenuStrip.

To visually assign a contextual menu to a control during design, click the control. In the Properties window, click the ContextMenuStrip field, then click the arrow of its combo box, and select the menu. If you had created more than one contextual menu, the combo box would show all of them and you can choose the one you want to use as default.

To programmatically specify the contextual menu of a control, assign a ContextMenuStrip object to its ContextMenuStrip property. Here is an example:

Public Sub InitializeComponent()

            Contextual = New ContextMenuStrip
            MenuEditCut = New ToolStripMenuItem("Cut")

            Dim MenuEdit() As ToolStripMenuItem = _
            { _
                New ToolStripMenuItem("Copy"), _
                New ToolStripMenuItem("Paste") _
            }

            Contextual.Items.Add(MenuEditCut)
            Contextual.Items.AddRange(MenuEdit)

            ContextMenuStrip = Contextual

End Sub

After assigning a ContextMenuStrip object to a control, when you right-click (actually when the user right-clicks) the control, the contextual menu would display. The above code would produce:

Contextual Menu

Practical LearningPractical Learning: Creating a Context Menu

  1. Right-click the form and click View Code
  2. Just under the Public Class AltairRealtors line, declare a ListViewItem variable named itmSelected
     
    Public Class AltairRealtors
    
        Private itmSelected As ListViewItem
    
    . . . No Change
    
    
  3. In the Class Name combo box, select (AltairRealtors Events)
  4. In the Method Name combo box, select Load and implement the event as follows:
     
    Private Sub AltairRealtors_Load(ByVal sender As Object, _
                                        ByVal e As System.EventArgs) _
                                        Handles Me.Load
            itmSelected = New ListViewItem()
            lvwProperties.ContextMenuStrip = MenuNoProperty
    End Sub
  5. In the Class Name combo box, select lvwProperties
  6. In the Method Name combo box, select MouseDown and implement the event as follows:
     
    Private Sub lvwProperties_MouseDown(ByVal sender As Object, _
                            ByVal e As System.Windows.Forms.MouseEventArgs) _
                                            Handles lvwProperties.MouseDown
            If e.Button = Windows.Forms.MouseButtons.Right Then
                If lvwProperties.SelectedItems.Count > 0 Then
                    itmSelected = lvwProperties.SelectedItems(0)
                Else
                    itmSelected = Nothing
                End If
            End If
    End Sub
  7. Save the file

Coding Contextual Menus

In your application, you can create as many contextual menus as you want. If you have different controls, each can have its own contextual menu or many can share a contextual menu. Also, you can use different contextual menus for a control and decide what menu to display when/why.

There is nothing particularly specific with writing code for a popup menu item. You approach it exactly as if you were dealing with a menu item of a main menu. You can write code for an item of a popup menu independent of any other item of a main menu. If you want an item of a popup menu to respond to the same request as an item of a main menu, you can write code for one of the menu items (either the item on the main menu or the item on the popup menu) and simply call its Click event in the event of the other menu item.

Practical LearningPractical Learning: Using Various Contextual Menus

  1. In the Class Name combo box, select lvwProperties
  2. In the Method Name combo box, select ItemSelectionChanged and implement the event as follows:
     
    Private Sub lvwProperties_MouseDown(ByVal sender As Object, _
                            ByVal e As System.Windows.Forms.MouseEventArgs) _
                                            Handles lvwProperties.MouseDown
            If e.Button = Windows.Forms.MouseButtons.Right Then
                If lvwProperties.SelectedItems.Count > 0 Then
                    itmSelected = lvwProperties.SelectedItems(0)
                Else
                    itmSelected = Nothing
                End If
            End If
    End Sub
  3. In the Class Name combo box, select MenuEditProperties
  4. In the Method Name combo box, select Click and implement the event as follows:
     
    Private Sub MenuEditProperty_Click(ByVal sender As Object, _
                                           ByVal e As System.EventArgs) _
                                           Handles MenuEditProperty.Click
            ' Prepare to open the AvailableProperties dialog box
            Dim dlgProperty As RealEstateProperty = New RealEstateProperty
    
            ' Make sure an item, and only one, is selected
            If (lvwProperties.SelectedItems.Count = 0) Or _
                (lvwProperties.SelectedItems.Count > 1) Then
                Exit Sub
            End If
    
            ' Identify the item that is currently selected
            Dim lviCurrent As ListViewItem = lvwProperties.SelectedItems(0)
    
            ' Display the ItemDetails dialog box with the item number
            dlgProperty.txtPropertyNumber.Text = lviCurrent.Text
            dlgProperty.cbxPropertyTypes.Text = lviCurrent.SubItems(1).Text
            dlgProperty.txtAddress.Text = lviCurrent.SubItems(2).Text
            dlgProperty.txtCity.Text = lviCurrent.SubItems(3).Text
            dlgProperty.cbxStates.Text = lviCurrent.SubItems(4).Text
            dlgProperty.txtZIPCode.Text = lviCurrent.SubItems(5).Text
            dlgProperty.txtBedrooms.Text = lviCurrent.SubItems(6).Text
            dlgProperty.txtBathrooms.Text = lviCurrent.SubItems(7).Text
            dlgProperty.txtMarketValue.Text = lviCurrent.SubItems(8).Text
    
            If dlgProperty.ShowDialog() = Windows.Forms.DialogResult.OK Then
                lvwProperties.SelectedItems(0).Text = dlgProperty.txtPropertyNumber.Text
                lvwProperties.SelectedItems(0).SubItems(1).Text = dlgProperty.cbxPropertyTypes.Text
                lvwProperties.SelectedItems(0).SubItems(2).Text = dlgProperty.txtAddress.Text
                lvwProperties.SelectedItems(0).SubItems(3).Text = dlgProperty.txtCity.Text
                lvwProperties.SelectedItems(0).SubItems(4).Text = dlgProperty.cbxStates.Text
                lvwProperties.SelectedItems(0).SubItems(5).Text = dlgProperty.txtZIPCode.Text
                lvwProperties.SelectedItems(0).SubItems(6).Text = dlgProperty.txtBedrooms.Text
                lvwProperties.SelectedItems(0).SubItems(7).Text = dlgProperty.txtBathrooms.Text
                lvwProperties.SelectedItems(0).SubItems(8).Text = dlgProperty.txtMarketValue.Text
            End If
    End Sub
  5. In the Class Name combo box, select MenuDeleteProperty
  6. In the Method Name combo box, select Click and implement the event as follows:
     
    Private Sub MenuDeleteProperty_Click(ByVal sender As Object, _
                                             ByVal e As System.EventArgs) _
                                             Handles MenuDeleteProperty.Click
            If lvwProperties.SelectedItems.Count = 0 Then Exit Sub
            Dim Answer As MsgBoxResult
    
            Answer = MsgBox("Are you sure you want " & _
                            "to delete that property?", _
                            MsgBoxStyle.YesNo Or MsgBoxStyle.Question, _
                            "Delete Property")
    
            If Answer = MsgBoxResult.Yes Then
                lvwProperties.SelectedItems(0).Remove()
            End If
    End Sub
  7. In the Class Name combo box, select MenuClearProperty
  8. In the Method Name combo box, select Click and implement the event as follows:
     
    Private Sub MenuClearProperties_Click(ByVal sender As Object, _
                                              ByVal e As System.EventArgs) _
                                              Handles MenuClearProperties.Click
            Dim Answer As MsgBoxResult
            Answer = MsgBox("Are you sure you want " & _
                                                  "to delete all properties?", _
                        MsgBoxStyle.YesNo Or MsgBoxStyle.Question, _
                "Remove all Properties")
    
            If Answer = MsgBoxResult.Yes Then
                lvwProperties.Items.Clear()
            End If
    End Sub
  9. In the Class Name combo box, select MenuNewProperty
  10. In the Method Name combo box, select Click and implement the event as follows:
     
    Private Sub MenuNewProperty_Click(ByVal sender As Object, _
                                          ByVal e As System.EventArgs) _
                                          Handles MenuNewProperty.Click
            MenuFileNewProperty_Click(sender, e)
    End Sub
  11. Execute the application and test it
  12. Right-click an empty line of the list view to see the contextual menu and click New Property
     
    Context Menu
     
  13. Right-click the list view and click Edit
     
    Using context-sensitive help
     
  14. Right-click a row on the form and click Delete
  15. Accept to delete the property
  16. Close the form and return to your programming environment
 

Previous Copyright 2008-2009, yevol.com Next