{"id":2955,"date":"2020-02-23T01:35:55","date_gmt":"2020-02-22T16:35:55","guid":{"rendered":"https:\/\/programresource.net\/?p=2955"},"modified":"2020-02-23T01:36:03","modified_gmt":"2020-02-22T16:36:03","slug":"show-bitmap-image-on-oled-display-with-arduino-esp-board-tool-provided","status":"publish","type":"post","link":"https:\/\/programresource.net\/en\/2020\/02\/23\/2955.html","title":{"rendered":"Show bitmap image on OLED display with Arduino\/ESP board (Tool provided)"},"content":{"rendered":"\n
\"\"<\/figure>\n\n\n\n

I2C connection Monochrome OLED display is very handy to use. Easy wiring and various libraries provided, such as Adafruit GFX, u8glib, u8g2lib.<\/p>\n\n\n\n

Monochrome bitmap can also be displayed. You need to prepare bitmap image and convert to hex data. There are tools you can download, but I couldn’t find one that is easy to use.<\/p>\n\n\n\n

So, I’ve created easy-to-use tool to convert bmp file to hex data (for Windows).<\/p>\n\n\n\n

Built with Visual Studio \/ C++. Use freely, no support, use at your own risk.<\/p>\n\n\n\n

nfBmptoHex.zip<\/a>Download<\/a><\/div>\n\n\n\n
nfbmptohex.src.7z<\/a>Download<\/a><\/div>\n\n\n\n

Simply create bitmap file with MS paintbrush for example, save as 24bit bmp file.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Launch tool, drag and drop bmp file to tool. You get hex code, copy to your sketch.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

For Arduino, change definition to like below.<\/p>\n\n\n

\nconst unsigned char bmpdata[] PROGMEM = {\n<\/pre><\/div>\n\n\n
Then, use bitmap function with location and size parameter.<\/p>\n\n\n\n
Below are some examples with combination of different library. Since using ESP8266 and Adafruit GFX library results slow display, ESP_Adafruit_SSD1306<\/a> library is used.<\/p>\n\n\n\n
Arduino + u8glib<\/h4>\n\n\n
\n#include <U8glib.h>\n\nconst unsigned char bootimg[] PROGMEM = {\n\t0x00, ... 0x00,\n};\n\nU8GLIB_SSD1306_128X64 u8g(U8G_I2C_OPT_NONE | U8G_I2C_OPT_DEV_0);   \/\/ I2C \/ TWI\n\nvoid setup() {\n\tu8g.begin();\n\tu8g.setColorIndex(1);\n\tu8g.firstPage();\n\tdo {\n\t\tu8g.drawXBMP( 0, 0, 128, 64, bootimg); \n\t} while ( u8g.nextPage() );\n}\n\nvoid loop() {\n}\n<\/pre><\/div>\n\n\n
ESP8266 + Adafruit GFX<\/h4>\n\n\n\n
GPIO4 \/ GPIO5 used for I2C communication.<\/p>\n\n\n
\n#include <Wire.h>\n#include <Adafruit_GFX.h>\n#include <ESP_Adafruit_SSD1306.h>\n\nstatic unsigned char bootimg[] PROGMEM = {\n\t0x00, ... 0x00,\n};\n\n#define PIN_D1 5\n#define PIN_D2 4\nstatic const uint8_t ALT_SDA = PIN_D2;\nstatic const uint8_t ALT_SCL = PIN_D1;\n\nAdafruit_SSD1306 display(-1);\n#if (SSD1306_LCDHEIGHT != 64)\n#error("Height incorrect, please fix Adafruit_SSD1306.h!");\n#endif\n\nvoid setup() {\n\tWire.begin(ALT_SDA, ALT_SCL);\n\tdisplay.begin(SSD1306_SWITCHCAPVCC, 0x3C);\n\tdisplay.clearDisplay();\n\tdisplay.drawXBitmap(0, 0,  bootimg, 128, 64, 1);\n\tdisplay.display();\n}\n\nvoid loop() {\n}\n<\/pre><\/div>\n\n\n
ESP32 + u8g2<\/h4>\n\n\n
\n#include <U8g2lib.h>\n\nU8G2_SSD1306_128X64_NONAME_F_HW_I2C u8g2(U8G2_R0, \/* reset=*\/ U8X8_PIN_NONE);\n\nstatic unsigned char bootimg[] PROGMEM = {\n\t0x00, ... 0x00,\n};\n\nvoid setup() {\n     u8g2.begin();\n     u8g2.clearBuffer();\n     u8g2.setBitmapMode(false \/* solid *\/);\n     u8g2.setDrawColor(1);\n     u8g2.drawXBM( 0, 0, 128, 64, bootimg);\n     u8g2.sendBuffer();\n}\n\nvoid loop() {\n}\n<\/pre><\/div>\n\n\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
I2C connection Monochrome OLED display is very handy to use. Easy wiring and various libraries provided, such as Adafruit GFX, u8glib, u8g2lib. Monochrome bitmap can also be displayed. You need to prepare bitmap image and convert to hex data. There are tools you can download, but I couldn’t find one that is easy to use. So, I’ve created easy-to-use tool to convert bmp file to hex data (for Windows). Built with Visual Studio \/ C++. Use freely, no support, use at your own risk. Simply create bitmap file with MS paintbrush for example, save as 24bit bmp file. Launch tool, drag and drop bmp file to tool. You get hex …<\/p>\n","protected":false},"author":2,"featured_media":2945,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"ngg_post_thumbnail":0,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","footnotes":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false}}},"categories":[866,868],"tags":[862,896,898,893,894,897,895],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/programresource.net\/images\/2020\/02\/P_20200223_002338_vHDR_Auto.jpg","jetpack_shortlink":"https:\/\/wp.me\/p3pJyQ-LF","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/posts\/2955"}],"collection":[{"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/comments?post=2955"}],"version-history":[{"count":2,"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/posts\/2955\/revisions"}],"predecessor-version":[{"id":2958,"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/posts\/2955\/revisions\/2958"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/media\/2945"}],"wp:attachment":[{"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/media?parent=2955"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/categories?post=2955"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/programresource.net\/en\/wp-json\/wp\/v2\/tags?post=2955"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}