Arduino BiJin ToKei




Introduction: Arduino BiJin ToKei

About: Make it yourself if you cannot buy one!

This instructables show how to use Arduino IDE, ESP32 dev board and ILI9341 LCD to built a photo clock.

Step 1: What Is BiJin ToKei?

Recap from my previous intructables, ESP32 Photo Clock:

BiJin ToKei(美人時計)start from 2009, they find various beauty hold a time board report time every minute. BiJin ToKei provide web application and mobile app version. After these years, you can find many variant on the web now.

Step 2: Arduino Version

My previous intructables, ESP32 Photo Clock, works fine. However, the program is built on ESP-IDF. This is a big barrier for the beginner. Since Aruino-esp32 framework is very maturer now, implement a photo clock on Arduino IDE become much easier.

Step 3: Preparation

ESP32 Dev Board

Any ESP32 dev board should be ok.

Stacking Header

A 8-pins stacking female header. Bending the long header wire can help to adjust the viewing angle of the LCD.


A 400 tie points breadboard.

Breadboard Wire

Some breadboard jump wire.

LCD Display

This time I am using a 2.8 inches ILI9341 LCD. This program using Arduino_GFX library, so most common SPI LCD Display should be ok.

Arduino_GFX currently support:

  • HX8352C 240x400
  • HX8357B 320x480
  • ILI9225 176x220
  • ILI9341 240x320
  • ILI9341 M5Stack 320x240
  • ILI9486 320x480 (18 bit color)
  • SEPS525 160x128
  • SSD1331 96x64
  • SSD1351 128x128
  • SSD1351 128x96
  • ST7735 128x128 (various tabs)
  • ST7735 128x160 (various tabs)
  • ST7735 80x160
  • ST7789 240x135
  • ST7789 240x240
  • ST7789 TTGO T-Watch 240x240
  • ST7789 240x320

Step 4: Plug ESP32 Dev Board on Breadboard

Step 5: Bend Stacking Header & Plug on LCD

Step 6: Plug LCD on Breadboard

Step 7: Connection

Use Breadboard jump wire connect LCD and ESP32 dev board together.

Here are the connection summary:

LCD   -> ESP32
===      =====
Vcc   -> 5V pin (or 3.3V pin depends on your LCD display)
GND   -> GND
CS    -> GPIO 5
D/C   -> GPIO 16
MOSI  -> GPIO 23
SCK   -> GPIO 18
LED   -> GPIO 22 (Optional, some LCD require direct plug LED pin to 3.3V pin to make it brighter)

Step 8: Software Preparation

Arduino IDE

Download and install Arduino IDE if not yet:

Arduino ESP32 Support

Please follow Installation Instructions at GitHub:

Arduino GFX library

Add Arduino_GFX library to Arduino IDE:

If you are not familiar add library from GitHub, simply press the green "Clone or download" button and then "Download ZIP". And then in Arduino IDE, select Sketch menu -> Include Library -> Add .ZIP Library... -> select downloaded ZIP file.

Arduino BiJin ToKei Source Code

Download the source code from GitHub:

Step 9: How It Works?

Here are the program workflow:


    • Initial LCD, you may change the pins and driver to fit for your display
    Arduino_HWSPI *bus = new Arduino_HWSPI(16 /* DC */, 5 /* CS */, 18 /* SCK */, 23 /* MOSI */, -1 /* MISO */);
    Arduino_ILI9341 *tft = new Arduino_ILI9341(bus, 17 /* RST */, TFT_ROTATION);
    • Connect WiFi, remember fill your WiFi AP settings
    #define SSID_NAME "YourAP"
    #define SSID_PASSWORD "YourPassword"
    • Connect NTP server to get the current time, you may change your local NTP server and timezone settings
    const char* ntpServer = "";
    #define GMT_OFFSET_SEC 28800L // Timezone +0800
    #define DAYLIGHT_OFFSET_SEC 0L // no daylight saving


    • If minute changed, make a HTTP request to a predefined URL in URL.h. There are many URL in the ToKei list, please read the comments in URL.h for more details.
    #define TFT_ROTATION 0 // portrait
    #define URL ""
    • Get the HTTP response JPEG stream and feed to the esp_jpg_decode
    • esp_jpg_decode feed the decoded image block to LCD draw function

    Step 10: Program

    Open ArduinoBiJinToKei.ino in Arduino IDE, compile and upload the program to ESP32 dev board.

    Step 11: Happy Time!

    It's time to put the Arduino BiJin ToKei on your desktop and show off what you have done. Enjoy!

    3 People Made This Project!


    • Make It Bridge

      Make It Bridge
    • Big and Small Contest

      Big and Small Contest
    • For the Home Contest

      For the Home Contest



    1 year ago

    It is your code. Yes, on a T-Gallery. Look in your code. If you don't get the file, you reboot! That's not what is desired. If you don't get a picture, put up digital time DON'T REBOOT! It is IN THE CODE!! I don't know what display and connection you want but it is your code. Look at it. I frequently don't get a picture and it reboots over and over until I turn it off.

    It is that simple! Also, code should be added to write the downloaded picture to SD to use tomorrow. Don't re-fetch it every day, forever! I tried, for a little while, to decide now to do that but did not make it yet. Will look again some day. Other projects going on, too.

    Is this what you want? Little to no change from your project code!

    /* WiFi settings */
    #define SSID_NAME "LaoagMikey"
    #define SSID_PASSWORD "PCCRules"

    /* NTP server settings */
    const char *ntpServer = "";
    // const char* ntpServer = ""; // local AP NTP server
    #define GMT_OFFSET_SEC 28800L // Timezone +0800
    #define DAYLIGHT_OFFSET_SEC 0L // no daylight saving

    // WDT, enable auto restart from unexpected hang, it may caused by JPEG decode
    #define ENABLE_WDT

    // select preferred BiJinToKei here
    #include "URL.h"

    #include <time.h>
    #include <WiFi.h>
    #include <esp_jpg_decode.h>
    #include <esp_task_wdt.h>
    #include <SPI.h>
    #include <HTTPClient.h>

    /* display settings */
    #include <Arduino_GFX_Library.h>
    //Next line for T14 T-Gallery
    Arduino_HWSPI *bus = new Arduino_HWSPI(23 /* DC */, 5 /* CS */, 18 /* SCK */, 19 /* MOSI */, -1 /* MISO */);
    // Arduino_HWSPI *bus = new Arduino_HWSPI(16 /* DC */, 5 /* CS */, 18 /* SCK */, 23 /* MOSI */, -1 /* MISO */);
    // Arduino_DataBus *bus = new Arduino_ESP32SPI(27 /* DC */, 5 /* CS */, 18 /* SCK */, 23 /* MOSI */, 19 /* MISO */);
    // Arduino_DataBus *bus = new Arduino_ESP32SPI(-1 /* DC */, 5 /* CS */, 18 /* SCK */, 23 /* MOSI */, -1 /* MISO */);
    // Arduino_HX8347C *tft = new Arduino_HX8347C(bus, 17, TFT_ROTATION, true /* IPS */);
    // Arduino_HX8357B *tft = new Arduino_HX8357B(bus, 17, TFT_ROTATION, true /* IPS */);
    // Arduino_ILI9341 *tft = new Arduino_ILI9341(bus, 17 /* RST */, TFT_ROTATION);
    // Arduino_ILI9481 *tft = new Arduino_ILI9481(bus, 33 /* RST */, TFT_ROTATION);
    // Arduino_ILI9486 *tft = new Arduino_ILI9486(bus, 17 /* RST */, TFT_ROTATION);
    Arduino_ST7789 *tft = new Arduino_ST7789(bus, 33 /* RST */, TFT_ROTATION, true /* IPS */);
    // Arduino_ST7796 *tft = new Arduino_ST7796(bus, 33 /* RST */, TFT_ROTATION, false /* IPS */);
    #define TFT_BL 22

    static int len, offset;
    static int8_t last_show_minute = -1;
    static struct tm timeinfo;
    static char url[1024];

    HTTPClient http;


    Reply 9 months ago

    I was able to do it, I only changed what was necessary for my 4-inch screen, the google photo clock still resists. Thank you!!


    Reply 1 year ago

    don't forget to replace all references to "gfx" in the code with "tft" :)


    Reply 1 year ago

    I try to get this code running on a LilyGO TTGO T-Display V1.1 ESP32. After the call to "esp_jpg_decode" it throws an error "Task watchdog got triggered" and it reboots.

    Any ideas why?


    Reply 1 year ago

    "esp_jpg_decode" now completes succesfully most often with an occasional error "Task watchdog got triggered" + reboot.

    But my screen remains dark. Note that it does work with other projects.


    Reply 1 year ago

    I never have a T-Gallery, so I don't know what's going wrong with it.
    At the same time, I found you have many good idea. I believe you are a good maker too. I encourage you go ahead to enhance it base on my sample code and re-share what you have done in Instructables ;>


    Question 1 year ago on Step 10

    I have this running. It is very flimsy. If the picture does not come down, it reboots. I need to reverse the RGB colors. How can I do that. I have traced through this and find the stream going along but don't know where to find the place to reverse the RGB565 colors.


    Answer 1 year ago

    Can you show your display and connection?


    Reply 1 year ago

    It is a standard TTGO T-Gallery with built-on display backpack with standard pins.


    Reply 1 year ago

    ok, then can you show the declaration code?