Office AddIn button's icon won't show up - manifest

Question

Here's extract from the manifest's Host
<ExtensionPoint xsi:type="PrimaryCommandSurface">
<CustomTab id="MyTab">
<Group id="Raporty.GroupPabcd">
<Label resid="Raporty.GroupPabcd.Label" />
<Icon>
<bt:Image resid="Raporty.Icon1_16" size="16" />
<bt:Image resid="Raporty.Icon1_20" size="20" />
<bt:Image resid="Raporty.Icon1_24" size="24" />
<bt:Image resid="Raporty.Icon1_32" size="32" />
<bt:Image resid="Raporty.Icon1_40" size="40" />
<bt:Image resid="Raporty.Icon1_48" size="48" />
<bt:Image resid="Raporty.Icon1_64" size="64" />
<bt:Image resid="Raporty.Icon1_80" size="80" />
</Icon>
<Control xsi:type="Button" id="RaportPabcd.Button">
<Label resid="RaportPabcd.Button.Label" />
<Supertip>
<Title resid="RaportPabcd.Button.Label" />
<Description resid="RaportPabcd.Button.Tooltip" />
</Supertip>
<Icon>
<bt:Image resid="Raporty.Icon1_16" size="16" />
<bt:Image resid="Raporty.Icon1_20" size="20" />
<bt:Image resid="Raporty.Icon1_24" size="24" />
<bt:Image resid="Raporty.Icon1_32" size="32" />
<bt:Image resid="Raporty.Icon1_40" size="40" />
<bt:Image resid="Raporty.Icon1_48" size="48" />
<bt:Image resid="Raporty.Icon1_64" size="64" />
<bt:Image resid="Raporty.Icon1_80" size="80" />
</Icon>
<Action xsi:type="ShowTaskpane">
<TaskpaneId>ButtonId1</TaskpaneId>
<SourceLocation resid="Contoso.Taskpane.Url" />
</Action>
</Control>
</Group>
<Label resid="Raporty.Tab.Label" />
</CustomTab>
</ExtensionPoint>
as well as the resources
<Resources>
<bt:Images>
<bt:Image id="Raporty.Icon1_16" DefaultValue="~remoteAppUrl/Images/ReportIcons/report_1_16.png" />
<bt:Image id="Raporty.Icon1_20" DefaultValue="~remoteAppUrl/Images/ReportIcons/report_1_20.png" />
<bt:Image id="Raporty.Icon1_24" DefaultValue="~remoteAppUrl/Images/ReportIcons/report_1_24.png" />
<bt:Image id="Raporty.Icon1_32" DefaultValue="~remoteAppUrl/Images/ReportIcons/report_1_32.png" />
<bt:Image id="Raporty.Icon1_40" DefaultValue="~remoteAppUrl/Images/ReportIcons/report_1_40.png" />
<bt:Image id="Raporty.Icon1_48" DefaultValue="~remoteAppUrl/Images/ReportIcons/report_1_48.png" />
<bt:Image id="Raporty.Icon1_64" DefaultValue="~remoteAppUrl/Images/ReportIcons/report_1_64.png" />
<bt:Image id="Raporty.Icon1_80" DefaultValue="~remoteAppUrl/Images/ReportIcons/report_1_80.png" />
</bt:Images>
</Resources>
Problem is that the button shows the default icon
I tried to access the image directly in the browser (i.e. http://localhost/ExcelWebWeb/Images/ReportIcons/report_1_32.png) and it does show up
I have taken a look at the IIS logs to see if the image was even queried by the Excel app, but it wasn't. I can only see access logs from my local browser to the icons while the addin only queries the html/js files (for the TaskPane) without querying for the button's image.

Answer 1

I had the same issue but found a solution. Please add the following to the manifest.xml file:
<Version>1.0.0.0</Version>
<ProviderName>abc</ProviderName>
<DefaultLocale>en-US</DefaultLocale>
<!-- The display name of your add-in. Used on the store and various places of
the Office UI such as the add-ins dialog. -->
<DisplayName DefaultValue="abc" />
<IconUrl DefaultValue="~remoteAppUrl/Images/add-in-icon-lo-res.png"/>
<HighResolutionIconUrl DefaultValue="~remoteAppUrl/Images/add-in-icon-hi-res.png"/>
Resolution for the image should be Iconurls 64 x 64 pixels with 8 bit depth in png and for HighResolutionIconUrl 128 x 128 pixels

Answer 2

try replacing '~remoteAppUrl' with localhost:[port number]. When you publish the app, this needs to be changed to the host and port number

Answer 3

<CustomTab id="MyTab">
<Group id="Raporty.MyTab.GroupPabcd">
<Label resid="Raporty.MyTab.GroupPabcd.Label" />
......
<Label resid="Raporty.MyTab.TabLabel" />
That is corect code for manifest.