Walkthrough: Adding a Toolbar to the IDE

This walkthrough shows how to add a toolbar to the Visual Studio integrated development environment (IDE).

A toolbar is a horizontal or vertical strip that contains buttons that are bound to commands. Depending on its implementation, a toolbar in the IDE can be repositioned, docked on any side of the main IDE window, or made to stay in front of other windows.

In addition, users can add commands to a toolbar or remove them from it by using the Customize dialog box. Typically, toolbars in VSPackages are user-customizable. The IDE handles all customization, and the VSPackage responds to commands. The VSPackage does not have to know where a command is physically located.

For more information about menus, see Commands, Menus, and Toolbars.

Prerequisites

To follow this walkthrough, you must install the Visual Studio 2013 SDK. For more information, see Visual Studio Software Development Kit (SDK).

Locations for the Visual Studio Package Project Template

The Visual Studio Package project template is available in three locations in the New Project dialog box:

  • Under Visual Basic Extensibility. The default language of the project is Visual Basic.

  • Under C# Extensibility. The default language of the project is C#.

  • Under Other Project Types Extensibility. The default language of the project is C++.

Creating a VSPackage for a Toolbar

This section demonstrates how to use the Visual Studio Package project template to create a VSPackage that supports a toolbar that has just one menu command.

To create the toolbar VSPackage

  1. Create a VSPackage named IDEToolbar. For more information, see Walkthrough: Creating a Menu Command By Using the Visual Studio Package Template.

  2. In the Visual Studio Package template, set the programming language to Visual Basic or Visual C#, select Menu Command, set the command name to ToolbarTest Command, and set the command ID to cmdidTestCmd.

Creating a Toolbar for the IDE

To create a toolbar for the IDE

  1. Open IDEToolbar.vsct in the text editor.

  2. In the Symbols section, in the GuidSymbol element named "guidIDEToolbarCmdSet", add declarations for a toolbar and a toolbar group, as follows.

    <IDSymbol name="Toolbar" value="0x1000" />
    <IDSymbol name="ToolbarGroup" value="0x1050" />
    
  3. At the top of the Commands section, create a Menus section.

    <Menus></Menus>
    

    The toolbar definition is located here because the VSCT parser does not distinguish between menus and toolbars at this level.

  4. Add a Menu element to the Menus section to define your toolbar.

    <Menu guid="guidIDEToolbarCmdSet" id="Toolbar"
          type="Toolbar" >
      <CommandFlag>DefaultDocked</CommandFlag>
      <Strings>
        <ButtonText>Test Toolbar</ButtonText>
        <CommandName>Test Toolbar</CommandName>
      </Strings>
    </Menu>
    

    Toolbars cannot be nested like submenus. Therefore, you do not have to assign a parent group. Also, you do not have to set a priority, because the user can move toolbars. Typically, initial placement of a toolbar is defined programmatically, but subsequent changes by the user are persisted.

  5. In the Groups section, after the existing group entry, define a Group element to contain the commands for the toolbar.

    <Group guid="guidIDEToolbarCmdSet" id="ToolbarGroup"
          priority="0x0000">
      <Parent guid="guidIDEToolbarCmdSet" id="Toolbar"/>
    </Group>
    
  6. In the Buttons section, change the parent of the existing Button element to the toolbar group so that the toolbar will be displayed.

    <Parent guid="guidIDEToolbarCmdSet" id="ToolbarGroup" />
    

    By default, if a toolbar has no commands, it does not appear.

  7. On the Build menu, click Build Solution. Correct any errors that might occur.

  8. Press F5 to open the experimental Visual Studio in debug mode.

  9. Right-click the IDE menu bar, and then click Test Toolbar on the list of toolbars.

  10. When you click the icon on the new toolbar, the message "Inside Company.Toolbar.ToolbarPackage.MenuItemCallback()" should be displayed.

See Also

Other Resources

Walkthroughs for User Interface Elements

Commands, Menus, and Toolbars