Search Code

Proyek Jam Internet Matriks LED RGB ESP32-S3 - 2 Jam Tampilan Waktu & Tanggal Multi Warna

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.

Animasi_jam_internet_ESP32-s3

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: Gunakan 3600 untuk DST atau 0 jika 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.

Gambar

ESP32 S3 Matrix
ESP32 S3 Matrix
ESP32 S3 Matrix  pin out
ESP32 S3 Matrix pin out
ESP32-S3_RGB_8x8_matrix-3
ESP32-S3_RGB_8x8_matrix-3
ESP32-S3_RGB_8x8_matrix1
ESP32-S3_RGB_8x8_matrix1
ESP32-S3_RGB_8x8_matrix-2
ESP32-S3_RGB_8x8_matrix-2
ESP32-s3_internet_clock_animation
ESP32-s3_internet_clock_animation
869-ESP32-S3 RGB LED Matrix Internte Clock Project 2 - Multi Color with Date
Bahasa: C++
/*
 * =====================================================================================
 * 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

Sumber daya & referensi

Berkas📁

File Fritzing