Toolbars The ToolBar control is used on forms to display a row of buttons that invoke commands (similar to clicking a menu item). VB.NET toolbars generally use an ImageList control to maintain the images displayed by the toolbar. Each button on the toolbar is associated with an image from the image list. The ToolBar class has a Buttons collection that represents the buttons on the toolbar. Properties such as Appearance , Autosize , and Wrapable control the appearance of the toolbar. The ToolBarButton class has properties that configure the individual buttons on the toolbar. This class has many interesting properties, including: -
ImageIndex indicates the image number from the ImageList control of the image associated with this button. -
Text indicates the text that may optionally be displayed on a button. -
ToolTipText indicates the tool tip text displayed for the button.  | In the following two sections, we will examine the simple Calculator program and see how toolbars and status bars may be added to the program. Calculator allows the user to enter two numbers and select toolbar buttons to indicate add, subtract, multiply or divide. The result is displayed in a label. A status bar shows the type of the last operation as well as the current time. A main menu has options for File Exit and Help About. Figure 8-6 illustrates the completed program's appearance. | Figure 8-6. The Calculator program.  Step 1: Setting up the ImageList Control To manage the images on the toolbar, we added an ImageList control to the form and named it imgList . Its Images collection is used to manage the images in the list. To assign manage the Images collection, you must click on the Images property in the Properties window. The Image Collection Editor is displayed. You can press the Add button to load various images. As you can see in Figure 8-7, we loaded mathematical icons into the list from the ..\Microsoft Visual Studio.NET\Common7\Graphics\Icons\Misc directory. The toolbar that we want to design will use icons for add, subtract, multiply, and divide (MISC18.ICO through MISC21.ICO). These were loaded into the ImageList in positions 0, 1, 2, and 3, respectively. Figure 8-7. Using the Image Collection Editor.  Step 2: Configuring the Toolbar Control To configure the toolbar control for our calculator, we must set its ImageList property to imgList . We then add buttons to the toolbar by selecting the toolbar's Buttons property from the Properties window. The ToolBarButton Collection Editor shown in Figure 8-8 can be used to add our four buttons. Figure 8-8. The ToolBarButton Collection Editor.  Table 8-2 summarizes the properties we set for our four buttons. Table 8-2. Property Values for the Calculator Toolbar Buttons | Button | Name | Other Properties | | | tbAdd | ImageIndex: 0 Tag: Add ToolTipText: Add | | 1 | tbSubtract | ImageIndex:1 Tag: Subtract ToolTipText: Subtract | | 2 | tbMultiply | ImageIndex: 2 Tag: Multiply ToolTipText: Multiply | | 3 | tbDivide | ImageIndex: 3 Tag: Divide ToolTipText: Divide | The ToolTipText property displays tool tips when the user hovers the mouse over the toolbar button. The Tag property, which is a property available in all .NET controls, is unused by .NET. This makes it a convenient placeholder for application data. In our case, we are using it to "tag," or identify, our toolbar button. It will be referenced in the handler that responds to a click on a toolbar button. A toolbar button also has a Text property. When it its set, the text appears below the icon on the toolbar button. Step 3: Responding to Toolbar Events The ToolBar control generates a ButtonClick event any time any of the buttons on the toolbar is selected. The handler for this event is passed a ToolBarButtonClickEventArgs parameter that has a property that references the button was selected. The button is identified through its ImageIndex, Text or Tag property. In the previous step, we placed a descriptive string of the button's purpose in the Tag property of each button. Therefore, we will code the toolbar's ButtonClick event as follows : Private Sub toolBar_ButtonClick(ByVal sender As _ System.Object, ByVal e As _ System.Windows.Forms.ToolBarButtonClickEventArgs) _ Handles toolBar.ButtonClick Dim n1 As Double = Val(txtNum1.Text) Dim n2 As Double = Val(txtNum2.Text) ' This call is described in the next section SetGUIChecks(toolBar.Buttons(e.Button.ImageIndex)) Select Case e.Button.Tag Case "Add" lblResult.Text = n1 + n2 Case "Subtract" lblResult.Text = n1 - n2 Case "Multiply" lblResult.Text = n1 * n2 Case "Divide" lblResult.Text = n1 / n2 End Select End Sub We used the function Val instead of CDbl or Convert.ToDouble in this handler to convert data from the text boxes because Val returns zero if the string is blank. Step 4: Controlling Toolbar Button Appearance The ToolBarButton class has several properties that control the appearance of individual buttons, including: -
Enabled indicates whether the button is enabled. -
Pushed indicates whether the button is pushed. -
Visible indicates whether the button is visible. In our calculator, we will implement behavior that will give the last toolbar button that was clicked a "pushed" look. (Note: Typically, buttons stay pushed only when they indicate that an application's data is in a particular state . We will push the last button used so that we can tell which operation was used to calculate the answer displayed.) The toolbar's Click event, discussed in Step 3, calls SetGUIChecks and passes it the ToolBarButton that was clicked. This procedure sets the appearance of our toolbar buttons and is coded as shown below: Private Sub SetGUIChecks(ByVal btn As ToolBarButton) ' Unselect all buttons Dim i As Integer For i = 0 To 3 toolBar.Buttons(i).Pushed = False Next ' Update toolbar appearance btn.Pushed = True End Sub At this point, the Calculator program should be functional. We will now add a status bar to display additional information to the user.  | 
