0

I've recently built an PowerPoint VBA add-in and made a custom ribbon with XML. I want to use custom made icons.

I know how to insert a custom icon in the XML. But for the life of me I cant figure out which dimensions custom icons I need (16x16, 32x32, 64x64 or a mix). The issue is that icons look blurry across screen resolutions (see picture attached).

  • 16x16 looks fine on low resolution screen, looks blurry on high resolution screen
  • 32x32 for some reason looks smaller than both 16 and 64 (padding?)
  • 64x64 looks fine on high resolution screen, but looks blurry on low resolution screen

**Long story short, how can I insert custom made icons in my PowerPoint Add-in Ribbon that look consistent and sharp across screen resolutions? **

Thanks!! Mike

icon dimensions

Eugene Astafiev
  • 47,483
  • 3
  • 24
  • 45
mikemakesstuff
  • 1
  • 2
  • Generally, if your XML is using _small_ icons, they should be 16x16 and _large_ icons should be 32x32. In case you haven't seen it, here is Microsoft's page on speccing images for the Ribbon: https://learn.microsoft.com/en-us/windows/win32/windowsribbon/windowsribbon-imageformats – John Korchok Mar 06 '23 at 00:18
  • @JohnKorchok depending on the scale factor the image resolution may vary. – Eugene Astafiev Mar 06 '23 at 10:56
  • Thank you John! Appreciate this a lot – mikemakesstuff Mar 06 '23 at 15:43

1 Answers1

2

The image sizes increase in a linear fashion relative to dpi as illustrated in the following table.

DPI Small Image Large Image
96 dpi 16x16 pixels 32x32 pixels
120 dpi 20x20 pixels 40x40 pixels
144 dpi 24x24 pixels 48x48 pixels
192 dpi 32x32 pixels 64x64 pixels

You can use *.ico file format where you can embed different image sizes. Office applications will pick up an image from the *.ico file which suits the current scale factor best.

Also BMP and PNG file formats are supported by the Fluent UI. You may consider implementing the getImage callback where you can return an image according to the scaling factor set per monitor.

The callback should have the following signature:

C#: IPictureDisp GetImage(IRibbonControl control)

VBA: Sub GetImage(control As IRibbonControl, ByRef image)

C++: HRESULT GetImage([in] IRibbonControl *pControl, [out, retval] IPictureDisp ** ppdispImage)

Visual Basic: Function GetImage(control as IRibbonControl) as IPictureDisp

Note, it is your responsibility to react on scaling factor changes and update images. For each of the callbacks that the add-in implements, the responses are cached.

For example, if an add-in writer implements the getImage callback procedure for a button, the function is called once, the image loads, and then if the image needs to be updated, the cached image is used instead of recalling the procedure. This process remains in place until the add-in signals that the cached values are invalid by using the Invalidate method, at which time, the callback procedure is again called and the return response is cached. The add-in can then force an immediate update of the UI by calling the Refresh method.

Eugene Astafiev
  • 47,483
  • 3
  • 24
  • 45
  • Thank you Eugene!! Appreciate your detailed answer and the callback function. You made it clear that I have to dive into this more than I initially thought, and this is super helpful direction – mikemakesstuff Mar 06 '23 at 15:45