Arduino TFT LCD GUI – Load Bitmap Image

Posted by:

Preamble

There are two ways to draw bitmap images in Arduino TFT LCD – to draw from SD card, or convert them into byte array. The first is more powerful and works with true color bitmap images; the 2nd approach is more suitable for simple logo and monochrome images, and there is no need for SD capability for this method.

Convert Images to C++ Byte Array

There are a few options to convert image into byte array.

Image2Code

This is a handy Java GUI utility to convert a BMP file into the array code necessary to display the image with the drawBitmap function. Check out the code at ehubin’s GitHub repository: https://github.com/ehubin/Adafruit-GFX-Library/tree/master/Img2Code Note that this is a java-based program and you might need to install java from http://www.java.com/en/download/ if you haven’t already done so. Another tool, did not try. One more http://en.radzio.dxp.pl/bitmap_converter/ for windows?

  1. Download the utility from above link
  2. Run the java utility

    java -jar Image2Code.jar
    
  3. Click choose file to convert, copy the code, and paste it into Arduino sketch.

    image2code.png

NB: DrawBitmap in Arduino Sketch

  1. Add following (otherwise it will display garbage) in front of the array:

    static const uint8_t  PROGMEM myBitmap[] = {0xff...
    

    and draw with following code:

    tft.drawBitmap(220, 160, myBitmap, 82, 77, BLACK); //make sure the width and height is exactly the dimension of the image, drawXBitmap does NOT work
    
  2. screenshots with Adafruit and Arch Linux logos

    bmp-arduino.jpeg

drawXBitmap function with GIMP exported Array

You can use the GIMP photo editor to save a .xbm file and use the array saved in the file to draw a bitmap with the drawXBitmap function. See the pull request here for more details: https://github.com/adafruit/Adafruit-GFX-Library/pull/31

Usage:

  1. Export from GIMP to *.xbm, rename *.xbm to *.c and open in editor.
  2. C Array can be directly used with this function
  3. Arduino Sketch

    static const uint8_t  PROGMEM myBitmap[] = {0xff...
    

    and draw with following code:

    tft.drawXBitmap(220, 160, myBitmap, 82, 77, BLACK); //drawXBitmap
    
0
  Related Posts

Add a Comment