Kathleen's Weblog

VSTO: My Favorite Feature - Ribbon Designer

One of my favorite features in the latest version of VSTO is the Ribbon Designer.  The Ribbon Designer makes it easy to customize the Ribbon in your Office applications.  In VSTO 2005 SE, you could add a Ribbon Item to your project and then add XML markup, along with code in callbacks to customize the Ribbon. In VSTO "Orcas" there is a designer that lets you customize the Ribbon in the same way you'd customize a Windows Form or a Task Pane -- you simply drag and drop controls from the toolbox onto the designer. You can then set properties of the controls, and write code in the event handler of the control.

Ribbon Designer in VSTO Beta 1

If you're using Visual Studio Code Name "Orcas" Beta 1, you can create an add-in (or document for Word/Excel) project, and then add a Ribbon (Visual Designer) item to your project.

When you add this item, a Ribbon designer will open, and you'll find that there are three controls available that you can drag from the Toolbox to the designer: a Button, Group and Tab. 

You can use existing Ribbon control images, by setting the ImageMSO property to the ID of the image. One way to get this ID is to look at the Customize tab of the Word Options dialog box, and hold your cursor over the button.  Another way is to download the entire list.

The name in parenthesis in the popup is the ID you need to enter.  You cannot re-use the functionality of the existing button using the designer, but you can either write code to recreate the functionality, or export the Ribbon customization to Ribbon XML and reuse the existing functionality. Note, however, that this export is one-way; you won't be able to import the Ribbon XML back into the designer, and you'll have to create callbacks rather than use the event handlers that the Ribbon designer provides.

If you want to use a custom image, you can import it to the project's resources and then select that image in the Image property.  The images don't appear in the designer, but will display after you run the project. To create the Click event handler for the button, you can double click the button and start writing code!

Let's take a look at this in a video . . .

View Video                                                                                    Download Video
                                                                                                      (Right-click link)

Ribbon Designer in upcoming VSTO CTP

In the upcoming CTP of VSTO, you'll find many more controls available in the toolbox, including the Button, CheckBox, ComboBox, Gallery, Label, Menu and more!  Be sure to check it out.

To see a list of other VSTO bloggers' favorite features, see the VSTO Developer Center.

--Kathleen