How can I add the images to button using the ribbon xml?

Question

How to add the custom images to the ribbon button in the tab and the context menu.

I tried the link Adding Image to ribbon button but no luck :-(. I am designing the addin for Excel. I added this in the header.

    <customUI xmlns="http://schemas.microsoft.com/office/2009/07/customui"  onLoad="Ribbon_Load"   loadImage="Ribbon_LoadImage"> 
    <button id="btn2d" keytip="L" screentip="2D Visualization" supertip="2D Part Visualization" label="2D" size="large"/>
    <contextMenu idMso="ContextMenuCell">
    <button id="btn1" label="my label"/>
    </customUI>

the code snippet

public Bitmap Ribbon_LoadImage(IRibbonControl control)
    {
        switch (control.Id)
        {
            case "btn2": return new Bitmap(Properties.Resources.btn1);
            case "btn3": return new Bitmap(Properties.Resources.btn2);
            case "btn4": return new Bitmap(Properties.Resources.btn3);
            case "btn5": return new Bitmap(Properties.Resources.Filter);
            case "btnOpt6": return new Bitmap(Properties.Resources.Settings);
            case "btnInform7": return new Bitmap(Properties.Resources.Vis);
            case "btnHelpPage": return new Bitmap(Properties.Resources.Help);
        }
        return null;
    }

Please help me in this. I am using .net 4.0 c# VSTO excel addin for Office 2010.

Answer 1

You have to use getImage property for each button and the callback should return bitmap.

In Ribbon.xml

<button id="btnLogo" getImage="imageSuper_GetImage" size="large" />

Ribbon.cs

public Bitmap imageSuper_GetImage(IRibbonControl control)
        {
            return Resources.super_logo;
        }

Answer 2

This is an old post, but I figured I'd add my answer in case anybody is still looking for an example (like I was)...

In Ribbon.xml, loadImage="GetImage" references the callback in Ribbon.cs that will get the image from the resources. In my example below, I am using image="Report_256x" to trigger the callback.

<?xml version="1.0" encoding="UTF-8"?>
<customUI onLoad="Ribbon_Load" xmlns="http://schemas.microsoft.com/office/2009/07/customui" loadImage="GetImage">
    <ribbon>
        <tabs>
            <tab idMso="TabMail">
                <group id="group1" label="Priority Tracker">
                    <button id="btnWIPReport" onAction="btnWIPReport_Click" label="WIP Report" size="large" image="Report_256x"/>
                </group>
            </tab>
        </tabs>
    </ribbon>
</customUI>

The callback that I use in my example looks like this...

public System.Drawing.Image GetImage(string ImageName)
{
    return (System.Drawing.Image)Properties.Resources.ResourceManager.GetObject(ImageName);
}

Answer 3

You Can have the images from LoadImage Function.

You need to write as below:

<customUI xmlns="http://schemas.microsoft.com/office/2006/01/customui" 
  loadImage="GetImage">

public stdole.IPictureDisp GetImage(string imageName){
  return
    PictureConverter.IconToPictureDisp(Properties.Resources.MyIcon);
}