How can I improve my Bitmap's quality?

I would like to improve my bitmap graphics in my watch face. Here is an example of the problem I'm facing:

As you can see in the picture above, the man to the left is what I actually get. The man to the right is what is actually in the .png file. It is actually only a 25 x 25 pixel file.

Thanks.

Top Replies

Simone85 2 months ago in reply to FlowState +1

You definitely made my day!!! Thank you so much!
Now I have to try and see if automaticPalette="false" works in darkMode as well...
FlowState 2 months ago in reply to Simone85 +1

Simone85 said:
Also I do have a Mac and I haven't found an easy way to build .fnt from .svg images.

As mentioned in the other recent thread where this was discussed, you should be able to use this procedure…

All Replies

Simone85 2 months ago in reply to flocsy🤠

Hi flocsy🤠, here's my drawables.xml:

Super simple and definitely not a secret ;-)

Digging a bit more into the problem and thanks to all your replies I understood that the issue was related to the <palette> tag.

I was specifying only one color and that was probably the main issue.

Removing <palette> tag or specifying the complete image palette rendered my image properly.

Unfortunately this approach seems to work with .png bitmap only. I can't make it work with .svg

Simone85 2 months ago in reply to mcinner1

Yes, that's what I did but in that case both .png and .svg format got pixelised.

flocsy🤠 2 months ago in reply to Simone85

Simone85 said:
I can't make it work with .svg

That's strange because I use it with svg in most of my icons. Maybe you should post the svg (and the drawable definition) and a screenshot to demonstrate the "not working" part.

Simone85 2 months ago in reply to flocsy🤠

Sure! Thanks for your help!

this is the svg drawable.xml definition:

And here the results:

The one on the left is the .svg version. The one on the right the .png one (without any palette tag)

Unfortunately I am not an expert in rendering image. Thanks to you guys I am learning something new!

flocsy🤠 2 months ago in reply to Simone85

van you also attach the svg?

Simone85 2 months ago in reply to flocsy🤠

cadence.txt

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
   version="1.1"
   x="0px"
   y="0px"
   viewBox="0 0 329.14301 329.14301"
   xml:space="preserve"
   id="svg1"
   sodipodi:docname="cadence.svg"
   width="329.14301"
   height="329.14301"
   inkscape:version="1.4 (e7c3feb1, 2024-10-09)"
   inkscape:export-filename="cadence.png"
   inkscape:export-xdpi="72"
   inkscape:export-ydpi="72"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:svg="http://www.w3.org/2000/svg"><defs
     id="defs1" /><sodipodi:namedview
     id="namedview1"
     pagecolor="#ffffff"
     bordercolor="#000000"
     borderopacity="0.25"
     inkscape:showpageshadow="2"
     inkscape:pageopacity="0.0"
     inkscape:pagecheckerboard="0"
     inkscape:deskcolor="#d1d1d1"
     inkscape:zoom="0.2"
     inkscape:cx="170"
     inkscape:cy="125"
     inkscape:window-width="1496"
     inkscape:window-height="713"
     inkscape:window-x="0"
     inkscape:window-y="38"
     inkscape:window-maximized="0"
     inkscape:current-layer="svg1" /><path
     d="M 320.00011,274.2858 H 287.0858 l -58.5143,-58.5143 c 11.33709,-14.26291 17.92,-31.81709 17.92,-51.2 0,-45.3486 -36.93709,-82.285692 -82.2857,-82.285692 -19.38291,0 -37.30291,6.582784 -51.19999,17.920002 L 67.6572,54.8572 h 31.274108 c 5.119992,0 9.142782,-4.022917 9.142782,-9.142917 0,-5.12 -4.02279,-9.14278 -9.142782,-9.14278 H 9.1428927 c -5.12,0 -9.14278001445,4.02278 -9.14278001445,9.14278 0,5.12 4.02278001445,9.142917 9.14278001445,9.142917 H 42.057203 l 58.514297,58.5143 c -11.337211,14.26292 -17.919996,31.81709 -17.919996,51.2 0,45.34861 36.937086,82.28569 82.285686,82.28569 19.38292,0 37.30292,-6.58278 51.2,-17.92 l 45.34861,45.34861 h -31.27405 c -5.12,0 -9.14291,4.02279 -9.14291,9.14279 0,5.12 4.02291,9.14291 9.14291,9.14291 h 89.78836 c 5.12,0 9.14278,-4.02291 9.14278,-9.14291 0,-5.12 -4.02278,-9.14279 -9.14278,-9.14279 z M 164.5715,228.5715 c -35.10861,0 -64,-28.89139 -64,-64 0,-35.10861 28.89139,-64 64,-64 35.10861,0 64,28.89139 64,64 0,14.26291 -4.75431,27.42861 -12.8,38.4 l -44.61722,-44.98291 c -3.65709,-3.65709 -9.50848,-3.65709 -12.8,0 -3.65709,3.65721 -3.65709,9.5086 0,12.8 l 44.61722,44.98291 c -10.97139,8.04569 -24.13722,12.8 -38.4,12.8 z"
     id="path1"
     sodipodi:nodetypes="sccssccssssssccssccsssssssssscccccs"
     style="stroke-width:3.65714" /></svg>

Here it is. Uploaded as .txt cause with .svg I wasn't able (don't know why).

mcinner1 2 months ago in reply to mcinner1

mcinner1 said:
What happens if only one palette (black) is set in drawings XML is, that all „nearby to black“ colors turn to black, whereas all „fare away to black“ (like light grey pixels) are eliminated. If you set more palette colors in the XML (or no palette at all), you can avoid this problem. But since Simon uses only black or white palette to define day or night mode color, the antialiasing effect is removed.

>>Simone85:

I was specifying only one color and that was probably the main issue.

Removing <palette> tag or specifying the complete image palette rendered my image properly.

FlowState 2 months ago in reply to Simone85

Add the automaticPalette attribute with a value of "false" to the bitmap tag.

i.e.

<bitmap id="CadenceSvg" filename="cadence.svg" dithering="none" scaleX="10%" scaleY="10%" automaticPalette="false" />

I confirmed that this works in the sim, for edge_820. By default, automaticPalette is "true" (for 16-bit colour devices), and in this case, it seems to be reducing the palette of your scaled image to have 1 colour only (black), as opposed to all the grey-ish colours necessary to make it look nice.

As per the docs:

https://developer.garmin.com/connect-iq/core-topics/resources/#bitmaps

FlowState 2 months ago in reply to FlowState

Here's my results in the simulator for edge_820:

Without automaticPalette / with automaticPalette="true":

With automaticPalette="false":

Simone85 2 months ago in reply to mcinner1

Yes, for .png that makes sense. For .svg (since it's not a raster but a vector image) I was expecting something different...