fillRectangle on physical 920xt does not properly fill 15 pixel wide square

Environment:


  • Mac Sierra 10.12.2
  • Eclipse Neon.2 (4.6.2)
  • ConnectIQ SDK 2.2.3 -- Plugins 2.2.3
  • Physical 920XT device (issue present on both FW 9.10 and 9.11 (beta)


Detailed Description:

I discovered that, on my actual 920XT, when drawing a green square (15x15 pixels) using a bitmap resource, and then using fillRectangle to overlay a red square of the same dimensions (15x15) on top of the green square (bitmap), the red fillRectangle square is not 15 pixels wide, but only 14 pixels. This can be seen by the color of the underlying green square showing on the right-hand side of the red fillRectangle square.

This issue is present in both FW 9.10 and 9.11 (beta) on an actual 920 XT, and does not happen in the simulator.
It also does not happen on any of the following actual devices that I have tested:
  • vivoactive
  • 230
  • 735XT


Steps to reproduce:


  • Create a 15x15 filled square bitmap and define as a resource in project
  • Load and draw the bitmap using drawBitmap
  • Change the dc color to something different from the bitmap square
  • Draw fillRectangle of dimensions 15x15 pixels on top of the bitmap, starting at exactly same coordinates as bitmap
  • Build for 920XT and side load to 920XT
  • Observe the protruding color from the underlying bitmap square.


Code sample:

function onUpdate(dc) {
dc.setColor(Gfx.COLOR_BLACK, Gfx.COLOR_BLACK);
dc.clear();

dc.drawBitmap(40, 40, Ui.loadResource(Rez.Drawables.square));
dc.setColor(Gfx.COLOR_WHITE, Gfx.COLOR_BLACK);
dc.drawText(63, 40, Gfx.FONT_SMALL, "15x15 bitmap", Gfx.TEXT_JUSTIFY_LEFT);

dc.drawBitmap(40, 70, Ui.loadResource(Rez.Drawables.square));
dc.setColor(Gfx.COLOR_WHITE, Gfx.COLOR_BLACK);
dc.drawText(63, 70, Gfx.FONT_SMALL, "15x15 fillRectangle", Gfx.TEXT_JUSTIFY_LEFT);
dc.setColor(Gfx.COLOR_RED, Gfx.COLOR_RED);
dc.fillRectangle(40, 70, 15, 15);
}


  • It looks to me that the bitmap may be offset one pixel to the right. This code draws a green 15x15 bitmap and then a black rectangle over it.. you see the bitmap peek through. Then it draws a white rectangle with the green bitmap over the top, and you can see the white rectangle peek through.

    function onUpdate(dc) {
    dc.setColor(Gfx.COLOR_BLACK, Gfx.COLOR_BLACK);
    dc.clear();

    var x = dc.getWidth() / 2 - _M_bitmap.getWidth() / 2;
    var y = dc.getHeight() / 2 - _M_bitmap.getHeight() / 2 - 10;

    dc.drawBitmap(x, y, _M_bitmap);

    dc.setColor(Gfx.COLOR_BLACK, Gfx.COLOR_BLACK);
    dc.fillRectangle(x, y, 15, 15);

    y += 20;

    dc.setColor(Gfx.COLOR_WHITE, Gfx.COLOR_WHITE);
    dc.fillRectangle(x, y, 15, 15);

    dc.drawBitmap(x, y, _M_bitmap);
    }




    Travis
  • Nice catch Travis.

    I increased the y offset by 5 pixels for the top layer so one can better see what goes on behind.

    Reverse is just like what Travis did by drawing fillRectangle first and then the bitmap.

    This concludes that the issue is not with the fillRectangle, but the offset of the bitmap.

  • I don't have a 920 and can't try this, but if you make things 16x16 instead, I wonder if things work correctly, as it might be related to an even/odd thing (how the bitmap is padded or something)
  • I don't have a 920 and can't try this, but if you make things 16x16 instead, I wonder if things work correctly, as it might be related to an even/odd thing (how the bitmap is padded or something)


    Good point Jim!

    Just tested and it seems indeed that your theory is correct.

    15x15 and 17x17 pixels all showed the incorrect offset of 1 pixel with the bitmap, whereas 16x16 gets drawn perfectly.

    That should be sufficient info for the 920xt device team to fix as I believe the issue is in the 920xt vm.