Modern Windows applications come complete with extensive toolbars that serve as quick access to various menu choices. In the early days of Windows, these toolbars were nothing but buttons, but today they may include drop downs, combo boxes, and other advanced controls.

Visual Studio .NET makes creating toolbars for your application very easy. The steps are as follows:

  1. Create an image list.
  2. Create a toolbar and associate the image list with the toolbar.
  3. Set up event handlers for the buttons on the toolbar.
  4. Optionally, add additional controls programmatically.

To keep the example simple, start with the OwnerDraw menu you completed earlier and add a simple toolbar.

18.3.1 Creating the ImageList

Begin by dragging an ImageList onto the form. Notice that one of the properties, Images, is marked as a collection. Click on the ellipsis (...) to open the image list. This opens the Image Collection Editor. Click the Add button.

This step opens a dialog for identifying the image you want to add from images you may have stored on disk. Navigate to Program FilesMicrosoft Visual Studio .NET 2003Common7GraphicsBitmaps. In this directory, there are two directories with useful icons: OffCtlBr and Assorted. For this example, navigate into OffCtlBr, into Large, and then Color.

Choose the New.bmp file, which adds the bitmap to your collection. Notice that the righthand side of the dialog, with the bitmap properties, is read-only. Add a few more bitmaps, as shown in Figure 18-16.

Figure 18-17. Image collection editor

figs/pnwa_1817.gif Adding the toolbar

You now have a collection of bitmaps, and you are ready to create your toolbar. Drag a Toolbar control onto the form. It docks under your menu, although you will be free to change that later.

Navigate to the ImageList property of the new toolbar and set the property to the ImageList you've just created.

Click on the Buttons property of the Toolbar to open the ToolBarButton Collection Editor. Click on the Add button to add a button. In the Properties window of the ToolBarButton Collection Editor, set the Button name to btnNew, and set the ImageIndex to the index for the New file icon (index 0). Set the Text to New and set the ToolTip text to "Create new File." Finally, set the Tag property to New as well.

The Tag property does not affect the display of the menu, but it helps identify which button was pressed, as all buttons on a toolbar share a common event handler.

Your ToolBarButton Collection Editor should look like Figure 18-17.

Figure 18-18. Adding buttons to the toolbar


Go ahead and add an Open button and a Save button. You do not have to use all the images in your image list; which one you use is up to you. Adding event handlers

If you double-click on one of the buttons, Visual Studio .NET will create an event handler for the toolbar. Notice that the event handler is not per button. You'll have to figure out which button was pressed, but this task is simplified when the ToolBarButtonClickEventArgs parameter is passed in to the event handler.


private void toolBar1_ButtonClick(
 object sender, 
 System.Windows.Forms.ToolBarButtonClickEventArgs e)
 switch ( e.Button.Tag.ToString( ) )
 case "New":
 mnuNew.PerformClick( );
 case "Open":
 mnuFileOpen.PerformClick( );
 case "Save":
 mnuFileSave.PerformClick( );


Private Sub ToolBar1_ButtonClick( _
 ByVal sender As System.Object, _
 ByVal e As System.Windows.Forms.ToolBarButtonClickEventArgs) _
 Handles ToolBar1.ButtonClick
 Dim tag As String = e.Button.Tag
 Select Case tag
 Case "New"
 mnuNew.PerformClick( )
 Case "Open"
 mnuFileOpen.PerformClick( )
 Case "Save:"
 mnuFileSave.PerformClick( )
 End Select
End Sub

Clicking on the New button now opens an MDI window, and clicking on Open or Save evokes the same event handler as the menu choices, as shown in Figure 18-18.

Figure 18-19. Implementing toolbar events

figs/pnwa_1819.gif Tool tips

Notice that one of the properties you set on your toolbar was the ToolTipText property. If the user hovers over one of your buttons, the tool tip will appear to provide additional information about the button, as shown in Figure 18-19.

Figure 18-20. Using tool tips

figs/pnwa_1820.gif Altering the appearance

Several toolbar properties can help you tailor the appearance of your buttons. For example, you can change the TextAlign property from Underneath to Right, and put the text next to the icon to make wider, but shorter buttons, as shown in Figure 18-20.

Figure 18-21. Setting the TextAlign property


Another example is the Appearance property, which can be set to either Flat or Normal. If you change the appearance to Flat, the buttons look flat except when you hold the cursor over the button, as shown in Figure 18-21. You have to look closely and compare the New button (for example) in Figure 18-21 with the New button shown in Figure 18-19.

Figure 18-22. Appearance set to flat


Dozens of properties can set the appearance of the Toolbar. Some of the most important and common properties are listed in Table 18-8.

Table 18-8. Toolbar properties






Read/Write. Valid values are members of the ToolBarAppearance enumeration, which has two values: Flat and Normal. The default value is ToolBarAppearance.Normal. If the appearance is set to ToolBarAppearance.Flat, the buttons are flat until the mouse is held over them.



Read/write. Will the Toolbar adjust its size automatically? The default is true.



Read/write. Specifies the style of border around the toolbar. Valid values are members of the BorderStyle enumeration, which has three values: Fixed3D, FixedSingle, and None. The default value is BorderStyle.None.



Read-only. The collection of ToolBarButton objects contained by the Toolbar.



Read/write. The size of the buttons on the toolbar (typically 16 x 16).



Read/write. If true (the default), a raised edge is displayed along the top of the Toolbar to separate it from the menus.



Read/write. If true, drop-down Toolbar buttons display down arrows. The default value is false.



Read/write. The image list containing the images to be displayed by the buttons on the Toolbar.



Read/write. If true, tool tips are displayed for each button. The default value is false.



Read/write. Specifies the alignment of the text associated with a Toolbar button. Valid values are members of the ToolBarTextAlign enumeration: Right and Underneath. The default is ToolBarTextAlign.Underneath.



Read/write. If true (the default), the Toolbar buttons wrap to the next line if there is insufficient space for all the buttons on a single line. Adding a combo box to the Toolbar

You can do much more with toolbars. For example, while the IDE will not help you add more complex controls, you are free to add them programmatically.

To add a combo box to the Toolbar, add code to the constructor of the form that creates a combo box, initializes its members, and then adds it to the Toolbar:


public Form1( )
 InitializeComponent( );
 ComboBox cb = new ComboBox( );
 cb.Left = 150;
 cb.Top = 5;


Public Sub New( )
 MyBase.New( )
 InitializeComponent( )
 Dim cb As New ComboBox( )
 cb.Left = 150
 cb.Top = 5
End Sub

The Combo box is added to the Toolbar, as shown in Figure 18-22.

Figure 18-23. Adding a combo box to the Toolbar


You can find this entire example in the downloadable source files ToolBarsCS and ToolBarsVB, respectively.

Windows Forms and the .NET Framework

Getting Started

Visual Studio .NET


Windows Forms

Dialog Boxes

Controls: The Base Class

Mouse Interaction

Text and Fonts

Drawing and GDI+

Labels and Buttons

Text Controls

Other Basic Controls

TreeView and ListView

List Controls

Date and Time Controls

Custom Controls

Menus and Bars


Updating ADO.NET

Exceptions and Debugging

Configuration and Deployment

Programming. NET Windows Applications
Programming .Net Windows Applications
ISBN: 0596003218
EAN: 2147483647
Year: 2003
Pages: 148 © 2008-2020.
If you may any questions please contact us: