ESP32-S3 RGB LED Matris Projesi 2 - Kayan Metin

ESP32-S3 RGB LED Matris Projesi 2 - Kayan Metin

Proje 2 – ESP32-S3 RGB LED Matris Üzerinde Metin Kaydırma

Bu projede ESP32-S3 RGB LED Matrisini küçük bir metin bandına dönüştürüyoruz. Kısa bir mesaj (örneğin Robojax) 8×8 RGB ekranda kayar ve metni, rengi, parlaklığı ve kaydırma hızını doğrudan kodda kolayca değiştirebilirsiniz. Bu, basit bildirimler, isim etiketleri veya küçük durum mesajları için çok kullanışlıdır.

Bu serideki altı projenin tamamı tek bir YouTube videosunda gösterilmiş ve açıklanmıştır. Aynı video bu sayfaya gömülüdür, böylece metin kaydırmanın gerçek zamanlı olarak nasıl göründüğünü ve her ayarın animasyonu nasıl etkilediğini tam olarak görebilirsiniz. Bu projenin tam kodu makalenin altında otomatik olarak yüklenir ve ESP32-S3 RGB LED Matris modülünü kod bölümünün altında listelenen bağlı kuruluş mağazalarından satın alabilirsiniz.

Bu proje, Proje 1'in (hareket eden nokta ve renk kontrolü) temelleri üzerine inşa edilir ve NeoMatrix kütüphanesini kullanarak metin oluşturma ve kaydırma ekler.

ESP32-S3 RGB LED Matris Modülü Genel Bakış

Donanım altı projenin tamamında aynıdır: Wi-Fi ve Bluetooth'lu bir ESP32-S3 mikrodenetleyici, 8×8 RGB LED matris (64 adreslenebilir RGB LED), bir QMI8658C ivmeölçer, USB bağlantı noktası ve erişilebilir IO pinleri.:contentReference[oaicite:0]{index=0}

• ESP32-S3 – gelişmiş projeler için Wi-Fi/BLE'li ana CPU.
• 8×8 RGB matris – simgeler, metin ve animasyonlar için 64 RGB LED.
• QMI8658C ivmeölçer – sonraki projelerde eğim ve yönelim için kullanılır.
• USB bağlantı noktası – Arduino IDE üzerinden güç ve programlama için kullanılır.
• Açık pinler – kartı diğer IO için normal bir ESP32 gibi kullanmanızı sağlar.
• Boot / Reset düğmeleri – donanım yazılımı yükleme ve taslakları yeniden başlatma için.

Proje 2'de esas olarak matrise ve NeoMatrix metin işlevlerine odaklanıyoruz. İvmeölçer henüz kullanılmıyor, ancak aynı kart daha sonraki tüm etkileşim ve oyun projelerini de yönetecektir.

Videoda Kapsanan Projeler (Zaman Damgaları)

Bu makaleye eşlik eden video altı projenin tamamını kapsar. Yaklaşık zaman damgaları şunlardır:

• 00:00 – Giriş
• 02:01 – ESP32 kartlarını yükleme
• 03:32 – Kütüphaneleri yükleme
li>
• 05:32 – Proje 1: Hareket Eden Nokta
• 11:11 – Proje 2: Metin Kaydırma
• 12:59 – Proje 3: HTTP Metni
• 16:41 – Proje 4: Eğim Noktası
• 18:55 – Proje 5: Yukarı Ok
• 20:02 – Proje 6: Hedef Oyunu

Bu makaleyi okurken videoyu izlemeniz önerilir. Video, metnin LED matris üzerinde canlı olarak kaydığını gösterir ve Arduino IDE'deki tüm adımları anlatır.

Arduino IDE'de ESP32 Kartlarını Yükleme

Metin kaydırma kodunu çalıştırmadan önce Arduino IDE'nizde ESP32 desteğinin yüklü olduğundan emin olun:

1. File > Preferences öğesini açın ve ESP32 kartları URL'sini “Additional Boards Manager URLs” bölümüne ekleyin.
2. Tools > Board > Boards Manager… bölümüne gidin, ESP32 arayın ve resmi ESP32 paketini yükleyin.
3. ESP32-S3 RGB Matris kartınızı Tools > Board bölümünden seçin.
4. Modülü USB ile bağlayın ve Tools > Port altında doğru COM/seri bağlantı noktasını seçin.

Kart türü veya bağlantı noktası doğru değilse, taslak yüklenmez.

NeoMatrix ve Gerekli Kütüphaneleri Yükleme

Metin kaydırma, Adafruit NeoMatrix ve bağımlılıkları kullanılarak uygulanır. Videoda, bunlar Library Manager üzerinden yüklenir.

İhtiyacınız olacaklar:

• Adafruit NeoMatrix
• Adafruit NeoPixel
• Adafruit GFX Library

1. Sketch > Include Library > Manage Libraries… öğesini açın.
2. Adafruit NeoMatrix arayın ve Install düğmesine tıklayın.
3. İstendiğinde, bağımlılıklar olarak Adafruit GFX ve Adafruit NeoPixel yüklemesine izin verin.

Yükleme başarılıysa, File > Examples > Adafruit NeoMatrix ve File > Examples > Adafruit NeoPixel altında örnek taslaklar görmelisiniz.

Proje 2 – Kod Ayarları (Metin Kaydırma)

Tam metin kaydırma taslağı, web sitesinde bu makalenin altında otomatik olarak yüklenir. Burada yalnızca düzenlemek isteyeceğiniz yapılandırma değerlerine odaklanıyoruz: pin, matris boyutu, parlaklık, metin dizesi, renk, kaydırma hızı ve isteğe bağlı yön.

Aşağıdaki tüm parçalar, ana mantığa dokunmadan davranışı hızlıca ayarlayabilmeniz için taslağın üst kısmındaki yapılandırma bölümünden alınmıştır.

Matris Pini ve Boyutu

Tıpkı Proje 1'deki gibi, RGB matris GPIO 14'e bağlıdır ve 64 LED (8×8) içerir. Bu iki satırın modülünüzle eşleştiğinden emin olun:

 // 8×8 RGB matrise bağlı pin 
const int MATRIX_PIN = 14; // bu modülde 14 olmalıdır // Matris boyutu (genişlik ve yükseklik)
 const int MATRIX_WIDTH = 8; 
const int MATRIX_HEIGHT = 8; 

NeoMatrix kütüphanesinden bir örnek kopyalarsanız, farklı bir pin veya boyut kullanabilir; bunları her zaman bu karta uyacak şekilde değiştirin.

Metnin Parlaklığı

Parlaklık genellikle 0 ile 255 arasında bir değerle kontrol edilir; 0 kapalı, 255 maksimum parlaklıktır. Orta düzey bir değer genellikle yeterlidir:

// Genel matris parlaklığı (0–255) 
uint8_t matrixBrightness = 40; // rahat iç mekan parlaklığı // 
setup() içinde: 
matrix.setBrightness(matrixBrightness); 

Paneli parlak bir ortamda veya kısa süreli kullanıyorsanız bu değeri artırabilirsiniz, ancak ekrana yakınsanız çok yükseğe çıkarmaktan kaçının.

Kaydırılacak Metin

Gerçek mesaj bir dize olarak saklanır. Videoda örnek metin Robojax'tır. Bunu istediğiniz kısa bir etikete veya mesaja değiştirebilirsiniz:

 // 8×8 matriste kaydırılacak metin const char scrollText[] = "Robojax";
 // bunu kendi mesajınızla değiştirin 

Bunun yalnızca 8×8 bir matris olduğunu unutmayın, bu yüzden çok uzun mesajlar kaydırılması daha uzun sürer ve okunması zorlaşabilir.

Metin Rengi (RGB Değerleri)

Kaydırılan metnin rengi kırmızı, yeşil ve mavi bileşenlerle (0–255) ayarlanır. Örneğin, saf kırmızı (255, 0, 0), saf yeşil (0, 255, 0) ve saf mavi (0, 0, 255)'tir. Kodda şöyle bir şey göreceksiniz:

 // Metin rengi (R, G, B) uint8_t textRed = 255; // kırmızı bileşen uint8_t textGreen = 0; // yeşil bileşen uint8_t textBlue = 0; // mavi bileşen 

Rengi değiştirmek için:

• Sarı: textRed = 255; textGreen = 255; textBlue = 0;
• Camgöbeği: textRed = 0; textGreen = 255; textBlue = 255;
• Beyaz: textRed = 255; textGreen = 255; textBlue = 255;

Video ayrıca RGB değerlerini bulmak için çevrimiçi bir renk seçici kullanmayı ve ardından bunları koda girmeyi gösterir.:contentReference[oaicite:1]{index=1}

Kaydırma Hızı (Kareler Arası Gecikme)

Kaydırma hızı, her güncelleme adımı arasındaki milisaniye cinsinden bir gecikme değeriyle kontrol edilir. Daha küçük bir değer metnin daha hızlı hareket etmesini sağlar; daha büyük bir değer ise yavaşlatır. Kodda şöyle bir değişken bulmalısınız:

// Kaydırma adımları arasındaki gecikme (milisaniye cinsinden) int scrollDelayMs = 50; 
// daha küçük = daha hızlı, daha büyük = daha yavaş 

Örnekler:

• scrollDelayMs = 20; → hızlı kaydırma.
• scrollDelayMs = 50; → orta hız (videodakine benzer).
• scrollDelayMs = 100; veya daha fazlası → yavaş, okunması kolay kaydırma.

loop() içinde bu değer, metin konumunun her yeniden çiziminden sonra bir delay(scrollDelayMs); çağrısında kullanılır.

Kaydırma Yönü (İsteğe Bağlı)

“Temel metin kaydırma” projesinde genellikle sola kaydırırız, ancak daha sonra diğer yönlerle (sol, sağ, yukarı, aşağı) deney yapabilmeniz için sembolik bir yön değişkeni tanımlamak faydalıdır.

Yaygın bir desen şudur:

 // Kaydırma yönü seçici // 0 = sol, 1 = sağ, 2 = yukarı, 3 = aşağı 
int scrollDirection = 0; // varsayılan: sola kaydır 

Ana döngü daha sonra scrollDirection değerini kontrol eder ve metni seçilen yönde hareket ettirir. Proje 2 için bunu 0 (sol) olarak bırakabilirsiniz, ancak kodu daha sonra genişletirseniz şu gibi koşullar ekleyebilirsiniz:

 if (scrollDirection == 0) { 
// metni sola hareket ettir 
} else if (scrollDirection == 1) { 
// metni sağa hareket ettir 
} else if (scrollDirection == 2) { 
// metni yukarı hareket ettir
 } else if (scrollDirection == 3) { 
// metni aşağı hareket ettir 
}
 

Bu makale için yalnızca ayarı belgeliyoruz. Tam uygulama, makalenin altında yüklenen kodun bir parçasıdır.

Özet

Proje 2, ESP32-S3 RGB LED Matrisinizi basit ama göz alıcı bir metin ekranına dönüştürür. Kodun üst kısmındaki yalnızca birkaç değişkeni düzenleyerek hızlıca şunları değiştirebilirsiniz:

• Hangi mesajın görüntülendiğini (scrollText).
• Metnin rengini (textRed, textGreen, textBlue).
• Matrisin parlaklığını (matrixBrightness).
• Kaydırma hızını (scrollDelayMs).
• Kaydırma yönünü (scrollDirection, kullanmayı seçerseniz).

Bu projenin tam kodu bu makalenin altında mevcuttur (web sitesi tarafından otomatik olarak yüklenir). Ayrıntılı adım adım yapılandırma ve kaydırılan metnin canlı gösterimi için videonun ilgili bölümünü izlediğinizden emin olun. Projeyi beğendiyseniz ve kendiniz yapmak istiyorsanız, kodun altında listelenen bağlı kuruluş bağlantılarından ESP32-S3 RGB LED Matrix modülünü de satın alabilirsiniz.

Görseller

ESP32 S3 Matrix

ESP32 S3 Matrix pin out

ESP32-S3_RGB_8x8_matrix1

ESP32-S3_RGB_8x8_matrix-2

ESP32-S3-Mtrix - Alway Up

ESP32 S3 Matrix

ESP32 S3 Matrix pin out

ESP32-S3_RGB_8x8_matrix1

ESP32-S3_RGB_8x8_matrix-2

ESP32-S3-Mtrix - Alway Up

/* 
  Project 2: Text scroll – ESP32-S3 RGB LED Matrix (Waveshare)

  This sketch displays the scrolling text on 8x8 matrix

  ▶️ Video Tutorial:
  https://youtu.be/JKLuYrRcLMI

  📚⬇️ Resources & Code Page:
  https://robojax.com/RJT829

  QMI8658_RGB_2
*/
#include <Arduino.h>
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>

// -------- LED MATRIX SETUP --------
#define MATRIX_PIN    14
#define MATRIX_WIDTH  8
#define MATRIX_HEIGHT 8

Adafruit_NeoMatrix matrix = Adafruit_NeoMatrix(
  MATRIX_WIDTH, MATRIX_HEIGHT, MATRIX_PIN,
  NEO_MATRIX_TOP + NEO_MATRIX_LEFT +
  NEO_MATRIX_ROWS + NEO_MATRIX_PROGRESSIVE,
  NEO_RGB + NEO_KHZ800
);

// =========================
// USER SETTINGS
// =========================

// Text to scroll
const char* MESSAGE = "ROBOJAX ";

// Brightness (0–255)
uint8_t BRIGHTNESS = 10;

// Scroll speed (milliseconds between steps)
// Smaller = faster
uint16_t SCROLL_DELAY = 80;

// Scroll direction
enum ScrollDir {
  SCROLL_LEFT,
  SCROLL_RIGHT,
  SCROLL_UP,
  SCROLL_DOWN
};

// Change this to set direction
ScrollDir DIRECTION = SCROLL_LEFT;

// Text color (set RGB here)
uint8_t COLOR_R = 255; 
uint8_t COLOR_G = 0;
uint8_t COLOR_B = 0;

// =========================
// INTERNAL STATE
// =========================
uint16_t textColor;
int16_t posX, posY;
int16_t textWidth, textHeight;
uint32_t lastStepTime = 0;

// Compute text size in pixels for default 5x7 font
void computeTextSize() {
  int16_t x1, y1;
  uint16_t w, h;
  matrix.getTextBounds((char*)MESSAGE, 0, 0, &x1, &y1, &w, &h);
  textWidth  = (int16_t)w;
  textHeight = (int16_t)h;
}

// Initialize starting position based on direction
void resetScrollPosition() {
  switch (DIRECTION) {
    case SCROLL_LEFT:
      // Start just off the right edge
      posX = matrix.width();
      posY = 0; // top row for 8x8
      break;

    case SCROLL_RIGHT:
      // Start just off the left edge
      posX = -textWidth;
      posY = 0;
      break;

    case SCROLL_UP:
      posX = 0;
      posY = matrix.height(); // start below bottom
      break;

    case SCROLL_DOWN:
      posX = 0;
      posY = -textHeight; // start above top
      break;
  }
}

// One scroll step
void stepScroll() {
  // Move position
  switch (DIRECTION) {
    case SCROLL_LEFT:
      posX--;
      if (posX < -textWidth) {
        posX = matrix.width();
      }
      break;

    case SCROLL_RIGHT:
      posX++;
      if (posX > matrix.width()) {
        posX = -textWidth;
      }
      break;

    case SCROLL_UP:
      posY--;
      if (posY < -textHeight) {
        posY = matrix.height();
      }
      break;

    case SCROLL_DOWN:
      posY++;
      if (posY > matrix.height()) {
        posY = -textHeight;
      }
      break;
  }

  // Draw frame
  matrix.fillScreen(0);
  matrix.setCursor(posX, posY);
  matrix.print(MESSAGE);
  matrix.show();
}

void setup() {
  matrix.begin();
  matrix.setBrightness(BRIGHTNESS);
  matrix.setTextWrap(false);       // No automatic wrapping
  matrix.setTextSize(1);           // Default 5x7 font
  textColor = matrix.Color(COLOR_R, COLOR_G, COLOR_B);
  matrix.setTextColor(textColor);

  computeTextSize();
  resetScrollPosition();

  matrix.fillScreen(0);
  matrix.show();
}

void loop() {
  uint32_t now = millis();
  if (now - lastStepTime >= SCROLL_DELAY) {
    lastStepTime = now;
    stepScroll();
  }
}