Dot Matrix Clock With NTP Server Using ESP32

Let's turn your conventional clock to IoT.

Introduction

The problem that most of us face when dealing with the conventional wall clock is, the time will start shifting after it runs for a certain period of time. When that happens, you will start to refer to your smartphone clock to get the exact time. So in this tutorial, I will share with you how to create a dot matrix clock and get time from the NTP server using the ESP32 board.

Video

This video will show you how to create dot matrix clock and get time and date from NTP (Network Time Protocol) server using ESP32 board.

Hardware Preparation

This is the list of items used in the video.

Sample Program

This is a sample program to get time from the NTP server and display clock at the dot matrix. Before that, you need to install 3 libraries:

  1. MD_MAX72XX by majicDesigns Version 3.2.1 (Library Manager)
  2. MD_Parola by majicDesigns Version 3.3.0 (Library Manager)
  3. NTPClient by Fabrice Weinberg Version 3.1.0 (ZIP file)
/*
Project: Dot matrix clock with NTP server using ESP32
Board: ESP32 Dev Module (Node32 Lite)
Connections:
ESP32 | Dot Matrix
RAW – VCC
GND – GND
27 – DIN
26 – CS
25 – CLK
External libraries:
– MD_MAX72XX by majicDesigns Version 3.2.1 (Manager)
– MD_Parola by majicDesigns Version 3.3.0 (Manager)
– NTPClient by Fabrice Weinberg Version 3.1.0 (Zip)
https://github.com/taranais/NTPClient/archive/master.zip
*/
#include <WiFi.h>
#include <WiFiClient.h>
const char ssid[] = "Your WiFi SSID"; // WiFi name
const char password[] = "Your WiFi Password"; // WiFi password
#include <NTPClient.h>
#include <WiFiUdp.h>
WiFiUDP ntpUDP;
NTPClient timeClient(ntpUDP);
#include <MD_Parola.h>
#include <MD_MAX72xx.h>
#include <SPI.h>
//#define HARDWARE_TYPE MD_MAX72XX::FC16_HW
#define HARDWARE_TYPE MD_MAX72XX::ICSTATION_HW
#define MAX_DEVICES 4
#define CLK_PIN 25 // 18 or 25
#define DATA_PIN 27 // 16 or 27
#define CS_PIN 26 // 17 or 26
MD_Parola DotMatrix = MD_Parola(HARDWARE_TYPE, DATA_PIN, CLK_PIN, CS_PIN, MAX_DEVICES);
uint8_t scrollSpeed = 50; // default frame delay value
textEffect_t scrollEffect = PA_SCROLL_LEFT;
textPosition_t scrollAlign = PA_LEFT;
uint16_t scrollPause = 3000; // in milliseconds
long currentMillis = 0;
long previousMillis = 0;
int interval = 1000;
String formattedDate;
String timeStamp, hour, minute, second;
String dateStamp, year, month, date;
char dateBuffer[] = "";
String monthArray[12] = {
" Jan ", " Feb ", " Mar ", " Apr ", " May ", " Jun ",
" Jul ", " Aug ", " Sep ", " Oct ", " Nov ", " Dec "
};
enum {TIME, DATE};
boolean displayMode = TIME;
void setup()
{
Serial.begin(115200);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.println("");
Serial.println("WiFi connected.");
Serial.println("IP address: ");
Serial.println(WiFi.localIP());
DotMatrix.begin();
DotMatrix.setIntensity(0);
timeClient.begin();
timeClient.setTimeOffset(28800); // Set offset time in seconds, GMT+8 = 28800
DotMatrix.displayText("NTP Clock by Idris", scrollAlign, scrollSpeed, scrollPause, scrollEffect, scrollEffect);
displayMode = DATE;
}
void loop()
{
while (!timeClient.update()) {
timeClient.forceUpdate();
}
if (displayMode == DATE && DotMatrix.displayAnimate()) {
DotMatrix.displayReset();
displayMode = TIME;
}
currentMillis = millis();
if (currentMillis – previousMillis > interval &&
displayMode == TIME) {
previousMillis = millis();
// The formattedDate comes with the following format:
// 2018-05-28T16:00:13Z
formattedDate = timeClient.getFormattedDate();
Serial.println(formattedDate);
// Extract date
year = formattedDate.substring(0, 4);
month = formattedDate.substring(5, 7);
month = monthArray[month.toInt() – 1];
date = formattedDate.substring(8, 10);
date = String(date.toInt());
dateStamp = year + ", " + date + month;
dateStamp.toCharArray(dateBuffer, dateStamp.length()+1);
// Extract time
hour = formattedDate.substring(11, 13);
minute = formattedDate.substring(14, 16);
second = formattedDate.substring(17, 19);
if (hour.toInt() == 0) {
hour = String(hour.toInt() + 12);
}
else if (hour.toInt() < 13) {
hour = String(hour.toInt());
}
else {
hour = String(hour.toInt() – 12);
}
if (second.toInt() == 0) {
displayMode = DATE;
DotMatrix.displayClear();
DotMatrix.displayText(dateBuffer, scrollAlign, scrollSpeed, scrollPause, scrollEffect, scrollEffect);
return;
}
else if (second.toInt() % 2) {
timeStamp = hour + ":" + minute;
}
else {
timeStamp = hour + " " + minute;
}
DotMatrix.setTextAlignment(PA_CENTER);
DotMatrix.print(timeStamp);
}
}

view raw
ESP32NTPClock.ino
hosted with ❤ by GitHub

Thank You

References:

  1. Displaying on MAX7219 Dot Matrix Using Arduino
  2. Getting Date and Time with ESP32 on Arduino IDE (NTP Client)
  3. ESP32 Pinout References

Thanks for reading this tutorial. If you have any technical inquiries, please post at Cytron Technical Forum.

3 thoughts on “Dot Matrix Clock With NTP Server Using ESP32”

  1. Okay it works now. Here you go. For reference. Sorry, I just learned Arduino yesterday. So total newbie.

    /*
    Project: Dot matrix clock with NTP server using ESP32
    Board: ESP32 Dev Module (Node32 Lite)

    Connections:
    ESP32 | Dot Matrix
    RAW – VCC
    GND – GND
    27 – DIN
    26 – CS
    25 – CLK

    External libraries:
    – MD_MAX72XX by majicDesigns Version 3.2.1 (Manager)
    – MD_Parola by majicDesigns Version 3.3.0 (Manager)
    – NTPClient by Fabrice Weinberg Version 3.1.0 (Zip)
    https://github.com/taranais/NTPClient/archive/master.zip
    */

    #include
    #include
    const char ssid[] = “wifi name”; // WiFi name
    const char password[] = “password”; // WiFi password

    #include
    #include
    WiFiUDP ntpUDP;
    NTPClient timeClient(ntpUDP);

    #include
    #include
    #include

    //#define HARDWARE_TYPE MD_MAX72XX::FC16_HW
    #define HARDWARE_TYPE MD_MAX72XX::FC16_HW
    #define MAX_DEVICES 4
    #define CLK_PIN 25 // 18 or 25
    #define DATA_PIN 27 // 16 or 27
    #define CS_PIN 26 // 17 or 26

    MD_Parola DotMatrix = MD_Parola(HARDWARE_TYPE, DATA_PIN, CLK_PIN, CS_PIN, MAX_DEVICES);

    uint8_t scrollSpeed = 50; // default frame delay value
    textEffect_t scrollEffect = PA_SCROLL_LEFT;
    textPosition_t scrollAlign = PA_LEFT;
    uint16_t scrollPause = 3000; // in milliseconds

    long currentMillis = 0;
    long previousMillis = 0;
    int interval = 1000;
    String formattedDate;
    String timeStamp, hour, minute, second;
    String dateStamp, year, month, date;
    char dateBuffer[] = “”;
    String monthArray[12] = {
    ” Jan “, ” Feb “, ” Mar “, ” Apr “, ” May “, ” Jun “,
    ” Jul “, ” Aug “, ” Sep “, ” Oct “, ” Nov “, ” Dec ”
    };
    enum {TIME, DATE};
    boolean displayMode = TIME;

    void setup()
    {
    Serial.begin(115200);

    WiFi.begin(ssid, password);
    while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(“.”);
    }

    Serial.println(“”);
    Serial.println(“WiFi connected.”);
    Serial.println(“IP address: “);
    Serial.println(WiFi.localIP());

    DotMatrix.begin();
    DotMatrix.setIntensity(0);

    timeClient.begin();
    timeClient.setTimeOffset(28800); // Set offset time in seconds, GMT+8 = 28800

    DotMatrix.displayText(“NTP Clock by Idris”, scrollAlign, scrollSpeed, scrollPause, scrollEffect, scrollEffect);
    displayMode = DATE;
    }

    void loop()
    {
    while (!timeClient.update()) {
    timeClient.forceUpdate();
    }

    if (displayMode == DATE && DotMatrix.displayAnimate()) {
    DotMatrix.displayReset();
    displayMode = TIME;
    }

    currentMillis = millis();
    if (currentMillis – previousMillis > interval &&
    displayMode == TIME) {
    previousMillis = millis();

    // The formattedDate comes with the following format:
    // 2018-05-28T16:00:13Z
    formattedDate = timeClient.getFormattedDate();
    Serial.println(formattedDate);

    // Extract date
    year = formattedDate.substring(0, 4);
    month = formattedDate.substring(5, 7);
    month = monthArray[month.toInt() – 1];
    date = formattedDate.substring(8, 10);
    date = String(date.toInt());
    dateStamp = year + “, ” + date + month;
    dateStamp.toCharArray(dateBuffer, dateStamp.length()+1);

    // Extract time
    hour = formattedDate.substring(11, 13);
    minute = formattedDate.substring(14, 16);
    second = formattedDate.substring(17, 19);

    if (hour.toInt() == 0) {
    hour = String(hour.toInt() + 12);
    }
    else if (hour.toInt() < 13) {
    hour = String(hour.toInt());
    }
    else {
    hour = String(hour.toInt() – 12);
    }

    if (second.toInt() == 0) {
    displayMode = DATE;
    DotMatrix.displayClear();
    DotMatrix.displayText(dateBuffer, scrollAlign, scrollSpeed, scrollPause, scrollEffect, scrollEffect);
    return;
    }
    else if (second.toInt() % 2) {
    timeStamp = hour + ":" + minute;
    }
    else {
    timeStamp = hour + " " + minute;
    }

    DotMatrix.setTextAlignment(PA_CENTER);
    DotMatrix.print(timeStamp);
    }
    }

  2. This is the error..log I suppose.

    =====================================================================================

    Arduino: 1.8.13 (Windows 10), Board: “ESP32 Dev Module, Disabled, Default 4MB with spiffs (1.2MB APP/1.5MB SPIFFS), 240MHz (WiFi/BT), QIO, 80MHz, 4MB (32Mb), 921600, None”

    ESP32-ntpclock-dotmatrix-test1:99:3: error: stray ‘\342’ in program

    if (currentMillis – previousMillis > interval &&

    ^

    ESP32-ntpclock-dotmatrix-test1:99:3: error: stray ‘\200’ in program

    ESP32-ntpclock-dotmatrix-test1:99:3: error: stray ‘\223’ in program

    ESP32-ntpclock-dotmatrix-test1:111:5: error: stray ‘\342’ in program

    month = monthArray[month.toInt() – 1];

    ^

    ESP32-ntpclock-dotmatrix-test1:111:5: error: stray ‘\200’ in program

    ESP32-ntpclock-dotmatrix-test1:111:5: error: stray ‘\223’ in program

    ESP32-ntpclock-dotmatrix-test1:129:7: error: stray ‘\342’ in program

    hour = String(hour.toInt() – 12);

    ^

    ESP32-ntpclock-dotmatrix-test1:129:7: error: stray ‘\200’ in program

    ESP32-ntpclock-dotmatrix-test1:129:7: error: stray ‘\223’ in program

    C:\Users\LemonKicker\Documents\Arduino\ESP32-ntpclock-dotmatrix-test1\ESP32-ntpclock-dotmatrix-test1.ino: In function ‘void loop()’:

    ESP32-ntpclock-dotmatrix-test1:99:25: error: expected ‘)’ before ‘previousMillis’

    if (currentMillis – previousMillis > interval &&

    ^

    ESP32-ntpclock-dotmatrix-test1:105:32: error: ‘class NTPClient’ has no member named ‘getFormattedDate’

    formattedDate = timeClient.getFormattedDate();

    ^

    ESP32-ntpclock-dotmatrix-test1:111:42: error: expected ‘]’ before numeric constant

    month = monthArray[month.toInt() – 1];

    ^

    ESP32-ntpclock-dotmatrix-test1:111:42: error: expected ‘;’ before numeric constant

    ESP32-ntpclock-dotmatrix-test1:129:20: error: expected primary-expression before ‘(‘ token

    hour = String(hour.toInt() – 12);

    ^

    ESP32-ntpclock-dotmatrix-test1:129:38: error: expected ‘)’ before numeric constant

    hour = String(hour.toInt() – 12);

    ^

    Multiple libraries were found for “WiFi.h”

    Used: C:\Users\LemonKicker\AppData\Local\Arduino15\packages\esp32\hardware\esp32\1.0.4\libraries\WiFi

    Not used: C:\Program Files (x86)\Arduino\libraries\WiFi

    Multiple libraries were found for “NTPClient.h”

    Used: C:\Users\LemonKicker\Documents\Arduino\libraries\NTPClient

    Not used: C:\Users\LemonKicker\Documents\Arduino\libraries\NTPClient-master

    exit status 1

    stray ‘\342’ in program

    This report would have more information with
    “Show verbose output during compilation”
    option enabled in File -> Preferences.

  3. I got an error on line 129. Can somebody please help me by telling whats wrong with that line?

    hour = String(hour.toInt() – 12);

Leave a Comment

Your email address will not be published.

Share this Tutorial

Share on facebook
Share on whatsapp
Share on email
Share on print
Share on twitter
Share on pinterest
Share on facebook
Share on whatsapp
Share on email
Share on print
Share on twitter
Share on pinterest

Latest Tutorial

Simple Alarm System Using Maker Nano
Program Cucumber ESP32-S2 Using CircuitPython
Face Recognition Using OpenCV on Raspberry Pi 400
Turned Your Tablet as a Display for the Raspberry Pi 400
OpenCV Template Matching on Raspberry Pi 400
Scroll to Top