ESP32-S3 RGB LED матрица жобасы 2 - Жылжымалы мәтін

ESP32-S3 RGB LED матрица жобасы 2 - Жылжымалы мәтін

Жоба 2 – ESP32-S3 RGB LED матрицасындағы мәтінді айналдыру

Бұл жобада біз ESP32-S3 RGB LED матрицасын шағын мәтіндік баннерге айналдырамыз. Қысқа хабарлама (мысалы, Robojax) 8×8 RGB дисплейінде айналады және мәтінді, түсті, жарықтылықты және айналу жылдамдығын кодта тікелей оңай өзгертуге болады. Бұл қарапайым хабарландырулар, атау белгілері немесе шағын күй хабарламалары үшін өте пайдалы.

Бұл сериядағы барлық алты жоба бір YouTube бейнежазбасында көрсетілген және түсіндірілген. Сол бейне осы бетке ендірілген, сондықтан мәтіннің айналуы нақты уақытта қалай көрінетінін және әрбір параметрдің анимацияға қалай әсер ететінін дәл көре аласыз. Бұл жобаның толық коды мақаланың астында автоматты түрде жүктеледі, ал ESP32-S3 RGB LED матрица модулін код бөлімінің астында көрсетілген серіктес дүкендерден сатып ала аласыз.

Бұл жоба 1-жобаның негіздеріне (қозғалатын нүкте және түс басқару) сүйенеді және NeoMatrix кітапханасын пайдаланып мәтінді көрсету мен айналдыруды қосады.

ESP32-S3 RGB LED матрица модуліне шолу

Аппараттық құрал барлық алты жобада бірдей: Wi-Fi және Bluetooth қолдауы бар ESP32-S3 микроконтроллері, 8×8 RGB LED матрицасы (64 адрестік RGB жарықдиоды), QMI8658C акселерометрі, USB порты және қолжетімді IO түйреуіштері.:contentReference[oaicite:0]{index=0}

• ESP32-S3 – кеңейтілген жобаларға арналған Wi-Fi/BLE қолдауы бар негізгі процессор.
• 8×8 RGB матрицасы – белгішелер, мәтін және анимациялар үшін 64 RGB жарықдиоды.
• QMI8658C акселерометрі – кейінгі жобаларда еңкейту мен бағдарлау үшін қолданылады.
• USB порты – Arduino IDE арқылы қуаттандыру және бағдарламалау үшін қолданылады.
• Ашық түйреуіштер – тақтаны басқа IO үшін қарапайым ESP32 ретінде пайдалануға мүмкіндік береді.
• Boot / Reset түймелері – микробағдарламаны жүктеу және скетчтерді қайта іске қосу үшін.

2-жобада біз негізінен матрицаға және NeoMatrix мәтін функцияларына назар аударамыз. Акселерометр әлі қолданылмайды, бірақ сол тақта кейінгі барлық өзара әрекеттесу және ойын жобаларын да өңдей алады.

Бейнеде қамтылған жобалар (уақыт белгілері)

Осы мақаламен бірге жүретін бейне барлық алты жобаны қамтиды. Шамамен уақыт белгілері:

• 00:00 – Кіріспе
• 02:01 – ESP32 тақталарын орнату
• 03:32 – Кітапханаларды орнату
• 05:32 – 1-жоба: Қозғалатын нүкте
• 11:11 – 2-жоба: Мәтінді айналдыру
• 12:59 – 3-жоба: HTTP мәтіні
• 16:41 – 4-жоба: Еңкейту нүктесі
• 18:55 – 5-жоба: Жоғары көрсеткі
• 20:02 – 6-жоба: Нысана ойыны

Осы мақаланы оқығанда бейнені көруге кеңес береміз. Ол мәтіннің LED матрицасында тірі айналуын көрсетеді және Arduino IDE-дегі барлық қадамдарды түсіндіреді.

Arduino IDE-де ESP32 тақталарын орнату

Мәтінді айналдыру кодын іске қоспас бұрын, Arduino IDE-де ESP32 қолдауы орнатылғанына көз жеткізіңіз:

1. File > Preferences тармағын ашып, ESP32 тақталарының URL мекенжайын “Additional Boards Manager URLs” бөліміне қосыңыз.
2. Tools > Board > Boards Manager… тармағына өтіп, ESP32 іздеңіз және ресми ESP32 пакетін орнатыңыз.
3. Tools > Board бөлімінен ESP32-S3 RGB Matrix тақтаңызды таңдаңыз.
4. Модульді USB арқылы қосыңыз және Tools > Port бөлімінен дұрыс COM/сериялық портты таңдаңыз.

Тақта түрі немесе порт дұрыс болмаса, скетч жүктелмейді.

NeoMatrix және қажетті кітапханаларды орнату

Мәтінді айналдыру Adafruit NeoMatrix және оның тәуелділіктері арқылы жүзеге асырылады. Бейнеде олар Library Manager арқылы орнатылады.

Сізге қажет болады:

• Adafruit NeoMatrix
• Adafruit NeoPixel
• Adafruit GFX Library

1. Sketch > Include Library > Manage Libraries… тармағын ашыңыз.
2. Adafruit NeoMatrix іздеп, Install түймесін басыңыз.
3. Сұралғанда, Adafruit GFX және Adafruit NeoPixel тәуелділіктерін орнатуға рұқсат етіңіз.

Орнату сәтті болса, File > Examples > Adafruit NeoMatrix және File > Examples > Adafruit NeoPixel бөлімдерінде мысал скетчтерін көруіңіз керек.

2-жоба – Код параметрлері (Мәтінді айналдыру)

Толық мәтінді айналдыру скетчі веб-сайтта осы мақаланың астында автоматты түрде жүктеледі. Мұнда біз тек өңдегіңіз келетін конфигурация мәндеріне назар аударамыз: түйреуіш, матрица өлшемі, жарықтылық, мәтін жолы, түс, айналу жылдамдығы және қосымша бағыт.

Төмендегі барлық үзінділер скетчтің жоғарғы жағындағы конфигурация бөлімінен алынған, сондықтан негізгі логикаға қол тигізбестен әрекетті жылдам реттей аласыз.

Матрица түйреуіші және өлшемі

1-жобадағыдай, RGB матрицасы GPIO 14-ке қосылған және 64 жарықдиодтан (8×8) тұрады. Осы екі жолдың модуліңізге сәйкес келетініне көз жеткізіңіз:

 // 8×8 RGB матрицасына қосылған түйреуіш 
const int MATRIX_PIN = 14; // бұл модульде 14 болуы керек // Матрица өлшемі (ені мен биіктігі)
 const int MATRIX_WIDTH = 8; 
const int MATRIX_HEIGHT = 8; 

NeoMatrix кітапханасынан мысал көшірсеңіз, ол басқа түйреуіш немесе өлшем пайдалануы мүмкін; оларды әрқашан осы тақтаға сәйкес өзгертіңіз.

Мәтіннің жарықтылығы

Жарықтылық әдетте 0 мен 255 аралығындағы мәнмен басқарылады, мұнда 0 өшірулі, ал 255 максималды жарықтылық. Орташа мән әдетте жеткілікті:

// Матрицаның жалпы жарықтығы (0–255) 
uint8_t matrixBrightness = 40; // ыңғайлы ішкі жарықтық // 
setup(): 
matrix.setBrightness(matrixBrightness); 

Егер панельді жарық ортада немесе қысқа уақытқа қолдансаңыз, бұл мәнді арттыруға болады, бірақ дисплейге жақын болсаңыз, тым жоғары қоюдан аулақ болыңыз.

Айналдыруға арналған мәтін

Нақты хабарлама жол ретінде сақталады. Бейнедегі мысал мәтін Robojax. Оны өзіңізге ұнайтын кез келген қысқа жапсырмаға немесе хабарламаға өзгертуге болады:

 // 8×8 матрицада айналдырылатын мәтін const char scrollText[] = "Robojax";
 // мұны өз хабарламаңызға өзгертіңіз 

Есіңізде болсын, бұл тек 8×8 матрица, сондықтан өте ұзын хабарламалар айналдыруға көп уақыт алады және оқу қиын болуы мүмкін.

Мәтін түсі (RGB мәндері)

Айналдырылатын мәтіннің түсі қызыл, жасыл және көк компоненттерімен (0–255) орнатылады. Мысалы, таза қызыл (255, 0, 0), таза жасыл (0, 255, 0), ал таза көк (0, 0, 255). Скетчте сіз осыған ұқсас нәрсені көресіз:

 // Мәтін түсі (R, G, B) uint8_t textRed = 255; // қызыл компонент uint8_t textGreen = 0; // жасыл компонент uint8_t textBlue = 0; // көк компонент 

Түсті өзгерту үшін:

• Сары: textRed = 255; textGreen = 255; textBlue = 0;
• Көгілдір: textRed = 0; textGreen = 255; textBlue = 255;
• Ақ: textRed = 255; textGreen = 255; textBlue = 255;

Бейнеде RGB мәндерін табу үшін онлайн түс таңдағышты қолдану және оларды кодқа енгізу көрсетілген.:contentReference[oaicite:1]{index=1}

Айналдыру жылдамдығы (кадрлар арасындағы кідіріс)

Айналдыру жылдамдығы әрбір жаңарту қадамы арасындағы миллисекундпен берілген кідіріс мәнімен басқарылады. Кішірек мән мәтінді жылдамырақ жылжытады; үлкенірек мән оны баяулатады. Скетчте сіз осындай айнымалыны табуыңыз керек:

// Айналдыру қадамдары арасындағы кідіріс (миллисекундпен) int scrollDelayMs = 50; 
// кішірек = жылдамырақ, үлкенірек = баяуырақ 

Мысалдар:

• scrollDelayMs = 20; → жылдам айналдыру.
• scrollDelayMs = 50; → орташа жылдамдық (бейнедегідей).
• scrollDelayMs = 100; немесе одан көп → баяу, оқуға оңай айналдыру.

loop() ішінде бұл мән мәтін позициясының әрбір қайта сызылуынан кейін delay(scrollDelayMs); шақыруында қолданылады.

Айналдыру бағыты (Қосымша)

“Негізгі мәтінді айналдыру” жобасында біз әдетте солға айналдырамыз, бірақ кейінірек басқа бағыттармен (солға, оңға, жоғары, төмен) тәжірибе жасау үшін символдық бағыт айнымалысын анықтау пайдалы.

Жалпы үлгі:

 // Айналдыру бағытын таңдауыш // 0 = солға, 1 = оңға, 2 = жоғары, 3 = төмен 
int scrollDirection = 0; // әдепкі: солға айналдыру 

Негізгі цикл содан кейін scrollDirection мәнін тексереді және мәтінді таңдалған бағытта жылжытады. 2-жоба үшін оны 0 (солға) күйінде қалдыруға болады, бірақ кейінірек скетчті кеңейтсеңіз, келесідей шарттар қосуға болады:

 if (scrollDirection == 0) { 
// мәтінді солға жылжыту 
} else if (scrollDirection == 1) { 
// мәтінді оңға жылжыту 
} else if (scrollDirection == 2) { 
// мәтінді жоғары жылжыту
 } else if (scrollDirection == 3) { 
// мәтінді төмен жылжыту 
}
 

Бұл мақала үшін біз тек параметрді құжаттаймыз. Толық іске асыру мақаланың астында жүктелген кодтың бөлігі болып табылады.

Қорытынды

2-жоба ESP32-S3 RGB LED матрицаңызды қарапайым, бірақ көз тартатын мәтін дисплейіне айналдырады. Кодтың басындағы бірнеше айнымалыны өңдеу арқылы сіз тез өзгерте аласыз:

• Қандай хабарлама көрсетілетінін (scrollText).
• Мәтіннің түсін (textRed, textGreen, textBlue).
• Матрицаның жарықтығын (matrixBrightness).
• Айналдыру жылдамдығын (scrollDelayMs).
• Айналдыру бағытын (scrollDirection, егер оны қолдануды таңдасаңыз).

Бұл жобаның толық скетчі осы мақаланың астында қолжетімді (веб-сайт арқылы автоматты түрде жүктеледі). Егжей-тегжейлі қадамдық конфигурация және айналдырылатын мәтіннің тікелей демонстрациясы үшін бейненің сәйкес бөлігін көруді ұмытпаңыз. Егер жоба ұнаса және оны өзіңіз жасағыңыз келсе, кодтың астында көрсетілген серіктестік сілтемелерден ESP32-S3 RGB LED Matrix модулін сатып ала аласыз.

Суреттер

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();
  }
}