Sharing Custom Tabs in The Ribbon UI

To let add-ins (native, unmanaged/managed COM add-ins and VSTO add-ins) share tabs is a good strategy but it can be applied in two different ways. Which to apply is depended on the individual add-ins.

Sharing the Add-ins Tab
For small application it is not necessary to use tabs on their own. Instead we can share the Add-in tab with other add-ins as the first screen shot shows:

 In this case we use the following customized Ribbon XML:

It should be noted that it is not required that any classic CommandBar add-in is activated to access the built-in tab Add-ins. 

Sharing Custom Tabs
For large-scale applications it may be an advantage to split the applications in smaller parts and let the parts share a custom tab. To get there it requires that we:

1. Use a unique identical namespace and 
2. Use a unique identical idQ attribute in the add-ins’ customized Ribbon XML.

A result of this is showed in the following screen shot:

To produce this output we use the following customized Ribbon XML in the add-ins.

The first add-in’s customized Ribbon XML:

 

The second add-in’s customized Ribbon XML:

As we can see they share the same namespace and call the same idQ attribute which makes it possible to let add-ins share a custom tab.

The customized Ribbon XML for sharing the custom tab is available here.

Kind regards,
Dennis

Using Custom Images in Ribbon UI Solutions

Although the number of built-in images in Excel is large we still may want to use custom images. Because it exist a great number of inexpensive commercial images packages it is not justified to spend our time to create customized images.

So the question is which image format to use? The Ribbon drawing engine is designed to work best with full-color (24-bit) images that also have an alpha channel to control each pixel’s transparency. Since the PNG file format supports an alpha channel and produces relatively small files, it is the best alternative. The preferred sizes of custom images are either 16×16 (small size) or 32×32 (large size).

The first step is to add the selected images to a project’s resources and then create the code to use them. Adding images to the resources is not an issue and the first figure shows the added images for the case.

 

The next screen shot shows the content of the Ribbon.xml file which is also added to the resources of the project:

The following screen shot shows the class Ribbon.vb:

The key to the solution is the function GetImage which uses the System.Drawing namespace to return Bitmap objects.

The next screen shot shows ThisAddin class of the VSTO Add-in I use for the case:

 

When running the above code the customized Ribbon UI solutions looks like the following:

Looking on the solution it reveals nothing extraordinary in order to use custom images in Ribbon UI solutions.  

Kind regards,
Dennis

(If we only have access to images in the GIF or BMP or JPEG file format then we can apply the same approach as with the PNG images.)