บทเรียนนี้เป็นส่วนหนึ่งของ: ESP32-S3 RGB LED Matrix
โปรเจ็กต์เจ๋งๆ ที่สร้างได้ทั้งเพื่อความสนุกและการใช้งานจริง โดยใช้โมดูล ESP32-S3 RGB Matrix ลิงก์ไปยังวิดีโออื่นๆ อยู่ด้านล่างบทความนี้
โครงการนาฬิกาอินเทอร์เน็ตจอ LED Matrix RGB ESP32-S3 - 5 สีรุ้ง
นาฬิกาอินเทอร์เน็ต ESP32-S3 พร้อมเอฟเฟกต์สีรุ้ง
โปรเจกต์นี้เป็นนาฬิกาอินเทอร์เน็ต RGB Matrix ของ ESP32-S3 ที่เชื่อมต่อกับ Wi-Fi ซิงโครไนซ์เวลาท้องถิ่นจากเซิร์ฟเวอร์ NTP และเลื่อนเวลาในรูปแบบ HH:MM ผ่าน NeoMatrix RGB 8×8 ในตัว ต่างจากเวอร์ชันสีทึบหรือสีสุ่ม นาฬิกานี้ใช้เอฟเฟกต์สีรุ้งที่นุ่มนวล โดยแต่ละตัวอักษรจะเปลี่ยนสีผ่านสเปกตรัม RGB อย่างต่อเนื่องขณะเลื่อน นาฬิกายังแสดงวันที่เป็นระยะและปรับความสว่างอัตโนมัติระหว่างกลางวันและกลางคืน

นาฬิกานี้ทำงานอย่างไร
เมื่อจ่ายไฟผ่าน USB-C ESP32-S3 จะเชื่อมต่อกับเครือข่าย Wi-Fi ของคุณและดึงเวลาท้องถิ่นปัจจุบันจากอินเทอร์เน็ต โดยปกติจอแสดงผลจะเลื่อนเวลา แต่ในช่วงเวลาที่กำหนดจะสลับไปแสดงวันที่ ทั้งเวลาและวันที่ถูกแสดงผลด้วยเอฟเฟกต์สีรุ้งแบบไดนามิก สร้างการแสดงผลที่สดใสและมีชีวิตชีวาบนเมทริกซ์ขนาดเล็ก 8×8
ไลบรารีที่ใช้
สเก็ตช์นี้ใช้ไลบรารีต่อไปนี้:

#include <WiFi.h>
#include "time.h"
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>
ติดตั้ง Adafruit NeoMatrix โดยใช้ Arduino Library Manager ไลบรารีที่ต้องพึ่งพา รวมถึง Adafruit GFX Library และ Adafruit NeoPixel จะถูกติดตั้งโดยอัตโนมัติ

การกำหนดค่าที่สำคัญสำหรับผู้ใช้
พินข้อมูลเมทริกซ์ (RGB matrix ในตัว)
แม้ว่า RGB matrix จะติดอยู่กับบอร์ด ESP32-S3 แต่ยังคงต้องกำหนดพินข้อมูลในโค้ด:

#define MATRIX_PIN 14
GPIO 14 มักใช้บนบอร์ด ESP32-S3 RGB matrix หากบอร์ดรุ่นของคุณใช้พินอื่น ให้อัปเดตค่านี้
SSID และรหัสผ่าน Wi-Fi (ตัวพิมพ์ใหญ่-เล็กมีความสำคัญ)
แทนที่ข้อมูลรับรอง Wi-Fi ด้วยรายละเอียดเครือข่ายของคุณเอง:
const char* WIFI_SSID = "your WIFI";
const char* WIFI_PASSWORD = "passW0rd";
สำคัญ: SSID ของ Wi-Fi เป็นตัวพิมพ์ใหญ่-เล็กที่มีความสำคัญ SSID ที่ชื่อ "Book" ไม่เหมือนกับ "book" หากตัวพิมพ์ใหญ่ไม่ตรงกันทุกตัว ESP32-S3 จะไม่สามารถเชื่อมต่อได้
เซิร์ฟเวอร์ NTP เขตเวลา และเวลาออมแสง
นาฬิกาซิงโครไนซ์เวลาโดยใช้เซิร์ฟเวอร์ NTP บนอินเทอร์เน็ต:
const char* ntpServer = "pool.ntp.org";
เวลาท้องถิ่นคำนวณโดยใช้ค่าชดเชยเหล่านี้:
// แบบโตรอนโต: UTC-5 บวกเพิ่ม 1 ชั่วโมงสำหรับ DST
const long gmtOffset_sec = -5 * 3600;
const int daylightOffset_sec = 3600;
gmtOffset_sec: ค่าชดเชย UTC เป็นวินาที (ตัวอย่าง: UTC-5 =-5 * 3600)daylightOffset_sec: ใช้3600หากเปิดใช้ DST หรือ0หากไม่ได้ใช้
ค่าเหล่านี้ถูกนำไปใช้โดยใช้:
configTime(gmtOffset_sec, daylightOffset_sec, ntpServer);
ความสว่างกลางวัน/กลางคืนอัตโนมัติ
ความสว่างจะเปลี่ยนโดยอัตโนมัติตามชั่วโมงปัจจุบัน:
const int DAY_BRIGHTNESS = 40;
const int NIGHT_BRIGHTNESS = 5;
const int NIGHT_START_HOUR = 22;
const int NIGHT_END_HOUR = 6;
ระหว่าง 22:00 น. ถึง 06:00 น. เมทริกซ์จะลดความสว่างเพื่อลดแสงจ้า ในช่วงเวลากลางวันจะกลับสู่ความสว่างปกติ
เอฟเฟกต์สีรุ้ง
โปรเจกต์นี้ใช้วงล้อสี RGB แบบคลาสสิกเพื่อสร้างสีรุ้งที่นุ่มนวล แต่ละตัวอักษรถูกวาดด้วยค่าชดเชยสีที่แตกต่างกันเล็กน้อย และสีจะเปลี่ยนไปตามเวลา ทำให้เกิดแอนิเมชันสีรุ้งที่ไหลลื่น
// ตัวช่วยสร้างสีรุ้ง
uint32_t Wheel(byte WheelPos) {
WheelPos = 255 - WheelPos;
if (WheelPos < 85) {
return matrix.Color(255 - WheelPos * 3, 0, WheelPos * 3);
}
if (WheelPos < 170) {
WheelPos -= 85;
return matrix.Color(0, WheelPos * 3, 255 - WheelPos * 3);
}
WheelPos -= 170;
return matrix.Color(WheelPos * 3, 255 - WheelPos * 3, 0);
}
เมื่อข้อความเลื่อน แต่ละตัวอักษรจะเคลื่อนผ่านสเปกตรัม RGB อย่างต่อเนื่อง สร้างเอฟเฟกต์สีรุ้งที่ต่อเนื่อง ซึ่งดูน่าประทับใจเป็นพิเศษบนจอแสดงผลขนาดเล็ก 8×8
พฤติกรรมการแสดงเวลาและวันที่
นาฬิการักษาบัฟเฟอร์แยกสำหรับเวลาและวันที่:
- เวลา:
HH:MM - วันที่:
MMM DD(ตัวอย่างเช่นJAN 08)
วันที่จะแสดงในช่วงเวลาที่กำหนด:
const uint32_t dateIntervalMs = 60000; // แสดงวันที่ทุก 1 นาที
เมื่อสิ้นสุดรอบการเลื่อนเต็มแต่ละครั้ง โค้ดจะตัดสินใจว่าจะแสดงเวลาต่อไปหรือสลับไปแสดงวันที่
ตรรกะการเลื่อนบนเมทริกซ์ 8×8
เนื่องจากจอแสดงผลกว้างเพียง 8 พิกเซล ข้อความจึงเลื่อนจากขวาไปซ้ายอย่างนุ่มนวล เมื่อข้อความออกจากหน้าจอจนหมด เคอร์เซอร์จะรีเซ็ตและโหลดเนื้อหาถัดไป (เวลาหรือวันที่) สำหรับรอบถัดไป
การสาธิต
หลังจากอัปโหลดสเก็ตช์และจ่ายไฟให้บอร์ดผ่าน USB-C:
- ESP32-S3 เชื่อมต่อกับเครือข่าย Wi-Fi ของคุณ
- เวลาถูกซิงโครไนซ์จากอินเทอร์เน็ต
- เวลาเลื่อนในรูปแบบ
HH:MM - วันที่ปรากฏเป็นระยะ
- ข้อความทั้งหมดถูกแสดงผลด้วยเอฟเฟกต์สีรุ้งแอนิเมชันที่นุ่มนวล
- จอแสดงผลลดความสว่างอัตโนมัติในเวลากลางคืนและเพิ่มความสว่างในเวลากลางวัน
ดาวน์โหลดและลิงก์
บทความนี้มีซอร์สโค้ดฉบับสมบูรณ์อยู่ด้านล่าง เครื่องมือและเอกสารอ้างอิงที่มีประโยชน์ รวมถึงตัวเลือกสี RGB ก็มีลิงก์อยู่ด้านล่างบทความนี้เช่นกัน
บทเรียนนี้เป็นส่วนหนึ่งของ: ESP32-S3 RGB LED Matrix
- โปรเจกต์ ESP32-S3 RGB LED Matrix 1- จุดพื้นฐาน
- โปรเจกต์ ESP32-S3 RGB LED Matrix 2 - ข้อความเลื่อน
- โปรเจกต์ ESP32-S3 RGB LED Matrix 3 - ข้อความจากโทรศัพท์มือถือ
- โปรเจกต์ ESP32-S3 RGB LED Matrix 4 - จุดเอียง
- โปรเจกต์ ESP32-S3 RGB LED Matrix 5 - ลูกศรชี้ขึ้นเสมอ
- โปรเจกต์ ESP32-S3 RGB LED Matrix 6 - เกม Cible
- โปรเจกต์นาฬิกา ESP32-S3 RGB LED Matrix Wi-Fi + NTP Time Clock -1 นาฬิกาพื้นฐาน
- โปรเจกต์นาฬิกาอินเทอร์เน็ต RGB LED Matrix ESP32-S3 - จอแสดงเวลาและวันที่หลากสี 2 นาฬิกา
- โปรเจกต์นาฬิกาอินเทอร์เน็ต RGB LED Matrix ESP32-S3 - 3 สีกลางคืนพร้อมวันที่
- โปรเจกต์นาฬิกาอินเทอร์เน็ต RGB LED Matrix ESP32-S3 - 4 สีสุ่ม
- ESP32-S3 RGB LED Matrix test for RGB, GRB setting
/*
* =====================================================================================
* ESP32-S3 CLOCK - RAINBOW DATE & SOLID TIME - Project 5- RAINBOW MODE
* =====================================================================================
watch video https://youtube.com/shorts/4iWjLiD7fS8
📚⬇️ Download and resource page https://robojax.com/RJT842
* Author: Gemini (AI Thought Partner) & Ahmad Shamshiri (Robojax.com)
* Date: 07 Jan 2026
* =====================================================================================
* ESP32-S3 INTERNET RGB CLOCK - RAINBOW MODE
* * FEATURES:
* - Full Rainbow: Time and Date use flowing rainbow colors.
* - Auto-Brightness: Dims at night (22:00 to 06:00).
* - Custom WiFi: Robust connection logic with retries.
* =====================================================================================
*/
#include <WiFi.h>
#include "time.h"
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>
#define MATRIX_PIN 14
// 👇 REPLACE these with your real home WiFi name & password
const char* WIFI_SSID = "your WIFI";
const char* WIFI_PASSWORD = "passW0rd";
// 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
// --- BRIGHTNESS CONFIGURATION ---
const int DAY_BRIGHTNESS = 40;
const int NIGHT_BRIGHTNESS = 5;
const int NIGHT_START_HOUR = 22;
const int NIGHT_END_HOUR = 6;
// --- INTERVALS & TRACKING ---
unsigned long lastDateShowMs = 0;
const uint32_t dateIntervalMs = 60000; // Show date every 1 minute
bool isShowingDate = false;
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";
char dateText[10] = "";
char currentDisplayText[12] = "";
int16_t scrollX = 8;
unsigned long lastScrollMs = 0;
const uint16_t scrollIntervalMs = 100;
unsigned long lastTimeUpdateMs = 0;
// Helper to create Rainbow Colors
uint32_t Wheel(byte WheelPos) {
WheelPos = 255 - WheelPos;
if(WheelPos < 85) {
return matrix.Color(255 - WheelPos * 3, 0, WheelPos * 3);
}
if(WheelPos < 170) {
WheelPos -= 85;
return matrix.Color(0, WheelPos * 3, 255 - WheelPos * 3);
}
WheelPos -= 170;
return matrix.Color(WheelPos * 3, 255 - WheelPos * 3, 0);
}
void updateClockData() {
struct tm timeinfo;
if (!getLocalTime(&timeinfo)) return;
// Update Time and Date strings
snprintf(timeText, sizeof(timeText), "%02d:%02d", timeinfo.tm_hour, timeinfo.tm_min);
strftime(dateText, sizeof(dateText), "%b %d", &timeinfo);
for (int i = 0; dateText[i]; i++) dateText[i] = toupper(dateText[i]);
// Handle Night Dimming
if (timeinfo.tm_hour >= NIGHT_START_HOUR || timeinfo.tm_hour < NIGHT_END_HOUR) {
matrix.setBrightness(NIGHT_BRIGHTNESS);
} else {
matrix.setBrightness(DAY_BRIGHTNESS);
}
}
void scrollDisplay() {
matrix.fillScreen(0);
int len = strlen(currentDisplayText);
int16_t x = scrollX;
// Draw each character with a shifting rainbow color
for (int i = 0; i < len; i++) {
uint8_t colorPos = (uint8_t)((i * 30) + (millis() / 5));
matrix.setTextColor(Wheel(colorPos));
matrix.setCursor(x + (i * 6), 0);
matrix.print(currentDisplayText[i]);
}
matrix.show();
scrollX--;
int16_t textWidth = len * 6;
if (scrollX < -textWidth) {
scrollX = matrix.width();
// Switch between Date and Time at end of cycle
if (millis() - lastDateShowMs > dateIntervalMs) {
strcpy(currentDisplayText, dateText);
lastDateShowMs = millis();
isShowingDate = true;
} else {
strcpy(currentDisplayText, timeText);
isShowingDate = false;
}
}
}
void setup() {
Serial.begin(115200);
delay(1000);
Serial.println("\nESP32-S3 Rainbow Clock Initializing...");
// 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());
}
// Configure time via NTP
configTime(gmtOffset_sec, daylightOffset_sec, ntpServer);
Serial.println("Waiting for time...");
delay(2000); // small wait for initial sync
matrix.begin();
matrix.setTextWrap(false);
matrix.setBrightness(DAY_BRIGHTNESS);
updateClockData();
strcpy(currentDisplayText, timeText); // Load initial time
}
void loop() {
unsigned long now = millis();
// Update time digits and check brightness every second
if (now - lastTimeUpdateMs >= 1000) {
lastTimeUpdateMs = now;
updateClockData();
}
// Handle the scrolling animation
if (now - lastScrollMs >= scrollIntervalMs) {
lastScrollMs = now;
scrollDisplay();
}
}
แหล่งข้อมูลและเอกสารอ้างอิง
-
วิดีโอ
-
ภายใน🎨 Color picker Toolrobojax.com
ไฟล์📁
ไฟล์ Fritzing
-
esp32-S3-supermini-tht fritzing part
esp32-S3-supermini-tht.fzpz0.02 MB