SVG icons in the android app

Can you also post the icons itself? I can try to reproduce this when I have the icons as svg.

Hi Mueller, these are the icons Iā€™ve used:movimiento1 movimiento1-closed movimiento1-open puerta puerta-closed puerta-open

Hi Mueller, Sorry for the icons I posted before, I didnā€™t realize they are so odd in size. But after some trials, Iā€™ve concluded the Web UI is able to ā€œresizeā€ any (or almost any) icon size to fit into the right space. However, the APP UI doesnā€™t be able to do this. So, the custom icons must be around 180x180 px in order to be able to show up correctly in both UI.

It seems that some of your icons arenā€™t loading in Firefox:

sorry to bump an old topic, not sure this was resolved at the time. I see the same issue trying to use SVG icons from a standard Linux icon theme - the web (basic) UI renders them perfectly well but the Android app shows them at what looks like half height and half width (so a quarter of the size they should be) as shown in Jcabanas1 screen shot in the thread. An example icon that displays this is attached, but I think itā€™s universalā€¦ certainly with all the ones Iā€™ve tried. Iā€™ve added a .xml extension to try to stop it being rendered as an image.

Using android version 2.12.1 and verified the same behaviour with the beta app.

printer-symbolic.svg

Can you add a screenshot of the icon in the app?

Sure (slightly different one from the image I posted, but same effect as it is with all images)ā€¦

Can you post that icon as well?

yupā€¦ problem is though, the forum consumes the SVG and presents it as an image, so you canā€™t see the definition of it. Iā€™ve tried again to add a version with the original XML code with a txt extensionā€¦

cs-printer

cs-printer

ā€¦which again didnā€™t work. If you DM me an email address I can try to send you the source SVG

You can right click one of the icons => ā€œShow graphicā€ and than view the source code by pressing Control + U (at least in Firefox).
The issue here is that the icon specifies an explicit size. The width and height in the <svg> tag is overridden by the app with 100%, but not any other size, e.g. in <rect style=....
Do you have a version of the icon with percentage values only?

The former is only a problem due to doing the latter :wink: I think we should scale via density instead of overriding the top level size.

so, does that mean itā€™s this something that will be addressed in the app? Or do we need to find/create only certain types of icons that are compatible with the way it currently works?

This is something that should be fixed in the app, but this might take a while.
For now you can use https://materialdesignicons.com/ as icon source. Most icons from there should work. Click on an icon => Icon package => .SVG Optimized

I reopened https://github.com/openhab/openhab-android/issues/913 for this.

thatā€™s great, thanks for the update (and the icon link)

the MD icons work wellā€¦ easy to change the colours in Inkscape too to better work with my dark themed app and basic UI.

Thereā€™s a PR by @maniac103 to improve SVG handling:

2.13.16-beta comes with improved svg icon handling.