Color incorrect using image converter result.

Posted on
  • Hello Gordon,
    I don't know if I found bug, but i've encontered strage behaviour. Converted png image using https://www.espruino.com/Image+Converter­
    Original image is RedHeart.png [attached]
    Result for converted [attached] is

    var img = {
      width : 48, height : 48, bpp : 4,
      buffer : require("heatshrink").decompress(atob("x­AAbzOZzAKHxILBCxQACBSALFGIotCDBALGBggKGE­YgLGBgYiHEYYLIBgQKIEZYXOBZAMBERIjLC5oLKC­5YLLABYX/C8CnKABa/LC/p4UOwIXYJCgWCC7BISI­wYwTCwgwRFwoXYJCAWGGB4uHGB4WIGBouJGBoWKG­BYuLGBYWMGBIuNGBIWOGA4uPGA4WQGAouRGAoWSG­AYuTGAYWUC7GJIyoA9A"))
    }
    

    Result in IDE emulator and actual device [attached] is BLUE as seen in one of the screenshots. Is it error in https://www.espruino.com/Image+Converter­ or something else?

    My code to display picture is following:

    const fontName = "6x8";
      const fontSize = 3;
      g.clear();  // clear screen
      g.reset();  // default draw styles
      g.setFont(fontName, fontSize);
      g.drawImage(img, 48, 125);
    

    3 Attachments

    • errHeartRed.png
    • errResultBlue.png
    • Hearts.png
  • Bangle.js doesn't support 4 bit RGBA - it assumes that all 4 bit images use the Mac palette. You can see what color formats are supported here: https://www.espruino.com/Reference#l_Gra­phics_drawImage

  • It really was my issue- incorrect color format. Thak you

  • Yep - RGBA is there to help with other devices. You could actually still draw the image in RGBA if you supplied your own palette though: http://www.espruino.com/Reference#l_Grap­hics_drawImage

    Just to add - in this sort of case I'd actually recommend you use either black and white 1 bit (or 2 bit if you want a really smooth image). While you end up with a black and white image, you can just use g.setColor("#ff0000") before you draw to make it red (or whatever colour you want)

  • Post a reply
    • Bold
    • Italics
    • Link
    • Image
    • List
    • Quote
    • code
    • Preview
About

Color incorrect using image converter result.

Posted by Avatar for Lixas @Lixas

Actions