Incorrect bitmap dimensions and changing when using a palette

Former Member
Former Member
I have a 9x19 png image that I'm trying to use in my watch face. The first issue I'm facing is that when loading the resource, the BitmapResource getWidth() method returns 10 instead of 9, but the height is correctly returned as 19. The second issue I'm facing is that after adding a custom palette to the same icon, the getWidth() method returns 12!
[table="width: 500, class: grid"]
[tr]
[td]drawables.xml[/td]
[td]result of loaded resource.toString()[/td]
[/tr]
[tr]
[td]<drawables>
<bitmap id="Icon" filename="Icon.png" />
</drawables>
[/td]
[td]"Bitmap 10 x 19"[/td]
[/tr]
[tr]
[td]<drawables>
<bitmap id="Icon" filename="Icon.png" >
<palette>
<color>000000</color>
<color>0000FF</color>
<color>FFFFFF</color>
</palette>
</bitmap>
</drawables>
[/td]
[td]"Bitmap 12 x 19"[/td]
[/tr]
[/table]

This also seems to be happening to other pngs I've used where the width is larger than it should be. Are there some oddities with sizing of images or something I could be missing?

Thanks!
  • Former Member
    Former Member
    Can you provide some details about what device you are building for? If you don't mind sending a project that displays this issue to [email][email protected][/email], it would aid in investigation.
  • We received your email with examples, so will take a look. Thanks!
  • This also seems to be happening to other pngs I've used where the width is larger than it should be. Are there some oddities with sizing of images or something I could be missing?


    I've experienced something similar.

    Could be related to this...
    https://developer.garmin.com/index.php/blog/post/pro-tip-using-the-bitmap-palette-options

    "Images in Connect IQ have to be 4 byte aligned. The resource compiler will pad non-aligned images with transparent pixels to meet the requirement"
  • Former Member
    Former Member
    That was it, thanks everyone! It was something that I was missing :). I did a little testing to see if that was the case. I made 9 images of width: 1-9px and height: 1px.

    Loading them without palettes and using their toString yielded:
    Bitmap 2 x 1
    Bitmap 2 x 1
    Bitmap 4 x 1
    Bitmap 4 x 1
    Bitmap 6 x 1
    Bitmap 6 x 1
    Bitmap 8 x 1
    Bitmap 8 x 1
    Bitmap 10 x 1


    Loading them with palettes and using their toString yielded:
    Bitmap 4 x 1
    Bitmap 4 x 1
    Bitmap 4 x 1
    Bitmap 4 x 1
    Bitmap 8 x 1
    Bitmap 8 x 1
    Bitmap 8 x 1
    Bitmap 8 x 1
    Bitmap 12 x 1


    So it looks like when you just use a bitmap directly, it only pads to the nearest 2px width, but with palettes it pads to the nearest 4px. As that blog post states:
    If you don't use a multiple of four for the image width, the resource compiler will pad the image to meet the alignment requirement with a color from your palette.


    This is the first time I've seen those blog posts. It seems like there is a lot of valuable/critical information about Connect IQ development that you can't necessarily find in the programmer's guide. Is there an easy way to navigate the blog posts to find information on specific subjects?
  • Former Member
    Former Member
    Just to make things more confusing for you...

    This actually should not be happening, and we are looking into it. In the earliest ConnectIQ revisions, this oddity with bitmaps was true, but we made a change to get rid of it and we aren't sure why it is showing up again all of a sudden. The comment in the blog post should be getting removed.

    The physical memory of the bitmap does behave this way to facilitate rendering, but the "padding" bits should not get rendered to the screen, and should not be reported as part of the bitmap width.
  • Former Member
    Former Member
    A bit of a delayed reply, but that's quite interesting. Good to know that the project I emailed wasn't for nothing haha. Has there been any update on that issue?
  • A fix for this was put into place in the 2.3.0 beta SDK release. Thanks!