ESPDuino改(ESP-WROOM-02)でTFTにBMP画像を表示する。SPIFFS(SPI Flash File System)
ESPDuino改(ESP-WROOM-02)でTFTにBMP画像を表示する。SPIFFS(SPI Flash File System)使用。かわいい篠崎愛ちゃんの今年のカレンダーの表紙です。ESP-WROOM-02は内部に4MBものフラッシュメモリーを搭載しています。そのうちMAX3MBまでファイル置き場として使うことができるとのことで、それを利用してBMPの画像ファイルの表示をやってみました。フラッシュメモリーをファイルシステムとして使用できるようにするために、SPIFFSというのをインストールします。参考にしたサイトは下記。Arduino IDE に ESP8266 SPIFFS ファイルシステムアップローダーをインストールする方法最初、上手く動作しないのでかなり苦労しました。結局、最終的にうまく動作(読み書き)するようになったのですが、何が問題だったのか、いまいちはっきりとしません。可能性としては、ArduinoIDEのツール以下のボードの設定が対象HWに対して適切でなかったから、なのでは?って思います。SPIFFSに画像データをアップロードしたのち、それをTFTLCDに表示させるために参考にしたサイトは以下。楽しくやろう。ESP8266のフラッシュメモリをファイルシステムとして使用する(2)(ST7735でBMP表示)楽しくやろう。激安QVGA液晶をESP8266で使う(ILI9341でJPEG表示)上のサイトではJPEGファイルを表示させています。ファイルシステムといっても、たった3MBなので、320*240程度のBMP画像ではせいぜい10枚程度しか保存できません。JPEG展開できれば圧縮した小さなサイズのファイルを100個は置けるのでSDメモリーカードの代わりにも使えると思います。撮影された画像の色は悪いのですが、実際のTFTLCDの表示はかなりきれいです。<<追記>>ArduinoIDE(1.6.9)での今回の動作スケッチを掲載します。基本的に、上記の参照サイト(楽しくやろう。)の通りに記述しています。Adafruit ILI9341 Libraryについてきたライブラリー(spitftbitmap)のSDカード部分をSPIFFSに変更、ST7735->ILI9341対応変更です。//-------------------------------------------------------------------------------#include <SPI.h> //<>を半角文字に変更してください。#include <FS.h> //<>を半角文字に変更してください。#include <Adafruit_GFX.h> // Core graphics library //<>を半角文字に変更してください。#include <Adafruit_ILI9341.h> // Hardware-specific library //<>を半角文字に変更してください。#define TFT_CS 15#define TFT_RST 5#define TFT_DC 4Adafruit_ILI9341 tft = Adafruit_ILI9341(TFT_CS, TFT_DC); void setup() { // put your setup code here, to run once: Serial.begin(19200); Serial.println(""); delay(10); tft.begin(); // read diagnostics (optional but can help debug problems) uint8_t x = tft.readcommand8(ILI9341_RDMODE); Serial.println(""); Serial.print("Display Power Mode: 0x"); Serial.println(x, HEX); x = tft.readcommand8(ILI9341_RDMADCTL); Serial.print("MADCTL Mode: 0x"); Serial.println(x, HEX); x = tft.readcommand8(ILI9341_RDPIXFMT); Serial.print("Pixel Format: 0x"); Serial.println(x, HEX); x = tft.readcommand8(ILI9341_RDIMGFMT); Serial.print("Image Format: 0x"); Serial.println(x, HEX); x = tft.readcommand8(ILI9341_RDSELFDIAG); Serial.print("Self Diagnostic: 0x"); Serial.println(x, HEX); tft.fillScreen(ILI9341_BLACK); SPIFFS.begin(); //bmpDraw("/test1.bmp", 0,0); //SPIFFSから読みだすBMPファイル名を記述 delay(100);}void loop() { tft.fillScreen(ILI9341_BLACK); bmpDraw("/Ai2016_top.bmp", 0,0); //SPIFFSから読みだすBMPファイル名を記述 delay(2000); tft.fillScreen(ILI9341_BLACK); bmpDraw("/Ai2016_0102.bmp", 0,0); //SPIFFSから読みだすBMPファイル名を記述 delay(2000); tft.fillScreen(ILI9341_BLACK); bmpDraw("/Ai2016_03.bmp", 0,0); //SPIFFSから読みだすBMPファイル名を記述 delay(2000); tft.fillScreen(ILI9341_BLACK); bmpDraw("/Ai2016_04.bmp", 0,0); //SPIFFSから読みだすBMPファイル名を記述 delay(2000); tft.fillScreen(ILI9341_BLACK); bmpDraw("/Ai2016_0506.bmp", 0,0); //SPIFFSから読みだすBMPファイル名を記述 delay(2000); tft.fillScreen(ILI9341_BLACK); bmpDraw("/Ai2016_0708.bmp", 0,0); //SPIFFSから読みだすBMPファイル名を記述 delay(2000); }#define BUFFPIXEL 20void bmpDraw(char *filename, uint8_t x, uint16_t y) { File bmpFile; int bmpWidth, bmpHeight; // W+H in pixels uint8_t bmpDepth; // Bit depth (currently must be 24) uint32_t bmpImageoffset; // Start of image data in file uint32_t rowSize; // Not always = bmpWidth; may have padding uint8_t sdbuffer[3*BUFFPIXEL]; // pixel buffer (R+G+B per pixel) uint8_t buffidx = sizeof(sdbuffer); // Current position in sdbuffer boolean goodBmp = false; // Set to true on valid header parse boolean flip = true; // BMP is stored bottom-to-top int w, h, row, col; uint8_t r, g, b; uint32_t pos = 0, startTime = millis(); if((x >= tft.width()) || (y >= tft.height())) return; Serial.println(); Serial.print(F("Loading image '")); Serial.print(filename); Serial.println('\''); // Open requested file on SD card if (!(bmpFile = SPIFFS.open(filename,"r"))) { Serial.print(F("File not found")); return; } // Parse BMP header if(read16(bmpFile) == 0x4D42) { // BMP signature Serial.print(F("File size: ")); Serial.println(read32(bmpFile)); (void)read32(bmpFile); // Read & ignore creator bytes bmpImageoffset = read32(bmpFile); // Start of image data Serial.print(F("Image Offset: ")); Serial.println(bmpImageoffset, DEC); // Read DIB header Serial.print(F("Header size: ")); Serial.println(read32(bmpFile)); bmpWidth = read32(bmpFile); bmpHeight = read32(bmpFile); if(read16(bmpFile) == 1) { // # planes -- must be '1' bmpDepth = read16(bmpFile); // bits per pixel Serial.print(F("Bit Depth: ")); Serial.println(bmpDepth); if((bmpDepth == 24) && (read32(bmpFile) == 0)) { // 0 = uncompressed goodBmp = true; // Supported BMP format -- proceed! Serial.print(F("Image size: ")); Serial.print(bmpWidth); Serial.print('x'); Serial.println(bmpHeight); // BMP rows are padded (if needed) to 4-byte boundary rowSize = (bmpWidth * 3 + 3) & ~3; // If bmpHeight is negative, image is in top-down order. // This is not canon but has been observed in the wild. if(bmpHeight < 0) { //<を半角文字に変更してください。 bmpHeight = -bmpHeight; flip = false; } // Crop area to be loaded w = bmpWidth; h = bmpHeight; if((x+w-1) >= tft.width()) w = tft.width() - x; if((y+h-1) >= tft.height()) h = tft.height() - y; // Set TFT address window to clipped image bounds tft.setAddrWindow(x, y, x+w-1, y+h-1); for (row=0; row<h; row++) { // For each scanline... //<>を半角文字に変更してください。 // Seek to start of scan line. It might seem labor- // intensive to be doing this on every line, but this // method covers a lot of gritty details like cropping // and scanline padding. Also, the seek only takes // place if the file position actually needs to change // (avoids a lot of cluster math in SD library). if(flip) // Bitmap is stored bottom-to-top order (normal BMP) pos = bmpImageoffset + (bmpHeight - 1 - row) * rowSize; else // Bitmap is stored top-to-bottom pos = bmpImageoffset + row * rowSize; if(bmpFile.position() != pos) { // Need seek? bmpFile.seek(pos,SeekSet); buffidx = sizeof(sdbuffer); // Force buffer reload } for (col=0; col<w; col++) { // For each pixel... //<>を半角文字に変更してください。 // Time to read more pixel data? if (buffidx >= sizeof(sdbuffer)) { // Indeed bmpFile.read(sdbuffer, sizeof(sdbuffer)); buffidx = 0; // Set index to beginning } // Convert pixel from BMP to TFT format, push to display b = sdbuffer[buffidx++]; g = sdbuffer[buffidx++]; r = sdbuffer[buffidx++]; tft.pushColor(tft.color565(r,g,b)); } // end pixel } // end scanline Serial.print(F("Loaded in ")); Serial.print(millis() - startTime); Serial.println(" ms"); } // end goodBmp } } bmpFile.close(); if(!goodBmp) Serial.println(F("BMP format not recognized."));}// These read 16- and 32-bit types from the SD card file.// BMP data is stored little-endian, Arduino is little-endian too.// May need to reverse subscript order if porting elsewhere.uint16_t read16(File &f) { uint16_t result; ((uint8_t *)&result)[0] = f.read(); // LSB ((uint8_t *)&result)[1] = f.read(); // MSB return result;}uint32_t read32(File &f) { uint32_t result; ((uint8_t *)&result)[0] = f.read(); // LSB ((uint8_t *)&result)[1] = f.read(); ((uint8_t *)&result)[2] = f.read(); ((uint8_t *)&result)[3] = f.read(); // MSB return result;}