Cari Kode

Proyek Jam Internet Matriks LED RGB ESP32-S3 - 5 Warna Pelangi

Proyek Jam Internet Matriks LED RGB ESP32-S3 - 5 Warna Pelangi

Jam Internet ESP32-S3 dengan Efek Warna Pelangi

Proyek ini adalah Jam Internet RGB Matrix ESP32-S3 yang terhubung ke Wi-Fi, menyinkronkan waktu lokal dari server NTP, dan menampilkan waktu berjalan dalam format HH:MM melintasi NeoMatrix RGB 8×8 bawaan. Berbeda dengan versi warna solid atau acak, jam ini menggunakan efek warna pelangi yang halus, di mana setiap karakter terus bergeser melalui spektrum RGB saat berjalan. Jam ini juga secara berkala menampilkan tanggal dan secara otomatis menyesuaikan kecerahan antara siang dan malam.

Animasi_jam_internet_ESP32-s3

Cara kerja jam ini

Setelah dinyalakan melalui USB-C, ESP32-S3 terhubung ke jaringan Wi-Fi Anda dan mengambil waktu lokal saat ini dari internet. Layar biasanya menampilkan waktu berjalan, tetapi pada interval tertentu beralih untuk menampilkan tanggal. Baik waktu maupun tanggal dirender menggunakan efek pelangi dinamis, menciptakan tampilan yang hidup dan beranimasi pada matriks 8×8 yang kecil.

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 menggunakan Arduino Library Manager. Dependensinya, termasuk Adafruit GFX Library dan Adafruit NeoPixel, akan terinstal secara otomatis.

Konfigurasi pengguna yang penting

Pin data matriks (matriks RGB bawaan)

Meskipun matriks RGB terpasang pada papan ESP32-S3, pin data tetap harus didefinisikan dalam kode:

#define MATRIX_PIN 14

GPIO 14 umumnya digunakan pada papan matriks RGB ESP32-S3. Jika varian papan Anda menggunakan pin yang berbeda, perbarui nilai ini.

SSID dan kata sandi Wi-Fi (peka huruf besar/kecil)

Ganti kredensial Wi-Fi dengan detail jaringan Anda sendiri:

const char* WIFI_SSID     = "WIFI Anda";
const char* WIFI_PASSWORD = "kataSandi0";

Penting: SSID Wi-Fi bersifat peka huruf besar/kecil. SSID bernama "Book" tidak sama dengan "book". Jika kapitalisasi tidak cocok persis, ESP32-S3 akan gagal terhubung.

Server NTP, zona waktu, dan waktu musim panas

Jam menyinkronkan waktu menggunakan server NTP internet:

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

Waktu lokal dihitung menggunakan offset berikut:

// Seperti Toronto: UTC-5, ditambah 1 jam DST
const long  gmtOffset_sec     = -5 * 3600;
const int   daylightOffset_sec = 3600;
  • gmtOffset_sec: Offset UTC dalam detik (contoh: UTC-5 = -5 * 3600)
  • daylightOffset_sec: Gunakan 3600 jika DST aktif, atau 0 jika tidak digunakan

Nilai-nilai ini diterapkan menggunakan:

configTime(gmtOffset_sec, daylightOffset_sec, ntpServer);

Kecerahan otomatis siang / malam

Kecerahan berubah secara otomatis berdasarkan jam saat ini:

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, matriks meredup untuk mengurangi silau. Selama jam siang, kecerahan normal dipulihkan.

Efek warna pelangi

Proyek ini menggunakan roda warna RGB klasik untuk menghasilkan warna pelangi yang halus. Setiap karakter digambar dengan offset warna yang sedikit berbeda, dan warna-warna tersebut bergeser seiring waktu, menghasilkan animasi pelangi yang mengalir.

// Pembantu untuk membuat Warna Pelangi
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);
}

Saat teks berjalan, setiap karakter maju melalui spektrum RGB, menciptakan efek pelangi berkelanjutan yang terlihat sangat mengesankan pada layar 8×8 yang kecil.

Perilaku tampilan waktu dan tanggal

Jam mempertahankan buffer terpisah untuk waktu dan tanggal:

  • Waktu: HH:MM
  • Tanggal: MMM DD (contoh JAN 08)

Tanggal ditampilkan pada interval tetap:

const uint32_t dateIntervalMs = 60000; // Tampilkan tanggal setiap 1 menit

Di akhir setiap siklus gulir penuh, kode memutuskan apakah akan terus menampilkan waktu atau beralih ke tanggal.

Logika pengguliran pada matriks 8×8

Karena layar hanya selebar 8 piksel, teks bergulir dengan halus dari kanan ke kiri. Setelah teks sepenuhnya keluar dari layar, kursor diatur ulang dan konten berikutnya (waktu atau tanggal) dimuat untuk lintasan berikutnya.

Demonstrasi

Setelah mengunggah sketsa dan menyalakan papan melalui USB-C:

  • ESP32-S3 terhubung ke jaringan Wi-Fi Anda
  • Waktu disinkronkan dari internet
  • Waktu berjalan dalam format HH:MM
  • Tanggal muncul secara berkala
  • Semua teks dirender dengan efek pelangi beranimasi yang halus
  • Layar secara otomatis meredup di malam hari dan mencerahkan di siang hari

Unduhan dan tautan

Kode sumber lengkap disediakan di bawah artikel ini. Alat dan referensi yang berguna, termasuk Pemilih Warna RGB, juga ditautkan 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
872-ESP32-S3 RGB LED Matrix Internte Clock Project 5 - Rainbow Color
Bahasa: C++
/*
 * =====================================================================================
 * 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();
  }
}

Sumber daya & referensi

Berkas📁

File Fritzing