ESP32-S3 RGB LED-matriks Wi-Fi + NTP-tydklokprojek -1 Basiese klok

ESP32-S3 RGB LED-matriks Wi-Fi + NTP-tydklokprojek -1 Basiese klok

ESP32-S3 Internet-klok met 8×8 NeoMatrix (Wi-Fi + NTP-tyd)

Hierdie projek verander 'n ESP32-S3 en 'n 8×8 RGB NeoMatrix (NeoPixel/WS2812) in 'n klein internet-klok. Die ESP32 koppel aan Wi-Fi, sinkroniseer die plaaslike tyd vanaf 'n NTP-bediener, en rol dan die tyd as HH:MM oor die 8×8-skerm.

Hoe dit werk (hoë vlak)

1) ESP32-S3 koppel aan jou router met <WiFi.h>.
2) Dit sinkroniseer tyd vanaf 'n NTP-bediener met "time.h" en configTime().
3) Die tyd word as HH:MM geformateer en in 'n klein teksbuffer gestoor.
4) Die NeoMatrix vertoon die teks en rol dit oor die 8×8-paneel.

RGB-kleur

Die kloktekskleur word beheer met RGB (Rooi, Groen, Blou) waardes, waar elke kleurkanaal wissel van 0 tot 255 en verskillende kombinasies verskillende kleure op die NeoMatrix skep. Deur die color_RED, color_GREEN, en color_BLUE veranderlikes aan te pas, kan jy maklik die voorkoms van die klok na enige kleur wat jy wil aanpas. Om vinnig die presiese RGB-waardes vir 'n spesifieke kleur te vind, kan jy die aanlyn RGB-kleurkieser Kleurkieser gebruik.

Biblioteke gebruik

Hierdie insluitings vertel jou presies waarvan die skets afhanklik is:

#include <WiFi.h>
#include "time.h"
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>

Installeer Adafruit NeoMatrix met Arduino Library Manager. Dit sal ook vereiste afhanklikhede soos Adafruit GFX Library en Adafruit NeoPixel aantrek.

Belangrike gebruikersinstellings wat jy MOET wysig

1) Tekskleur (RGB)

Stel jou kloktekskleur met 0–255 waardes:

//stel die kleur van die skerm gemaak van Rooi, Groen en Blou
unsigned int color_RED = 17;
unsigned int color_GREEN = 43;
unsigned int color_BLUE = 171;

Hierdie waardes word hier gebruik:

matrix.setTextColor(matrix.Color(color_RED, color_GREEN, color_BLUE));

Let wel: As jy alle kleure op 0 (swart) stel, word die teks onsigbaar. Die skets sluit 'n veiligheidskontrole in:

// as die gebruiker alle kleure op 0 stel, sal die skerm afgeskakel word, so stel dit groen
if (color_RED == 0 && color_GREEN == 0 && color_BLUE == 0) {
  color_GREEN = 200;
}

Dit verseker dat die matriks nooit “dood” lyk as gevolg van 'n onsigbare kleurinstelling nie.

2) Wi-Fi SSID en wagwoord

Vervang hierdie met jou regte Wi-Fi-naam en wagwoord:

const char* WIFI_SSID     = "WiFi";
const char* WIFI_PASSWORD = "passW0rd";

Tydens opstart druk die ESP32 vorderingsstatus in Serial Monitor en verval na ongeveer 15 sekondes (30 herhalings × 500ms).

3) NTP-bediener

Die standaard NTP-bediener is:

const char* ntpServer = "pool.ntp.org";

Jy kan dit soos dit is hou. As jy ooit 'n plaaslike bediener wil gebruik, vervang die gasheernaam met jou voorkeur NTP-bediener.

4) Tydsone-afwyking en somertyd-afwyking

Hierdie twee instellings beheer plaaslike tyd:

// Toronto-agtig: UTC-5, plus 1 uur somertyd
const long  gmtOffset_sec      = -5 * 3600;  // -5 ure
const int   daylightOffset_sec = 3600;       // +1 uur vir somertyd

Hoe om dit te stel:

• gmtOffset_sec = (UTC-afwyking ure) × 3600. Voorbeeld: UTC-5 → -5*3600, UTC+2 → 2*3600.
• daylightOffset_sec = 0 as jy nie somertyd-aanpassing wil hê nie, of 3600 as jou streek tans somertyd waarneem (+1 uur).

Hierdie word hier toegepas:

configTime(gmtOffset_sec, daylightOffset_sec, ntpServer);

Skermkonfigurasie

Matriks-data-pen

Die data-pen word hier gedefinieer:

#define MATRIX_PIN 14

As jou bedrading 'n ander GPIO gebruik, verander hierdie nommer om te pas.

NeoMatrix-uitleg + kleurorde

Jou matriks word so geïnisialiseer:

Adafruit_NeoMatrix matrix(8, 8, MATRIX_PIN,
  NEO_MATRIX_TOP    + NEO_MATRIX_LEFT +
  NEO_MATRIX_ROWS   + NEO_MATRIX_PROGRESSIVE,
  NEO_RGB           + NEO_KHZ800);

Twee algemene redes waarom die skerm “verkeerd” lyk:

• Rotasie / bedradingsrigting: As teks onderstebo of gespieël verskyn, pas die NEO_MATRIX_* vlae aan (TOP/BOTTOM, LEFT/RIGHT, ROWS/COLUMNS, PROGRESSIVE/ZIGZAG).
• Kleurorde: Hierdie kode gebruik NEO_RGB. Sommige panele is NEO_GRB. As rooi/groen/blou nie ooreenstem nie, verander NEO_RGB na die korrekte volgorde.

Helderheid

Helderheid word in initMatrix() gestel:

matrix.setBrightness(40);

Verhoog vir 'n helderder skerm, verminder om hitte en kragverbruik te verlaag.

Hoe die tyd as HH:MM gegenereer word

Die klok stoor die geformateerde tyd in 'n 6-karakterbuffer:

char timeText[6] = "00:00";

Dan lees updateTimeText() die NTP-gesinkroniseerde plaaslike tyd en skryf die teks:

// Formaat HH:MM
snprintf(timeText, sizeof(timeText), "%02d:%02d",
         timeinfo.tm_hour,
         timeinfo.tm_min);

Dit word een keer per sekonde in die hoof lus opgedateer.

Hoe rol op 'n 8×8-skerm werk

'n 8×8-matriks is te smal om HH:MM gelyktydig te wys, so die skets rol die teks. Dit teken die tyd op 'n veranderlike X-posisie (scrollX), en beweeg dit dan een pixel links by elke opdatering.

int16_t scrollX = 8;
const uint16_t scrollIntervalMs = 120;

Elke rolstap:

matrix.fillScreen(0);
matrix.setCursor(scrollX, 0);
matrix.print(timeText);
matrix.show();
scrollX--;

Wanneer die teks heeltemal aan die linkerkant uitbeweeg, stel die kode dit terug om weer van die regterkant af te begin:

int16_t textWidth = 30;
if (scrollX < -textWidth) {
  scrollX = matrix.width();
}

Serial Monitor-uitset (ontfouting)

Hierdie skets druk nuttige boodskappe:

• Wi-Fi-verbindingsvordering en IP-adres
• Of tydsinkronisering geslaag het
• Die geformateerde tydstring (bv., Tydteks: 14:32)

As die skerm leeg is, is die Serial Monitor die eerste plek om te kyk om te bevestig dat Wi-Fi en NTP werk.

Projekdemonstrasie

Na oplaai en herstel:

• ESP32 koppel aan Wi-Fi
• Sinkroniseer tyd vanaf pool.ntp.org
• Wys OK kortliks op die matriks
• Rol die huidige tyd deurlopend as HH:MM

Aflaaie en skakels

Die volledige kode word hieronder in hierdie artikel verskaf. Onderdele, gereedskap en datablaaie word ook hieronder in hierdie artikel geskakel.

Beelde

ESP32 S3 Matrix

ESP32 S3 Matrix pin out

ESP32-S3_RGB_8x8_matrix-3

ESP32-S3_RGB_8x8_matrix1

ESP32-S3_RGB_8x8_matrix-2

ESP32-s3_internet_clock_animation

ESP32 S3 Matrix

ESP32 S3 Matrix pin out

ESP32-S3_RGB_8x8_matrix-3

ESP32-S3_RGB_8x8_matrix1

ESP32-S3_RGB_8x8_matrix-2

ESP32-s3_internet_clock_animation

/*
This is ESP32 sketch that connects to the internet, gets the time and displays it on the RGB matrix
you must set your WiFi correctly to make sure it gets connected. 
 watch video https://youtube.com/shorts/4iWjLiD7fS8
 📚⬇️ Download and resource page https://robojax.com/RJT838
 * Author:  Ahmad Shamshiri (Robojax.com)
 * Date: 07 Jan 2026
www.Robojax.com
https://youTube.com/@robojax


*/
#include <WiFi.h>
#include "time.h"
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>

//set the color of diplay make of Red, Green and Blue 
unsigned int color_RED = 17;
unsigned int color_GREEN = 43;
unsigned int color_BLUE = 171;

// 👇 REPLACE these with your real home WiFi name & password
const char* WIFI_SSID     = "WiFi";
const char* WIFI_PASSWORD = "passW0rd";



#define MATRIX_PIN 14

Adafruit_NeoMatrix matrix(8, 8, MATRIX_PIN,
  NEO_MATRIX_TOP    + NEO_MATRIX_LEFT +
  NEO_MATRIX_ROWS   + NEO_MATRIX_PROGRESSIVE,
  NEO_RGB           + NEO_KHZ800);

char timeText[6] = "00:00";
int16_t scrollX = 8;
unsigned long lastScrollMs = 0;
const uint16_t scrollIntervalMs = 120;

unsigned long lastTimeUpdateMs = 0;
const uint16_t timeUpdateIntervalMs = 1000;

//prototypes
bool updateTimeText();  // forward declaration
void scrollTime();      // forward declaration



// NTP (time) server
const char* ntpServer = "pool.ntp.org";

// Toronto-ish: UTC-5, plus 1 hour DST
const long  gmtOffset_sec     = -5 * 3600;  // -5 hours
const int   daylightOffset_sec = 3600;      // +1 hour for DST



bool updateTimeText() {
  struct tm timeinfo;
  if (!getLocalTime(&timeinfo)) {
    Serial.println("Failed to obtain time for display");
    return false;
  }

  // Format HH:MM
  snprintf(timeText, sizeof(timeText), "%02d:%02d",
           timeinfo.tm_hour,
           timeinfo.tm_min);

  Serial.print("Time text: ");
  Serial.println(timeText);
  return true;
}

void scrollTime() {
  matrix.fillScreen(0);
  matrix.setCursor(scrollX, 0);
  matrix.print(timeText);
  matrix.show();

  scrollX--;

  // Rough width: 5 characters ("HH:MM") × 6 pixels each ≈ 30 px
  int16_t textWidth = 30;
  if (scrollX < -textWidth) {
    scrollX = matrix.width();  // reset to right edge (8)
  }
}


void initMatrix() {
  matrix.begin();
  matrix.setBrightness(40);        // be careful with heat
  matrix.setTextWrap(false);
  matrix.setTextColor(matrix.Color(color_RED, color_GREEN, color_BLUE)); // color of text
}

void showMessage(const char* msg) {
  matrix.fillScreen(0);
  matrix.setCursor(0, 0);  // top-left
  matrix.print(msg);
  matrix.show();
}


void printLocalTime() {
  struct tm timeinfo;
  if (!getLocalTime(&timeinfo)) {
    Serial.println("Failed to obtain time");
    return;
  }
  // Format: 2025-11-18 14:35:12
  Serial.printf("%04d-%02d-%02d %02d:%02d:%02d\n",
                timeinfo.tm_year + 1900,
                timeinfo.tm_mon + 1,
                timeinfo.tm_mday,
                timeinfo.tm_hour,
                timeinfo.tm_min,
                timeinfo.tm_sec);
}

void setup() {
  Serial.begin(115200);
  delay(1000);
  Serial.println();
  Serial.println("ESP32-S3 Internet Clock - WiFi + NTP test");

  // Connect to WiFi
  Serial.print("Connecting to WiFi: ");
  Serial.println(WIFI_SSID);
  WiFi.mode(WIFI_STA);
  WiFi.begin(WIFI_SSID, WIFI_PASSWORD);

  int retries = 0;
  while (WiFi.status() != WL_CONNECTED && retries < 30) { // ~15s timeout
    delay(500);
    Serial.print(".");
    retries++;
  }
  Serial.println();

  if (WiFi.status() != WL_CONNECTED) {
    Serial.println("WiFi connection FAILED");
  } else {
    Serial.print("WiFi connected. IP: ");
    Serial.println(WiFi.localIP());
  }

// if user set all colors to 0, the dispaly will be turned off so set it green
  if(color_RED ==0 & color_GREEN ==0 && color_BLUE ==0)
  {
    color_GREEN = 200;
  }

  // Configure time via NTP
  configTime(gmtOffset_sec, daylightOffset_sec, ntpServer);
  Serial.println("Waiting for time...");
  delay(2000); // small wait for initial sync

  printLocalTime(); // print once at startup

    // NEW: init the LED matrix and show a test message
  initMatrix();
  showMessage("OK");
}

void loop() {
  unsigned long now = millis();

  // Update the time string "HH:MM" once per second
  if (now - lastTimeUpdateMs >= timeUpdateIntervalMs) {
    lastTimeUpdateMs = now;
    updateTimeText();  // fills timeText[], e.g. "14:32"
  }

  // Scroll the time across the 8×8 every scrollIntervalMs
  if (now - lastScrollMs >= scrollIntervalMs) {
    lastScrollMs = now;
    scrollTime();      // uses timeText and scrollX
  }
}