Tutorial ini adalah bagian dari: Matriks LED RGB ESP32-S3
Proyek keren untuk dibuat untuk bersenang-senang dan aplikasi praktis menggunakan modul matriks RGB ESP32-S3. Tautan ke video lain ada di bawah artikel ini.
Proyek Jam Internet Matriks LED RGB ESP32-S3 - 2 Jam Tampilan Waktu & Tanggal Multi Warna
Jam Internet NeoMatrix RGB ESP32-S3 dengan Tampilan Waktu & Tanggal
Proyek ini adalah Jam Internet Matriks RGB ESP32-S3 yang ditingkatkan, yang tidak hanya menampilkan waktu saat ini tetapi juga secara berkala menampilkan tanggal. ESP32-S3 terhubung ke Wi-Fi, menyinkronkan waktu dari server NTP, dan menggulir baik HH:MM atau tanggal (misalnya SEP 21) melintasi NeoMatrix RGB 8×8. Tampilan mendukung kontrol kecerahan otomatis siang/malam dan warna RGB yang dapat disesuaikan.

Apa yang dilakukan jam ini
Setelah terhubung ke jaringan Wi-Fi Anda, ESP32-S3 mengambil waktu lokal saat ini dari internet. Jam biasanya menggulir waktu, tetapi pada interval tetap ia beralih untuk menampilkan tanggal. Warna teks dapat ditetapkan ke satu warna atau secara otomatis berganti melalui beberapa warna yang ditentukan pengguna. Kecerahan secara otomatis dikurangi di malam hari agar tampilan lebih nyaman di mata.
Pustaka yang digunakan
Sketsa ini bergantung pada pustaka berikut:

#include <WiFi.h>
#include "time.h"
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>
Instal Adafruit NeoMatrix dari Arduino Library Manager. Semua dependensi yang diperlukan seperti Adafruit GFX Library dan Adafruit NeoPixel akan diinstal secara otomatis.

Konfigurasi pengguna yang penting
SSID dan kata sandi Wi-Fi (peka huruf besar/kecil)
Anda harus mengganti kredensial Wi-Fi dengan informasi jaringan Anda sendiri:

const char* WIFI_SSID = "WiFi";
const char* WIFI_PASSWORD = "passW0rd";
Penting: SSID Wi-Fi bersifat peka huruf besar/kecil. Misalnya, SSID bernama "Book" tidak sama dengan "book". Jika kapitalisasi tidak cocok persis, ESP32 akan gagal terhubung.
Server NTP, zona waktu, dan waktu musim panas
Jam menggunakan server waktu internet:
const char* ntpServer = "pool.ntp.org";
Waktu lokal dihitung menggunakan offset ini:
const long gmtOffset_sec = -5 * 3600;
const int daylightOffset_sec = 3600;
gmtOffset_sec: Offset UTC Anda dalam detik (contoh: UTC-5 =-5 * 3600)daylightOffset_sec: Gunakan3600untuk DST atau0jika DST tidak digunakan
Pengaturan ini diterapkan menggunakan:
configTime(gmtOffset_sec, daylightOffset_sec, ntpServer);
Kontrol kecerahan (siang / malam)
Proyek ini secara otomatis menyesuaikan kecerahan berdasarkan jam dalam sehari:
const int DAY_BRIGHTNESS = 40;
const int NIGHT_BRIGHTNESS = 5;
const int NIGHT_START_HOUR = 22;
const int NIGHT_END_HOUR = 6;
Antara pukul 10 malam dan 6 pagi, kecerahan dikurangi agar tampilan tidak terlalu mengganggu di lingkungan gelap. Anda dapat menyesuaikan nilai-nilai ini sesuai preferensi Anda.
Konfigurasi warna RGB
Jam mendukung mode warna tetap dan siklus warna otomatis. Warna RGB yang ditentukan pengguna disimpan dalam array:
uint8_t userColors[][3] = {
{17, 43, 171}, // Biru Muda
{255, 0, 0}, // Merah
{0, 255, 0}, // Hijau
{255, 165, 0}, // Oranye
{255, 0, 255} // Magenta
};
Setiap warna menggunakan nilai RGB (Merah, Hijau, Biru) mulai dari 0 hingga 255. Dengan mengubah angka-angka ini, Anda dapat membuat hampir semua warna untuk tampilan. Jika useFixedColor diatur ke true, jam selalu menggunakan satu warna. Jika diatur ke false, warna secara otomatis berubah setelah setiap guliran penuh.
Untuk dengan cepat menemukan nilai RGB yang akurat untuk warna apa pun yang Anda inginkan, gunakan alat Pemilih Warna RGB Pemilih Warna .
Format waktu dan tanggal
Waktu diformat sebagai HH:MM dan disimpan dalam buffer karakter kecil. Tanggal diformat sebagai string huruf besar seperti SEP 21. Tampilan secara otomatis beralih antara waktu dan tanggal pada interval tetap.
Logika gulir pada tampilan 8×8
Karena matriks 8×8 terlalu kecil untuk menampilkan teks penuh sekaligus, sketsa menggulir teks secara horizontal. Setelah teks sepenuhnya meninggalkan tampilan, warna diperbarui dan konten beralih antara waktu dan tanggal saat diperlukan.
Demonstrasi
Setelah mengunggah sketsa:
- ESP32 terhubung ke Wi-Fi
- Waktu disinkronkan dari internet
- Waktu saat ini menggulir melintasi matriks
- Tanggal muncul secara berkala
- Kecerahan secara otomatis menyesuaikan untuk siang dan malam
Unduhan dan tautan
Kode sumber lengkap disediakan di bawah artikel ini. Tautan ke komponen, alat, dan lembar data juga tersedia di bawah artikel ini.
Tutorial ini adalah bagian dari: Matriks LED RGB ESP32-S3
- Proyek Matriks LED RGB ESP32-S3 1- Titik Dasar
- Proyek Matriks LED RGB ESP32-S3 2 - Teks Berjalan
- Proyek Matriks LED RGB ESP32-S3 3 - Teks dari ponsel
- Proyek Matriks LED RGB ESP32-S3 4 - Titik miring
- Proyek Matriks LED RGB ESP32-S3 5 - Panah selalu ke atas
- Proyek Matriks LED RGB ESP32-S3 6 - Permainan Cible
- Proyek Jam Wi-Fi + NTP dengan Matriks LED RGB ESP32-S3 -1 Jam Dasar
- Proyek Jam Internet Matriks LED RGB ESP32-S3 - 3 Warna Malam dengan Tanggal
- Proyek Jam Internet Matriks LED RGB ESP32-S3 - 5 Warna Pelangi
- Proyek Jam Internet Matriks LED RGB ESP32-S3 - 4 Warna acak
- ESP32-S3 RGB LED Matrix test for RGB, GRB setting
/*
* =====================================================================================
* ESP32-S3 INTERNET RGB CLOCK (8x8 Matrix) - Project 2
Multi color
* =====================================================================================
watch video https://youtube.com/shorts/4iWjLiD7fS8
📚⬇️ Download and resource page https://robojax.com/RJT839
* Author: Ahmad Shamshiri (Robojax.com)
* Date: 07 Jan 2026
* * FEATURES:
* 1. WiFi/NTP Time: Syncs automatically with internet time servers.
* 2. Cycle-Based Color: Color changes ONLY when text finishes a full scroll.
* 3. Auto-Brightness: Dims the LEDs during night hours (User-configurable).
* 4. Periodic Date: Scrolls the date (e.g., "JAN 07") every 2 minutes.
* * USER CONFIGURATION GUIDE:
* -------------------------
* - WiFi: Change 'WIFI_SSID' and 'WIFI_PASSWORD' to your local network.
* - Colors: Add or remove {R, G, B} sets in the 'userColors' array.
* - Night Mode: Adjust 'NIGHT_START_HOUR' and 'NIGHT_BRIGHTNESS'.
* =====================================================================================
*/
#include <WiFi.h>
#include "time.h"
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>
#define MATRIX_PIN 14
// --- BRIGHTNESS CONFIGURATION ---
const int DAY_BRIGHTNESS = 40;
const int NIGHT_BRIGHTNESS = 5;
const int NIGHT_START_HOUR = 22;
const int NIGHT_END_HOUR = 6;
// --- COLOR CONFIGURATION ---
bool useFixedColor = false;
int fixedColorIndex = 0;
uint8_t userColors[][3] = {
{17, 43, 171}, // Light Blue
{255, 0, 0}, // Red
{0, 255, 0}, // Green
{255, 165, 0}, // Orange
{255, 0, 255} // Magenta
};
// 👇 REPLACE these with your real home WiFi name & password
const char* WIFI_SSID = "WiFi";
const char* WIFI_PASSWORD = "passW0rd";
int currentColorIndex = 0;
int totalColors = sizeof(userColors) / sizeof(userColors[0]);
// --- DATE/TIME INTERVALS ---
unsigned long lastDateShowMs = 0;
const uint32_t dateIntervalMs = 30000; // 2 minutes
unsigned long lastTimeUpdateMs = 0;
const uint16_t timeUpdateIntervalMs = 1000;
unsigned long lastScrollMs = 0;
const uint16_t scrollIntervalMs = 100;
// --- GLOBAL VARIABLES ---
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;
const char* ntpServer = "pool.ntp.org";
const long gmtOffset_sec = -5 * 3600;
const int daylightOffset_sec = 3600;
void updateTimeAndDate() {
struct tm timeinfo;
if (!getLocalTime(&timeinfo)) return;
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]);
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);
// FIXED LOGIC: Uses currentColorIndex which only changes at the end of a scroll
int idx = useFixedColor ? fixedColorIndex : currentColorIndex;
matrix.setTextColor(matrix.Color(userColors[idx][0], userColors[idx][1], userColors[idx][2]));
matrix.setCursor(scrollX, 0);
matrix.print(currentDisplayText);
matrix.show();
scrollX--;
int16_t textWidth = strlen(currentDisplayText) * 6;
// THE TRIGGER POINT: This happens only when text is fully off-screen
if (scrollX < -textWidth) {
scrollX = matrix.width();
// 1. Cycle the color now and only now
if (!useFixedColor) {
currentColorIndex = (currentColorIndex + 1) % totalColors;
}
// 2. Decide whether to switch between Time and Date
if (millis() - lastDateShowMs > dateIntervalMs) {
strcpy(currentDisplayText, dateText);
lastDateShowMs = millis();
} else {
strcpy(currentDisplayText, timeText);
}
}
}
void setup() {
Serial.begin(115200);
WiFi.begin(WIFI_SSID, WIFI_PASSWORD);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
configTime(gmtOffset_sec, daylightOffset_sec, ntpServer);
matrix.begin();
matrix.setTextWrap(false);
matrix.setBrightness(DAY_BRIGHTNESS);
updateTimeAndDate();
strcpy(currentDisplayText, timeText);
}
void loop() {
unsigned long now = millis();
if (now - lastTimeUpdateMs >= timeUpdateIntervalMs) {
lastTimeUpdateMs = now;
updateTimeAndDate();
}
if (now - lastScrollMs >= scrollIntervalMs) {
lastScrollMs = now;
scrollDisplay();
}
}
Hal-hal yang mungkin Anda butuhkan
-
Amazon
-
eBay
-
AliExpressPurchase ESP32-S3 RGB Matrix from AliExpresss.click.aliexpress.com
-
AliExpressPurchase ESP32-S3 RGB Matrix from AliExpress (2)s.click.aliexpress.com
Sumber daya & referensi
-
Video
Berkas📁
File Fritzing
-
esp32-S3-supermini-tht fritzing part
esp32-S3-supermini-tht.fzpz0.02 MB