Basic Introduction to VB. NET Menu Design

The Menu Designer is usually attached to visual programming tools. You can use it to conveniently and quickly edit and design menus. This document describes how to use the Menu Designer to design menus and how to implement personalized menus.

The following describes in detail how to design menus in VB. NET and how to process menus.

I. Use the Menu Designer in Visual Basic. Net to design the menu:

The Menu Designer is provided in VB. NET. Through the Menu Designer, you can not only design the drop-down menu, but also design the pop-up menu. In VB. NET, menus are a part of the application. Therefore, when using the Menu Designer in VB. NET, you must first create a VB. NET project. The procedure is as follows:

1. Start Visual Studio. NET.

2. Select File, new, and project. The new project dialog box is displayed.

3. Set project type to Visual Basic Project ].

4. Set template to Windows application ].

5. Enter menu programming in the name text box ].

6. in the location text box, enter E:/.. Net project, and then click OK. the "Net project" directory generates a folder named "menu programming" and creates a project file named "menu programming.

7. Switch the current window of Visual Studio. NET to the form1.vb window, and drag the following components into the form1 form from the Windows Forms components tab in the toolbox:

A mainmenu component named "mainmenu1 ".

8. Select the "mainmenu1" component, right-click the component, and select "edit menu" from the pop-up menu ". See Figure 01.

Figure 01: Use the Menu Designer to design a drop-down menu

9. in "Enter here" as shown in Figure 01, enter "file (& F)" and "New (& n)" in the order from top to bottom) ","-"," open (& O) ", and the designed menu 02 is shown below:

Figure 02: Use the drop-down menu designed by the Menu Designer

In VB. NET, the "&" symbol is exactly the same as the "&" symbol in VB, and serves to set shortcut keys for menus. The "-" symbol is used to separate menu items.

10. This simple drop-down menu is complete. If you want to add other menus to your application, follow these steps. In Figure 02, enter the corresponding menu name in the "Enter here" area.

The following describes how to use the Menu Designer of Visual Basic. Net to design the pop-up menu.

1. In the preceding project, drag a contextmenu component to the form1 form from the Windows Forms component tab in the toolbox and name it contextmenu1.

2. Select the "contextmenu1" component, right-click the component, and select "edit menu" from the pop-up menu ". See Figure 03:

Figure 03: Use the Menu Designer to design the pop-up menu

3. in "Enter here" under "context menu" shown in Figure 03, enter "Copy (& C)" and "cut (& X)" in the order from top to bottom) "," paste (& V) ", the menu 04 after the design is as follows:

Figure 04: pop-up menu after Menu Designer Design

4. Select the attributes tab of form1 and set the attribute value of "contextmenu" of form1 to "contextmenu1 ".

5. Click the shortcut key "F5" to run the program, and right-click the program form. The pop-up menu of the above design is displayed, as shown in Figure 05:

Figure 05: Use the previously designed menu in the Application

6. other components generally have the "contextmenu" attribute. You only need to set the "contextmenu" attribute value of the component to the designed pop-up menu name. In this way, right-click the component, the corresponding pop-up menu is displayed.

　　Ii. mainmenu, menuitem, and contextmenu:

Although the Menu Designer can be used to design various menus, to really master menu programming in VB. NET, you must also understand and use the mainmenu class, menuitem class, And contextmenu class flexibly. Among them, the mainmenu class and the contextmenu class play a similar role. Their role is to provide a menu item container, which can store various menu items.

The mainmenu class indicates the structure of the drop-down menu. The menu items in the mainmenu class are actually menuitem instances. After creating the mainmenu instance, you must bind the instance to the form to display the menu. The drop-down menu can be displayed, but it is very easy to implement this binding, you only need to assign the mainmenu instance to the menu attribute of form.

The contextmenu class indicates the menu structure that appears when you right-click a widget or a specific area of the form. Visual controls and form forms generally have the contextmenu attribute. To display the contextmenu instance, you only need to assign the contextmenu instance to the visual component or the contextmenu attribute of the Form to display the pop-up menu. Multiple components can use a contextmenu instance together.
The menuitem class indicates every menu item in mainmenu and contextmenu. Displays the created menuitem instance. You must use the "add" method in mainmenu or contextmenu to add the menuitem instance. To create a sub-menu, you can use the "add" method of the parent menuitem instance to add the menuitem instance to its menuitems attribute.

The menuitem class also provides attributes to set the appearance and functions of a menu item. To display the selected Tag next to a menu item, you can use the checked attribute. The shortcut Cut attribute can be used to set the keyboard keys corresponding to a single item.

The following example shows how to use the above three classes.

　　3. Use the mainmenu class, menuitem class, And contextmenu class to dynamically create a menu:

The following uses the mainmenu, menuitem, and contextmenu classes to dynamically create menus designed by the Menu Designer as shown in Figure 05, including drop-down menus and pop-up menus. The procedure is as follows:

1. Start Visual Studio. NET.

2. Select File, new, and project. The new project dialog box is displayed.

3. Set project type to Visual Basic Project ].

4. Set template to Windows application ].

5. Enter the dynamic creation menu in the name text box ].

6. in the location text box, enter E:/.. Net project, and then click OK. in the "Net project" directory, a folder named "dynamic creation menu" is generated, and a project file named "dynamic creation menu" is created.

7. set Visual Studio. switch the current window of net to the form1.vb window, drag the following components into the form1 form from the Windows Forms components tab in the toolbox, and perform the corresponding operations:

The two buttons are named button1 and button2 respectively. After the two buttons are dragged into the form, set the "text" attribute values of these two components to "create drop-down menu" and "create pop-up menu" respectively ". Then double-click the component, so that Visual Basic. Net generates the processing code corresponding to the Click Event of the two components in form1.vb.

8. set Visual Basic. the current window of net switches to the code editing window of form1.vb and replaces the processing code corresponding to the click event of button1 in form1.vb with the drop-down code. The drop-down code is used to dynamically create the drop-down menu in Figure 05:

Private sub button#click (byval sender as system. Object, byval e as system. eventargs) handles button1.click Dim mainmenu1 as mainmenu = new mainmenu () 'Create a mainmenu instance Dim mymenuitem1 as menuitem = new menuitem () Dim mymenuitem2 as menuitem = new menuitem () Dim mymenuitem3 as menuitem = new menuitem () Dim mymenuitem4 as menuitem = new menuitem () Mymenuitem1.text = "file (& F )" Mymenuitem2.text = "New (& n )" Mymenuitem3.text = "-" Mymenuitem4.text = "open (& O )" 'Create four menuitem instances and set them accordingly. Mymenuitem1.menuitems. Add (mymenuitem2) Mymenuitem1.menuitems. Add (mymenuitem3) Mymenuitem1.menuitems. Add (mymenuitem4) 'Use mymenuitem1 as the parent menu item of mymenuitem2, mymenuitem3, and mymenuitem4 Mainmenu1.menuitems. Add (mymenuitem1) 'Add mainitem instance to mainmenu instance Me. Menu = mainmenu1 'Assign mainmenu1 to the menu attribute of form so that the drop-down menu can be displayed. Button1.enabled = false End sub

9. Replace the processing code corresponding to the click event of button2 in form1.vb with the following code. The drop-down code is used to dynamically create the pop-up menu in Figure 05:

Private sub button2_click (byval sender as system. Object, byval e as system. eventargs) handles button2.click Dim contextmenu1 as contextmenu = new contextmenu () 'Create a contextmenu instance Dim mymenuitem1 as menuitem = new menuitem () Dim mymenuitem2 as menuitem = new menuitem () Dim mymenuitem3 as menuitem = new menuitem () Mymenuitem1.text = "Copy (& C )" Mymenuitem2.text = "cut (& X )" Mymenuitem3.text = "paste (& V )" 'Create three menuitem instances and set them accordingly. Contextmenu1.menuitems. Add (mymenuitem1) Contextmenu1.menuitems. Add (mymenuitem2) Contextmenu1.menuitems. Add (mymenuitem3) 'Add menuitem to contextmenu1 Me. contextmenu = contextmenu1 'Assign contextmenu1 to form's contextmenu attribute. the pop-up menu is displayed. Button2.enabled = false End sub

10. now all the work of the [dynamic menu creation] project has been completed. Click the shortcut key "F5" to run the program, and click the [Create drop-down menu] button in the program, create a drop-down menu shown in Figure 04. Click Create pop-up menu in the program to dynamically create the pop-up menu shown in Figure 05.

If the menu item you want to create has a sub-menu item, you can add the Sub-menu item to the parent menu item according to the parent-child relationship in the menu item, then add the parent menu item to the top menu item or mainmenu and contextmenu instance. The following Code creates a drop-down menu shown in Figure 06. If a menu is displayed, the procedure is similar:

Dim mainmenu1 as mainmenu = new mainmenu () 'Create a mainmenu instance Dim mymenuitem1 as menuitem = new menuitem () Dim mymenuitem2 as menuitem = new menuitem () Dim mymenuitem3 as menuitem = new menuitem () Dim mymenuitem4 as menuitem = new menuitem () Dim mymenuitem5 as menuitem = new menuitem () Dim mymenuitem6 as menuitem = new menuitem () Mymenuitem1.text = "file (& F )" Mymenuitem2.text = "New (& n )" Mymenuitem3.text = "-" Mymenuitem4.text = "open (& O )" Mymenuitem5.text = "New Project" Mymenuitem6.text = "new file" 'Create four menuitem instances and set them accordingly. Mymenuitem2.menuitems. Add (mymenuitem5) Mymenuitem2.menuitems. Add (mymenuitem6) 'Mymenuitem2 is the parent menu item of mymenuitem5 and mymenuitem6. Mymenuitem1.menuitems. Add (mymenuitem2) Mymenuitem1.menuitems. Add (mymenuitem3) Mymenuitem1.menuitems. Add (mymenuitem4) 'Use mymenuitem1 as the parent menu item of mymenuitem2, mymenuitem3, and mymenuitem4 Mainmenu1.menuitems. Add (mymenuitem1) 'Add mainitem instance to mainmenu instance Me. Menu = mainmenu1 'Assign mainmenu1 to the menu attribute of form so that the drop-down menu can be displayed.

Figure 06: dynamically create a drop-down menu with sub-menus

　　4.. Net Frame Work SDK provides tools for drawing menus in VB. NET:

The. NET Frame Work SDK provides many tools for Visual Basic. Net to implement personalized menus. Two events and their parameters are most important: the drawitem event and the drawitemeventargs parameter, the measureitem event, and the measureitemeventargs parameter.

1. The drawitem event and the drawitemeventargs parameter are as follows:

The drawitem event occurs only when the ownerdraw attribute of the menu item is set to true and a request is sent to draw the menu item. The personalized menu creation method is completed in this event. The drawitem event handler receives a drawitemeventargs-type parameter that contains data related to this event, which is important for drawing menus. Table 01 is a drawitemeventargs type parameter that provides information specific to this event.

Attribute	Description
Backcolor	Obtains the background color of the drawn item.
Bounds	Obtains the rectangle representing the boundary of the drawn item.
Font	Gets the font assigned to the drawn item.
Forecolor	Obtain the foreground color of the drawn item.
Graphics	Obtain the graphic surface on which you want to draw items.
Index	Obtain the index value of the drawn item.
State	Obtain the status of the drawn item.

Table 01: drawitemeventargs type parameters provide information specific to the drawitem event

2. The measureitem event and the measureitemeventargs parameter are as follows:

To trigger a measureitem event, you must set the ownerdraw attribute of the menu item to true. You can use this event to obtain and set the size of the menu item. The measureitem event handler receives a measureitemeventargs parameter, which is very important for obtaining and setting the size of menu items. Table 02 provides specific information for the measureitem event as a parameter of the measureitemeventargs type.

Attribute	Description
Graphics	Obtain the graphics object to be measured.
Index	Obtain and set the index that requires a height and width.
Itemheight	Obtain and set the height of an item specified by index.
Itemwidth	Get and set the items specified by index

Table 02 is a measureitemeventargs type parameter that provides specific information for the measureitem event.

　　5. Customize the menu:

First, perform the following steps. The following steps are used to design a simple menu in the menu editor to redraw the background:

1. Start Visual Studio. NET.

2. Select File, new, and project. The new project dialog box is displayed.

3. Set project type to Visual Basic Project ].

4. Set template to Windows application ].

5. In the "name" text box, enter "customize menu ].

6. in the location text box, enter E:/.. Net project, and then click OK. the "Net project" directory generates a folder named "Draw menus by yourself" and creates a project file named "Draw menus by yourself.

7. Switch the current window of Visual Studio. NET to the form1.vb window, and drag the following components into the form1 form from the Windows Forms components tab in the toolbox:

A mainmenu component named "mainmenu1 ".

8. Select the "mainmenu1" component, right-click the component, and select "edit menu" from the pop-up menu ". Design the menu as shown in Figure 01:

Figure 07: [drawing menus by yourself] One of the project design interfaces

9. Save the preceding steps and click F5. The page shown in Figure 08 is displayed:

Figure 08: [drawing menus by yourself] One of the running Interfaces

In this way, a very common menu is completed through the menu editor, and the menu is transformed below. Before the transformation, set the ownerdraw attribute value of the three menuitem class instances in the project to "true ". This is because only when the property value is "true" Will the drawitem event and measureitem event required to draw the menu. Then, perform the following operations on the basis of the above project:

Set visual stuido. switch the current window of net to the code editing window of form1.vb, and add the following code after the initializecomponent process. The following code is used to draw the "file" menu item, the function is to change the font, size, and menu item of the "file" menu item. For details about how to draw the menu item, see the notes in the following code:

Private sub menuitemincludrawitem (byval sender as object, byval e as system. Windows. Forms. drawitemeventargs) handles menuitem1.drawitem Dim rfbound as rectanglef = new rectanglef (E. bounds. X, E. bounds. Y, E. bounds. Width-1, E. bounds. Height) 'Obtain the rectangular area of the menu item based on the drawitemeventargs parameter and store it in the rectanglef type instance. Dim rfbound1 as rectangle = new rectangle (E. bounds. X, E. bounds. Y, E. bounds. Width-1, E. bounds. Height) 'Obtain the rectangular area of the menu item based on the drawitemeventargs parameter and store it in a rectangle instance. 'Rectangle type instances and rectanglef type instances are similar, but the function for drawing menus in the code below is different. E. Graphics. fillrectangle (New solidbrush (color. lightgreen), rfbound) 'Fill In the rectangular area corresponding to the menuitem1 menu item in lightgreen' color Dim s as menuitem = ctype (sender, menuitem) Dim S1 as string = S. Text 'Obtain The Name Of The menuitem1 menu item Dim sftemp as stringformat = new stringformat () Sftemp. Alignment = stringalignment. Center 'Set the alignment of the name of the menu to be drawn, with the center alignment E. Graphics. drawstring (S1, new font (" ICS", 10, fontstyle. Bold), new solidbrush (color. Black), rfbound, sftemp) 'Specifies the font and size in the middle alignment mode, and redraws the menu in the specified rectangle area. If E. State = (drawitemstate. noaccelerator or drawitemstate. Selected) then 'Draw a menu item based on the current drawing status of the menu item E. Graphics. fillrectangle (New solidbrush (color. lightyellow), rfbound) 'Fill in the color of the rectangle where the menu item is located E. Graphics. drawstring (S1, new font (" ICS", 10, fontstyle. Bold), new solidbrush (color. Black), rfbound, sftemp) 'Draw the menu item name End if E. drawfocusrectangle () 'Use the drawitemeventargs parameter to obtain the drawing focus box within the rectangle range. E. Graphics. drawrectangle (new pen (New solidbrush (color. Black), 1), rfbound1) 'Draw a rectangular box for the rectangular area of the menu item End sub

After the operation is complete, save the changes. Click the shortcut key F5 to run the program. The page shown in 09 is displayed:

Figure 09: [drawing menus by yourself] interface 2

The "file" menu item is not completely displayed, and the subsequent menu item is not displayed. This is because the display area of the menu item is not set, and the default space cannot be fully displayed. The measureitem event is used to set the display area of a menu item. The specific operation is to add the following code after the drawitem event of menuitem1. The following code defines the measureitem event of menuitem1. In this event, set the width of the menu item (of course, you can also set the height ):

Private sub menuitemdetail measureitem (byval sender as object, byval e as system. Windows. Forms. measureitemeventargs) handles menuitem1.measureitem E. itemwidth = 60 'Set the menu item width End sub

After saving the preceding changes, click the shortcut key F5 to run the program. The page shown in Figure 10 is displayed:

Figure 10: "draw a menu by yourself" Page 3

It can be seen that even if the "file" menu item is drawn, it is not displayed because other menu items are not drawn. The draw methods for other menu items are similar to those for the "file" menu items. The following describes how to draw other menu items based on the preceding steps, the specific implementation steps of the menu shown in Figure 11 are as follows:

Figure 11: menu by yourself: page 4

1. Add the following code after the measureitem event handler of menuitem1 in form1.vb. The following code defines the drawitem event of menuitem2. Its function is to re-draw the "new" menu item:

Private sub menuitem2_drawitem (byval sender as object, byval e as system. Windows. Forms. drawitemeventargs) handles menuitem2.drawitem Dim rfbound as rectanglef = new rectanglef (E. bounds. X, E. bounds. Y, E. bounds. Width-1, E. bounds. Height) 'Obtain the rectangular area of the menu item based on the drawitemeventargs parameter and store it in the rectanglef type instance. Dim rfbound1 as rectangle = new rectangle (E. bounds. X, E. bounds. Y, E. bounds. Width-1, E. bounds. Height) 'Obtain the rectangular area of the menu item based on the drawitemeventargs parameter and store it in a rectangle instance. 'Rectangle type instances and rectanglef type instances are similar, but the function for drawing menus in the code below is different. E. Graphics. fillrectangle (New solidbrush (color. lightgray), rfbound) Dim s as menuitem = ctype (sender, menuitem) Dim S1 as string = S. Text 'Get the text name corresponding to the menu item Dim sftemp as stringformat = new stringformat () Sftemp. Alignment = stringalignment. Center 'Sets the alignment of text in the rectangle. Sftemp. linealignment = stringalignment. Center Dim rctext as rectanglef = rfbound Rctext. Width-= 5 E. Graphics. drawstring (S1, new font ("", 10), new solidbrush (color. Blue), rctext, sftemp) E. Graphics. drawrectangle (new pen (New solidbrush (color. lightgray), rfbound1) If E. State = (drawitemstate. noaccelerator or drawitemstate. Selected) then E. Graphics. fillrectangle (New solidbrush (color. lightyellow), rfbound) E. Graphics. drawstring (S1, new font (" ICS", 10, fontstyle. Bold or fontstyle. Underline), new solidbrush (color. Red), rctext, sftemp) E. Graphics. drawrectangle (new pen (New solidbrush (color. Black), rfbound1) E. drawfocusrectangle () End if End sub

2. Add the following code after the drawitem event processing code of menuitem2. The following code defines the measureitem event of menuitem2. In this event, set the length and height of the "new" menu item:

Private sub menuitem2_measureitem (byval sender as object, byval e as system. Windows. Forms. measureitemeventargs) handles menuitem2.measureitem E. itemwidth = 60 'Set the menu item width E. itemheight = 30 'Set the height of the menu item End sub

3. after completing the preceding steps, add the following code after the measureitem event handler of menuitem2. The following code defines the drawitem event of menuitem3, its function is to re-draw the "open" menu item:

Private sub menuitem3_drawitem (byval sender as object, byval e as system. Windows. Forms. drawitemeventargs) handles menuitem3.drawitem Dim rfbound as rectanglef = new rectanglef (E. bounds. X, E. bounds. Y, E. bounds. Width-1, E. bounds. Height) 'Obtain the rectangular area of the menu item based on the drawitemeventargs parameter and store it in the rectanglef type instance. Dim rfbound1 as rectangle = new rectangle (E. bounds. X, E. bounds. Y, E. bounds. Width-1, E. bounds. Height) 'Obtain the rectangular area of the menu item based on the drawitemeventargs parameter and store it in a rectangle instance. 'Rectangle type instances and rectanglef type instances are similar, but the function for drawing menus in the code below is different. Dim s as menuitem = ctype (sender, menuitem) Dim S1 as string = S. Text Dim sftemp as stringformat = new stringformat () Sftemp. Alignment = stringalignment. Center Sftemp. linealignment = stringalignment. Center Dim rctext as rectanglef = rfbound Rctext. Width-= 5 E. Graphics. drawstring (S1, new font ("veranda", 10), new solidbrush (color. Blue), rctext, sftemp) E. Graphics. drawrectangle (new pen (New solidbrush (color. lightgray), rfbound1) If E. State = (drawitemstate. noaccelerator or drawitemstate. Selected) then E. Graphics. fillrectangle (New solidbrush (color. lightyellow), rfbound) E. Graphics. drawstring (S1, new font ("veranda", 10, fontstyle. Bold or fontstyle. Underline), new solidbrush (color. Red), rctext, sftemp) E. Graphics. drawrectangle (new pen (New solidbrush (color. Black), rfbound1) E. drawfocusrectangle () End if End sub

4. Add the following code after the drawitem event processing code of menuitem3. The following code defines the measureitem event of menuitem3. In this event, set the length and height of the "new" menu item:

Private sub menuitem3_measureitem (byval sender as object, byval e as system. Windows. Forms. measureitemeventargs) handles menuitem3.measureitem E. itemwidth = 60 'Set the menu item width E. itemheight = 30 'Set the height of the menu item End sub

After the preceding steps are completed correctly, the manual menu described in this article is finished. Click F5 to run. The running interface shown in Figure 11 is displayed.

　　6. Summary:

This article mainly introduces VB.. Net to design and create menus. This section not only describes how to use the Menu Designer to design menus statically, but also describes how to use the mainmenu class, menuitem class, And contextmenu class to dynamically create menus. When creating a dynamic menu, you must first understand the menu type to be created. It is a drop-down menu. First, you must create a mainmenu instance. If it is a pop-up menu, you must first create a contextmenu instance. Then, based on the structure in the menu, that is, the parent-child relationship in the menu item, the corresponding menu is created, and the menu is displayed. If the menu is a drop-down menu, the menu attribute assigned to form is displayed, if a menu is displayed, it is assigned to the contextmenu attribute of the visual component or form so that the menu can be dynamically created and displayed.

In addition. net, the most important thing to do is to understand the usage of the drawitem event and the measureitem event, and the method used to draw the menu, although the menus drawn in this article are not beautiful, you can use the methods described in this article to modify the menus to make them more beautiful and more personalized. Finally, remember to set the "ownerdraw" attribute of the menu item to "true" when drawing the menu ".