There is probably nothing wrong with the ionic / typescript code as such, because custom icons work for me in general. I am unsure what is wrong with my SVG file, but I suspect that it is not enough to make the SVG single coloured to make it a useful icon? I tried the "Object to Path" functionality and other desparate measures but it did does not help.I am absolutely sure that the icon is an icon of one single color: black.Only the caption of the tab adapts colors accordingly. Saved as an Inkscape SVG and used as a custom icon in my app. The result is a black-only kind of a "crescent moon". I used the grey one to "cut off" a part of the black circle with the "Difference" operation. Now the trouble begins! I started a new icon again, now I had two intersecting circles, one was black, the other one was grey. It was stored as Inkscape SVG and it worked smoothly! Next I started a new icon from scratch and added 6 non-intersecting circles with the default Inkscape color. Loading the resulting SVG as custom icon still works flawlessly! Then I added a simple circle to the airplane shape and stored it again as Inkscape SVG. The file size is slightly bigger due to all the additional stuff that is added by Inkscape. Then I loaded the very same SVG into Inkscape and just stored it as "Inkscape SVG". I used this nice Airplane Shape by GraphBerry: My best guess is that I am doing something terribly wrong when creating a proper icon with Inkscape in the first place.įirst I took a freely available SVG icon from the web and used it in my tabbed ionic application as custom icon. the tab icon always has the original color (black) only the caption changes the color accordingly.If I create my own b/w SVG icon with Inkscape, the result is that the icon does not change its color.
they get the primary color when the tab is activated.they are greyed out when the tab is deactivated.When I use any out-of-the-box Ionicons or other customly made SVG icons in my tabbed ionic application they all work fine, i.e.
0 kommentar(er)
