This ESP32-CAM Project covers how to use ESP32-CAM with a TFT display to show the picture captured by the cam. We have covered several times how to use ESP32-CAM in different projects and we have described how to use ESP32-CAM in Machine Learning projects. Even if we can use ESP32-CAM with a Web server to show pictures, in this post we want to cover how to show a picture on a TFT screen (ST7735). Therefore, we would like to visualize the picture taken by the ESP32-CAM directly on the display. In this case, we use an ST7735s display, anyway, you can select a different TFT if you like.
You should already know how to take a picture using an ESP32-CAM therefore we will focus on two aspects only:How to connect the ESP32-CAM to TFT display
This is the most interesting part because here we will show the picture taken by the ESP32-CAM on the TFT display. To do it, we will use the TJpg_Decoder library because it simplifies our work. First of all, we use a low-resolution such as 120×160 so that the picture fits in the TFT.
defining the scale and the callback method used to render the picture:bool tft_output(int16_t x, int16_t y, uint16_t w, uint16_t h, uint16_t* bitmap){
At the end of this tutorial, you have learned how to use ESP32-CAM with TFT display. In this project we have integrated ESP32-CAM with ST7735 to show the image captured. We have build a simple camera machine using ESP32-CAM.
At first it was not successful, since most examples useTJpg_Decoderand it use a lot of memory, causing the ESP32-CAM crash then reboot. Then I found out that there"s an function from the ESP32 library to convert JPEG into RGB565 (which is the format used by the Adafruit driver). I can even scale the image to 1/2 side size (= 1/4) so it fit the ST7735S 160x128 or 128x128 displays nicely. Everything works and problem solved.
You can find some more details about wiring, the training data (Kaggle Cats and Dogs Dataset) and the model (MobileNetV1 96x96 0.25 with transfer learning) on my repo. There"s also a copy of my model library and a boilerplate version (without using button and TFT).
The train accuracy is 89.8% and test accuracy is 86.97% on Edge Impulse. Captured image is 240x240 (resized to 120x120 on TFT and 96x96 for the model). Model inference (predict) time on ESP32-CAM is 2607 ms (2.6 secs). It"s not fast, but the setup is so cheap I think this can actually be useful as real world applications...?
Module with WiFi Espressif ESP32-S2. It has 4 MB of Flash memory, 2 MB of external PSRAM memory, integrated WiFi 802.11 b/g/n transceiver and a JST-PH 2.0 connector for connecting a LiPo battery. The board has a TFT LCD display and an RGB LED. FeatherS2 is easy to integrate with sensors due to the available STEMMA QT connector (Qwiic compatible).
// NB. I am using the Arduino IDE v1.8.19,// and the ESP32 software from "https://github.com/espressif/arduino-esp32", BUT the ESP32 software version downloaded on 28May21.// (Note that the version as at now (19Aug22) seems to have a bug in it that stops the camera giving a valid photo.)// I am using Board="AI Thinker ESP32-CAM"#include "FS.h"#include #include #include // https://github.com/adafruit/Adafruit-GFX-Library#include // https://github.com/adafruit/Adafruit_ILI9341#include // https://github.com/Bodmer/TJpg_Decoder#include "esp_camera.h"#define CAMERA_MODEL_AI_THINKER // Has PSRAM#include "camera_pins.h"#define BLOCK_SERIAL // comment-out to use GPIO-1 & GPIO-3 for Serial-output instead (useful for debugging Camera & TFT)#ifdef BLOCK_SERIAL#define Serial tft#define SD_CS 1 // via 1k for safety#define SWITCH_PIN 3 // via 1k for safety#else// GPIO-1 is ESP32-Tx// GPIO-3 is ESP32-Rx#endif#define RED_LED 33#define SPI_MOSI 13#define SPI_MISO 12#define SPI_CLK 14#define TFT_DC 2 // Data Command control pin#define TFT_CS 15 // Chip select control pin#define TFT_RST -1 // or can connect to GPIO-16 via 1k for safety (but GPIO also used for the PSRAM)SPIClass MySPI(HSPI); // Declare an HSPI bus object (to use or BOTH TFT and SD-card)Adafruit_ILI9341 tft = Adafruit_ILI9341(&MySPI, TFT_DC, TFT_CS, TFT_RST);// Adafruit_ILI9341 tft = Adafruit_ILI9341(TFT_CS, TFT_DC, SPI_MOSI, SPI_CLK, TFT_RST,SPI_MISO);#define TFT_ROTATION 0 // 0 to 3boolean camera_ok;// ******************************************************************************************void setup() { // ***************************************************************************tft.begin();tft.setRotation(TFT_ROTATION);tft_clear();tft.println("Hello World");#ifdef RED_LEDpinMode(RED_LED, OUTPUT);LED_flash(2);#endif#ifdef BLOCK_SERIAL#ifdef SWITCH_PINpinMode(SWITCH_PIN, INPUT_PULLUP);#endif#ifdef SD_CSSerial.print("SDcard: ");boolean success=SD.begin(SD_CS,MySPI);if (success) {Serial.println("OK");} // works!else {Serial.println("Fail: check formatted SD-card is in!"); return;} // dont do the rest of setup()!#endif#elseSerial.begin(115200);Serial.println("ESP32-CAM WITHOUT SD-Card");#endifcamera_ok=camera_init();TJpgDec.setJpgScale(1);TJpgDec.setCallback(tft_output); // "tft_output" is passed to the decoderSerial.print("\nRunning ");if (camera_ok) Serial.println("OK"); else Serial.println("but without Camera");delay(5000);} // end of setup() // **********************************************************************// ******************************************************************************************// ******************************************************************************************void loop() { // ****************************************************************************#define photo_count_max 12 // 0 to 11static int photo_next_free=photo_count_max; // 0=none, -1=none-already-reported // set to "photo_count_max" on boot so will count number of photos!#ifdef SWITCH_PINboolean push_switch=!digitalRead(SWITCH_PIN);if (push_switch) {tft_clear();Serial.println("Release for photo OR");Serial.println("Hold 3s = delete ALL");int x;for (x=0;x<12;x++) {delay(250); if (digitalRead(SWITCH_PIN)) break;} // allow for switch bounceif (x==12) {push_switch=false; sd_wipe_all(); photo_next_free=0;}}#elsedelay(5000);boolean push_switch=true;#endifif (push_switch) photo_next_free=take_picture(photo_next_free);else if (photo_next_free>0) {photo_next_free=sd_load_and_display(photo_next_free);} // NEXT-EMPTY photo-countelse if (photo_next_free==0) {photo_next_free=-1; tft_clear(); Serial.println("No photos!");} // only report once} // end of loop() // ***********************************************************************// ******************************************************************************************#ifdef RED_LEDvoid LED_flash(int count) {count*=2;boolean state=LOW; // LOW is ONwhile (count--) {digitalWrite(RED_LED,state); state=!state; delay(1000);}}#endif// ******************************************************************************************#if ((TFT_ROTATION&B1)==1)#define tft_text_row 0#else#define tft_text_row 260 // 240x320#endifvoid tft_top() {tft.setCursor(0,0);}void tft_text() {tft.setCursor(0,tft_text_row);}void tft_clear() {tft.fillScreen(ILI9341_BLACK);tft.setCursor(0,0); // toptft.setTextColor(ILI9341_WHITE);tft.setTextSize(2); // 1 to 5 // was 4}boolean tft_output(int16_t x, int16_t y, uint16_t w, uint16_t h, uint16_t* bitmap) {if (y>=tft.height()) return false;tft.drawRGBBitmap(x, y, bitmap, w, h);return true;}// ******************************************************************************************char* sd_build_file_name(int photo) {if (photo>999) photo=999;static char text[]="/photoXXX.jpg";snprintf(text+6,3+1,"%d",photo);char *p1=text+strlen(text);strcpy(p1,".jpg");return text;}void sd_wipe_all() {tft_clear();Serial.println("Deleting photos:");boolean found=false;fs::FS &fs = SD;for (int x=(photo_count_max-1);x>=0;x--) {char *path=sd_build_file_name(x);boolean success=fs.remove(path);if (success) found=true;if (found) {Serial.print(path+1); Serial.print("->");if (success) Serial.println("Deleted"); else Serial.println("Failed");} }if (!found) Serial.println("No photos to delete!");delay(5000);}int sd_load_and_display(int photo_next) { // returns NEXT_EMPTY_photo_count (ie. 0 if no photos)#ifdef BLOCK_SERIALif ((photo_next<0) or (photo_next>=photo_count_max)) photo_next=0;int first_blank=photo_count_max;for (int y=0;y=(photo_count_max-1)) photo_next=0; else photo_next++; // next photo}return first_blank; // NEXT_EMPTY photo_count (0 if empty, photo_count_max if full)#elseSerial.println("Can"t use SD-Card as uses GPIO-1");return 0;#endif}// ******************************************************************************************boolean camera_init() {camera_config_t config;config.ledc_channel = LEDC_CHANNEL_0;config.ledc_timer = LEDC_TIMER_0;config.pin_d0 = Y2_GPIO_NUM;config.pin_d1 = Y3_GPIO_NUM;config.pin_d2 = Y4_GPIO_NUM;config.pin_d3 = Y5_GPIO_NUM;config.pin_d4 = Y6_GPIO_NUM;config.pin_d5 = Y7_GPIO_NUM;config.pin_d6 = Y8_GPIO_NUM;config.pin_d7 = Y9_GPIO_NUM;config.pin_xclk = XCLK_GPIO_NUM;config.pin_pclk = PCLK_GPIO_NUM;config.pin_vsync = VSYNC_GPIO_NUM;config.pin_href = HREF_GPIO_NUM;config.pin_sscb_sda = SIOD_GPIO_NUM;config.pin_sscb_scl = SIOC_GPIO_NUM;config.pin_pwdn = PWDN_GPIO_NUM;config.pin_reset = RESET_GPIO_NUM;config.xclk_freq_hz = 20000000;config.pixel_format = PIXFORMAT_JPEG;Serial.print("PSRAM: ");if (psramFound()){ // larger buferSerial.println("OK");config.frame_size = FRAMESIZE_QVGA;config.jpeg_quality = 10;config.fb_count = 1;} else { // smaller bufferSerial.println("FAILED");config.frame_size = FRAMESIZE_QQVGA;config.jpeg_quality = 12;config.fb_count = 1;}esp_err_t camera_status;for (int x=0;x<2;x++) { // try twice as sometimes get error 0x20004delay(2000);camera_status = esp_camera_init(&config);Serial.print("Camera init: ");if (camera_status!=ESP_OK) {Serial.print("failed with error 0x"); Serial.println(camera_status,HEX);}else {Serial.println("OK"); break;}}if (camera_status!=ESP_OK) return false; // exitsensor_t *sensor = esp_camera_sensor_get();if (sensor->id.PID == OV3660_PID) Serial.println("*** WARNING: Old-PID Sensor Detected - need to adjust settings ***");return true;}int take_picture(int photo_next) {int photo_try=photo_next;if ((photo_try<0) or (photo_try>=photo_count_max)) photo_try=0;boolean success=false;Serial.print("Taking photo...");#ifndef BLOCK_SERIALtft_clear();tft.println("Taking photo...");#endifdelay(1000);camera_fb_t * fb=nullptr;fb = esp_camera_fb_get();if (!fb) Serial.println("Fail?\nTry rebooting!");else {Serial.println();char *path=sd_build_file_name(photo_try);#ifdef BLOCK_SERIALfs::FS &fs = SD;File file = fs.open(path, FILE_WRITE); // will overwrite any existing file!!if (file) {file.write(fb->buf, fb->len);photo_try++; photo_next=photo_try; // can give "photo_count_max" and return this to calling sub!success=true;}file.close();#elsesuccess=true;#endifuint16_t w=0, h=0;TJpgDec.getJpgSize(&w, &h, fb->buf, fb->len);TJpgDec.drawJpg(0, 0, fb->buf, fb->len); // Display photo#if (tft_text_row==0)delay(5000); // bodge#endifif (success) tft_text();#ifdef BLOCK_SERIAL // ensure following photo is deleted (so on re-start we know where to start)!Serial.print(path+1);Serial.print("->");if (success) {Serial.println("Saved"); char *path=sd_build_file_name(photo_next); fs.remove(path);} else Serial.println("Fail");#elsetft.print(path+1);tft.println("->No Save");#endif}delay(5000);return photo_next;}
A beautiful 3.5” touchscreen display, based on ESP32-WROVER, with a built-in 2M pixel OV2640 camera, which makes it an ever perfect platform for your ESP32 projects.
Makerfabs ESP32 3.5” Touch with camera is absolutely open for makers, and besides, Makerfabs provide plenty of Demos to help the users on the usage. Have a try at this fantastic display in your next ESP32 project!~
This board includes an integrated ST-LINK/V2 debugger via Mini-B USB connector, 8 MB SDRAM (IS42S16400J), 2.4-inch 320x200 TFT LCD color display (SF-TC240T), touchscreen controller (STMPE811), gyroscope (L3GD20), 2 user LEDs, user button, reset button, Full-Speed USB OTG to second Micro-AB USB connector, and two 32x2 male pin headers.
A prototyping environment for a variety of STM32 variants, which allows users to create their applications using an application programming interface (API) to implement device peripherals and a range of evaluation features on the EvoPrimer base including TFT color touchscreen, graphical user interface, joy stick, codec-based audio, SD card, IrDA and standard peripherals such as USB, USART, SPI, I2C, CAN, etc.
Ms.Josey 
Ms.Josey