Horloge numérique ESP32 NTP : fuseau horaire et heure d’été

Dans ce didacticiel, vous allez créer une horloge numérique ESP32 connectée à Internet que vous pourrez régler en fonction de votre fuseau horaire et qui gère automatiquement l’heure d’été. L’ESP32 obtient l’heure actuelle d’un serveur NTP et l’affiche sur un écran LED TM1637 à 4 chiffres et 7 segments, similaire aux horloges numériques classiques. L’ESP32 sera programmé à l’aide de l’IDE Arduino.

Il s’agit d’un excellent didacticiel pour en savoir plus sur l’affichage à 7 segments TM1637 et sur l’obtention de l’heure à partir d’un serveur NTP. Pour des didacticiels approfondis sur ces sujets, consultez les articles suivants :

Conditions préalables

Avant de continuer, assurez-vous que l’IDE Arduino et les cartes ESP32 sont installés. Suivez le tutoriel suivant si ce n’est pas déjà fait :

Aperçu du projet

Dans ce didacticiel, nous obtiendrons l’heure du serveur NTP et l’afficherons sur l’écran TM1637 à 4 chiffres et 7 segments.

Affichage 7 segments LED à 4 chiffres TM1637

L’affichage LED à 4 chiffres et 7 segments TM1637 est un module d’affichage qui combine quatre chiffres à 7 segments dans un seul affichage qui peut être contrôlé via le pilote TM1637. Le module particulier que nous utilisons ici comporte quatre chiffres séparés par deux points entre le deuxième et le troisième chiffre. Cette disposition est idéale pour créer une horloge numérique, avec l’heure d’un côté des deux points et les minutes de l’autre.

NTP (Protocole de temps réseau)

Nous obtiendrons l’heure de votre fuseau horaire à l’aide du protocole NTP (network time protocol) avec ajustement à l’heure d’été.

NTP signifie Network Time Protocol, et il s’agit d’un protocole réseau pour la synchronisation d’horloge entre les systèmes informatiques. En d’autres termes, il est utilisé pour synchroniser les heures d’horloge des ordinateurs dans un réseau.

Il existe des serveurs NTP comme pool.ntp.org que n’importe qui peut utiliser pour demander du temps en tant que client. Dans ce cas, l’ESP32 est un client NTP qui demande l’heure à un serveur NTP (pool.ntp.org).

Pour en savoir plus sur l’obtention de temps avec l’ESP32, vous pouvez lire les guides suivants :

Disposition du projet

Voici un bref aperçu des étapes que nous devons suivre pour créer ce projet :

1. Initialisez l’affichage.
2. Initialisez le Wi-Fi et connectez l’ESP32 à votre réseau local afin qu’il puisse obtenir des données d’Internet.
3. Initialisez l’heure pour votre fuseau horaire spécifié (prend en compte l’heure d’été).
4. Affichez l’heure à l’écran (faites clignoter les deux points entre les chiffres toutes les secondes).
5. Toutes les heures, connectez-vous au serveur NTP pour resynchroniser la minuterie afin d’éviter toute dérive de l’horloge interne de l’ESP32.

Pièces requises

Pour ce projet, vous avez besoin des pièces suivantes :

Vous pouvez utiliser les liens précédents ou vous rendre directement sur MakerAdvisor.com/tools pour trouver toutes les pièces pour vos projets au meilleur prix !

Câblage de l’afficheur 7 segments à 4 chiffres TM1637 à l’ESP32

Le câblage de l’écran à l’ESP32 est assez simple, car il ne nécessite que deux broches numériques : CLK et DI/O.

* vous pouvez utiliser n’importe quel autre GPIO approprié. Consultez le guide de brochage ESP32 :

Nous connecterons la broche CLK au GPIO 19 et la broche DIO au GPIO 18, mais vous pouvez utiliser une combinaison différente de broches.

Installation de la bibliothèque TM1637

Il existe plusieurs bibliothèques pour interfacer l’écran TM1637 avec l’ESP32. Nous utiliserons la bibliothèque TM1637.h d’avishorp (même si elle n’a pas été mise à jour depuis plusieurs années, elle fonctionne toujours bien et est très simple à utiliser).

Vous pouvez installer la bibliothèque via le gestionnaire de bibliothèque Arduino IDE. Recherchez TM1637 et installez la bibliothèque par avishorp.

Code – ESP32 avec horloge numérique TM1637

Vous pouvez télécharger le code suivant sur votre carte ESP32. Vous devez:

/*
  Rui Santos & Sara Santos - Raspberryme.com
  Complete project details at https://Raspberryme.com/esp32-tm1637-4-digit-7-segment-display-arduino/
  Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files.
  The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
*/
#include 
#include "time.h"
#include 

// Replace with your network credentials
const char* ssid     = "REPLACE_WITH_YOUR_SSID";
const char* password = "REPLACE_WITH_YOUR_PASSWORD";

// TM1637 pins
#define CLK 19
#define DIO 18

TM1637Display display(CLK, DIO);

// Timezone (Lisbon / Portugal)
// Change if needed - See list of timezones strings: https://github.com/nayarsystems/posix_tz_db/blob/master/zones.csv
const char* TZ_INFO = "WET0WEST,M3.5.0/1,M10.5.0";

// Init Wifi
void initWiFi() {
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.println("Connecting to WiFi..");
  }
}

// Initialize Time with the specified timezone
void initTime() {
  configTime(0, 0, "pool.ntp.org");
  setenv("TZ", TZ_INFO, 1);
  tzset();
}

// display the time on the screen
void displayTime() {

  // blinking colon
  static bool colon = false;
  colon = !colon;

  // get the current time
  struct tm timeinfo;
  if (!getLocalTime(&timeinfo)) {
    return;
  }

  int hours   = timeinfo.tm_hour;   // get hours (0–23)
  int minutes = timeinfo.tm_min;    // get minutes (0–59)

  // move hours to the left two digits
  int hourPart = hours * 100;

  // combine hours and minutes into HHMM
  int value = hourPart + minutes;

  // control the colon (for blinking colon)
  uint8_t colonMask;
  if (colon == true) {
    colonMask = 0b01000000;   // turn colon ON
  } else {
    colonMask = 0;            // turn colon OFF
  }

  display.showNumberDecEx(
    value,
    colonMask,   // blink colon
    true         // leading zeros
  );
}

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

  display.setBrightness(7);
  display.clear();

  initWiFi();
  initTime();
}

void loop() {
  displayTime();
  delay(1000);
}

Afficher le code brut

Comment fonctionne le code ?

Jetons un coup d’œil rapide au code pour voir comment il fonctionne.

Inclure les bibliothèques

Commencez par inclure les bibliothèques requises.

#include 
#include "time.h"
#include 

Informations d’identification réseau

Insérez vos informations d’identification réseau sur les lignes suivantes.

// Replace with your network credentials
const char* ssid     = "REPLACE_WITH_YOUR_SSID";
const char* password = "REPLACE_WITH_YOUR_PASSWORD";

Poignée de minuterie FreeRTOS

Nous créons un handle pour le timer FreeRTOS que nous allons créer dans le code. Cette minuterie appellera périodiquement une fonction de rappel toutes les heures (SYNC_INTERVAL) qui fera une nouvelle requête au serveur NTP pour obtenir l’heure.

// Resync clock
TimerHandle_t syncTimer = NULL;
const unsigned long SYNC_INTERVAL = 3600000UL;   // 1 hour (3600000 ms)

Pour en savoir plus sur les minuteries FreeRTOS, consultez ce didacticiel : ESP32 avec FreeRTOS : Minuteries logicielles/Interruptions de minuterie (IDE Arduino).

Initialiser l’affichage

Définissez les broches TM1637 et créez une instance pour l’affichage appelée display.

// TM1637 pins
#define CLK 19
#define DIO 18

TM1637Display display(CLK, DIO);

Fuseau horaire

Insérez votre chaîne de fuseau horaire dans la ligne suivante. Vous pouvez trouver une liste de chaînes de fuseau horaire. Dans mon cas, mon fuseau horaire est Lisbonne/Portugal, il ressemblera donc à ceci :

const char* TZ_INFO = "WET0WEST,M3.5.0/1,M10.5.0";

Initialiser le Wi-Fi

La fonction suivante initialise le Wi-Fi et connecte l’ESP32 à votre réseau local. Ceci sera appelé plus tard dans setup().

// Init Wifi
void initWiFi() {
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.println("Connecting to WiFi..");
  }
}

Vous pouvez en savoir plus sur la fonction Wi-Fi de l’ESP32 dans le tutoriel suivant :

Initialiser l’heure

La fonction initTime() initialise l’heure NTP et l’ajuste à votre fuseau horaire (remarquez les fonctions setenv() et tzset()).

// Initialize Time with the specified timezone
void initTime() {
  configTime(0, 0, "pool.ntp.org");
  setenv("TZ", TZ_INFO, 1);
  tzset();
}

Pour en savoir plus sur l’obtention de la date et de l’heure avec le réglage du fuseau horaire, consultez ce didacticiel :

La fonction displayTime() affichera la date et l’heure à l’écran.

void displayTime() {

Nous avons une variable booléenne appelée côlon pour déterminer si le côlon apparaît ou non (pour créer l’effet clignotant).

// blinking colon
static bool colon = false;
colon = !colon;

Nous obtenons l’heure actuelle et la sauvegardons dans la structure timeinfo.

// get the current time
struct tm timeinfo;
if (!getLocalTime(&timeinfo)) {
  return;
}

Ensuite, nous pouvons obtenir l’heure et les minutes comme suit :

int hours   = timeinfo.tm_hour;   // get hours (0–23)
int minutes = timeinfo.tm_min;    // get minutes (0–59)

Maintenant, pour afficher les chiffres à l’écran, nous devons combiner la date et l’heure en un seul nombre à quatre chiffres qui seront divisés au milieu par les deux points.

Nous pouvons le faire en multipliant l’heure par 100, puis en ajoutant les minutes.

// move hours to the left two digits
int hourPart = hours * 100;

// combine hours and minutes into HHMM
int value = hourPart + minutes;

Par exemple, imaginez que l’heure soit 12h et les minutes 30. Nous voulons obtenir 12h30. Nous devons donc obtenir le numéro 1230 et afficher les deux points au milieu.

12*100+30 donnera le 1230 souhaité. Ce nombre est enregistré dans la variable de valeur.

Enfin, nous ajustons le masque de bits pour afficher les deux points selon qu’il est temps ou non d’afficher les deux points.

// control the colon (for blinking colon)
uint8_t colonMask;
if (colon == true) {
  colonMask = 0b01000000;   // turn colon ON
} else {
  colonMask = 0;            // turn colon OFF
}

Nous pouvons utiliser showNumberDecEx() pour afficher l’heure à l’écran. Passez en argument la valeur, le masque de bits pour les deux points et si nous avons des zéros non significatifs.

display.showNumberDecEx(
  value,
  colonMask,   // blink colon
  true         // leading zeros
);

Maintenant que nous avons déclaré toutes les fonctions essentielles, il est facile de configurer notre code.

syncTimeCallback()

La fonction syncTimeCallback() sera appelée par le timer FreeRTOS toutes les heures. Cette fonction appelle simplement la fonction initTime() que nous avons créée précédemment pour resynchroniser l’heure avec le serveur NTP. Cela empêche l’heure de dériver de l’horloge interne de l’ESP32.

void syncTimeCallback(TimerHandle_t xTimer) {
  Serial.println("Resyncing time with NTP...");
  initTime();
}

installation()

Dans setup(), initialisez le moniteur série, réglez la luminosité de l’écran, initialisez le Wi-Fi et l’heure.

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

  display.setBrightness(7);
  display.clear();

  initWiFi();
  initTime();

Toujours dans setup(), nous créons le timer FreeRTOS et le démarrons avec xTimerStart().

//Create timer to sync time periodically
syncTimer = xTimerCreate(
  "syncTimer",                   // Timer name
  pdMS_TO_TICKS(SYNC_INTERVAL),  // Period in ticks
  pdTRUE,                         // Auto-reload (periodic timer)
  NULL,                           // Timer ID
  syncTimeCallback                   // Callback function
);
if (syncTimer == NULL) {
  Serial.println("Failed to create timer!");
  while (1);
}

xTimerStart(syncTimer, 0); // Start timer immediately

Encore une fois, pour en savoir plus sur les minuteries FreeRTOS, vous pouvez consulter ce tutoriel.

boucle()

Enfin, dans la boucle(), il suffit d’appeler la fonction displayTime() pour afficher l’heure sur le module d’affichage à 4 chiffres et 7 segments.

void loop() {
  displayTime();
  delay(1000);
}

Démonstration

Après avoir inséré vos informations d’identification réseau et vos informations de fuseau horaire, vous pouvez télécharger le code sur l’ESP32.

Il devrait commencer à afficher l’heure actuelle de votre fuseau horaire.

Les deux points devraient clignoter toutes les secondes pour ressembler à ces vieilles horloges numériques. De plus, toutes les heures, l’ESP32 doit se reconnecter au serveur NTP pour demander et synchroniser l’heure.

Conclusion

Dans ce didacticiel, vous avez appris à créer une horloge numérique Internet avec l’ESP32 et l’affichage à 7 segments TM1637. Ce didacticiel peut facilement être ajusté pour utiliser un écran différent, comme un écran OLED, LCD ou même TFT.

Projets similaires :

Apprenez-en plus sur l’ESP32 avec nos ressources :

Cette vidéo vous emmène dans l’histoire de Raspberry Pi :