Proiect ESP32-S3 cu Matrice LED RGB 1 - Punct de bază

Proiect ESP32-S3 cu Matrice LED RGB 1 - Punct de bază

Proiectul 1 – Animație cu punct în mișcare și inimă pe matricea LED RGB ESP32-S3

În acest proiect începem cu cea mai simplă animație posibilă pe matricea LED RGB ESP32-S3: un singur punct care se deplasează pe afișajul RGB 8×8. Pe lângă aceasta, adăugăm o mică animație cu inimă, astfel încât să poți transforma placa într-un afișaj decorativ de dimensiuni reduse atunci când este alimentată. Acesta este un prim pas excelent pentru a te obișnui cu controlul pixelilor individuali, al culorilor și al vitezei de animație pe matrice.

Toate cele șase proiecte din această serie sunt demonstrate și explicate într-un singur videoclip. Același videoclip este încorporat pe această pagină, astfel încât să poți urmări explicația completă pas cu pas și demonstrația live a animațiilor cu punct în mișcare și inimă. Codul complet pentru acest proiect este încărcat automat mai jos, după articol, iar tu poți achiziționa modulul ESP32-S3 RGB LED Matrix din magazinele afiliate listate sub secțiunea de cod.

Dacă abia începi să folosești această placă, acest proiect este o modalitate perfectă de a:

• Verifica dacă placa ESP32-S3 și conexiunea USB funcționează corect.
• Confirma că matricea RGB 8×8 este conectată la pinul corect.
• Experimenta cu temporizarea de bază a animației, culoarea și luminozitatea.

Prezentare generală a modulului ESP32-S3 RGB LED Matrix

Placa folosită în acest proiect se bazează pe microcontrolerul ESP32-S3, combinat cu o matrice LED RGB 8×8 (64 de LED-uri RGB adresabile individual), un senzor de mișcare QMI8658C pe spate și un port USB pentru alimentare și programare.:contentReference[oaicite:0]{index=0}

Caracteristici principale ale acestui modul:

• ESP32-S3 microcontroler dual-core cu suport Wi-Fi și Bluetooth.
• Matrice LED RGB 8×8 (64 LED-uri RGB) pe partea frontală a plăcii, ideală pentru pictograme, text și jocuri mici.
• Accelerometru / senzor de mișcare QMI8658C pe partea din spate, astfel încât să poți detecta înclinarea, mișcarea și orientarea pentru proiecte interactive.
• Port USB atât pentru programare, cât și pentru alimentare.
• Pini accesibili în jurul marginilor, astfel încât placa poate fi folosită și ca un ESP32 obișnuit pentru alte proiecte IO.
• Butoane de boot și reset pentru a intra în modul de programare și a reporni sketch-ul.

În acest prim proiect folosim doar partea cu matricea LED a plăcii, dar același hardware este suficient de puternic pentru a rula afișaje de text, mesaje controlate prin web, jocuri controlate prin mișcare și multe altele — care sunt acoperite în celelalte proiecte ale acestei serii.

Proiecte acoperite în videoclip (Marcaje de timp)

Toate cele șase proiecte împărtășesc același videoclip YouTube. Marcajele de timp aproximative sunt:

• 00:00 – Introducere
• 02:01 – Instalarea plăcilor ESP32
• 03:32 – Instalarea bibliotecilor
• 05:32 – Proiectul 1: Punct în mișcare (și setări de bază pentru culoare / viteză)
• 11:11 – Proiectul 2: Derulare text
• 12:59 – Proiectul 3: Text HTTP
• 16:41 – Proiectul 4: Punct cu înclinare
• 18:55 – Proiectul 5: Săgeată în sus
• 20:02 – Proiectul 6: Jocul Țintă

Pentru o înțelegere cât mai bună, îți recomandăm cu tărie să urmărești videoclipul în timp ce parcurgi acest articol. Videoclipul arată comportamentul live al punctului și al inimii pe matrice, plus toți pașii din Arduino IDE.

Instalarea plăcilor ESP32 în Arduino IDE

Înainte de a încărca orice cod pe ESP32-S3, trebuie să instalezi pachetul de suport pentru plăcile ESP32 în Arduino IDE. În videoclip, acest lucru este demonstrat în secțiunea “instalarea plăcilor”.

Pași generali:

1. Deschide Arduino IDE și mergi la Fișier > Preferințe.
2. În câmpul “Additional Boards Manager URLs”, adaugă URL-ul oficial pentru plăcile ESP32.
3. Deschide Instrumente > Placă > Manager plăci…, caută ESP32 și instalează pachetul pentru plăcile ESP32.
4. După instalare, mergi la Instrumente > Placă și selectează intrarea corectă pentru modulul tău ESP32-S3 RGB Matrix.
5. Conectează placa prin USB și alege portul serial sub Instrumente > Port.

Dacă placa și portul corecte nu sunt selectate, sketch-ul tău nu se va încărca, chiar dacă codul este corect.

Instalarea NeoMatrix și a bibliotecilor necesare

Matricea LED folosește intern driverul Adafruit NeoPixel, iar pentru desenarea 2D mai ușoară folosim biblioteca Adafruit NeoMatrix. Instalarea NeoMatrix va aduce automat și dependențele necesare.

NeoMatrix și dependențe

Instalează următoarele din Managerul de biblioteci:

• Adafruit NeoMatrix
• Adafruit NeoPixel
• Adafruit GFX Library

În Managerul de biblioteci:

1. Deschide Sketch > Include Library > Manage Libraries….
2. Caută Adafruit NeoMatrix și dă clic pe Install.
3. Permite IDE-ului să instaleze toate dependențele sugerate (Adafruit GFX și Adafruit NeoPixel).

Biblioteca pentru senzorul de mișcare QMI8658C (pentru proiectele ulterioare)

Proiectul 1 nu folosește direct accelerometrul, dar este o idee bună să instalezi acum biblioteca pentru senzorul de mișcare, deoarece va fi necesară pentru Proiectele 4, 5 și 6.

Din Managerul de biblioteci:

1. Caută biblioteca QMI8658 după numele autorului.
2. Instalează biblioteca astfel încât să apară sub Fișier > Exemple pentru testare rapidă.

Proiectul 1 – Setări cod (Punct în mișcare și inimă)

Sketch-ul complet care rulează Proiectul 1 este încărcat automat mai jos pe site, sub acest articol. Aici ne concentrăm doar pe setările cheie pe care probabil le vei modifica: pinul, numărul de pixeli, luminozitatea, culoarea și viteza animației. Pentru animația cu inimă, arătăm și cum să controlezi culoarea și dacă inima este plină sau doar conturată.

Pinul LED și Numărul de Pixeli

Pe acest modul, matricea RGB 8×8 este conectată la GPIO 14 al ESP32-S3. Numărul total de pixeli este 64 (8 × 8). În codul tău, ar trebui să vezi ceva similar cu:

 
// Pin conectat la matricea RGB 8×8 
const int MATRIX_PIN = 14;
 // trebuie să fie 14 pe acest modul 
// Numărul total de LED-uri (matrice 8 × 8) 
const int NUMPIXELS = 64; // modifică doar dacă folosești o matrice de altă dimensiune 

Dacă din greșeală lași NUMPIXELS la 16 (din exemplul original NeoPixel), doar un sfert din matrice va fi folosit, iar animația nu va umple întregul ecran 8×8.

Ordinea Culorilor și Tipul LED

Diferite benzi și matrice LED pot folosi ordine diferite ale culorilor (de exemplu, GRB în loc de RGB). Matricea de pe această placă așteaptă ordinea RGB. În constructorul NeoPixel sau NeoMatrix, asigură-te că tipul de culoare este setat corect:

 // Exemplu pentru un obiect de tip NeoPixel: 
Adafruit_NeoPixel pixels( NUMPIXELS, MATRIX_PIN, NEO_RGB + NEO_KHZ800 // asigură-te că se potrivește cu ordinea culorilor matricei ); 

Dacă observi că roșu și verde sunt inversate pe afișaj, verifică mai întâi această linie și corectează ordinea culorilor.

Viteza Animației (Întârzierea între Pași)

Viteza punctului în mișcare este de obicei controlată de o valoare simplă de întârziere în milisecunde. O întârziere mai mică înseamnă mișcare mai rapidă; o întârziere mai mare înseamnă mișcare mai lentă. Caută o variabilă similară cu:

 
// Întârziere între mișcările punctului (în milisecunde)
 int dotDelayMs = 50; // 50 ms este destul de rapid 

Ajustări tipice:

• Set dotDelayMs = 20; pentru un punct care se mișcă foarte rapid.
• Set dotDelayMs = 100; sau mai mare pentru o animație lentă și calmă.

În funcția loop(), această valoare este de obicei transmisă către delay(dotDelayMs); după fiecare actualizare a cadrului.

Culoarea Punctului și Luminozitatea

Culoarea RGB a punctului în mișcare este controlată de trei valori în intervalul 0–255 (roșu, verde, albastru). De exemplu:

 
// Culoarea punctului (R, G, B) de la 0–255 uint8_t dotRed = 255; // roșu complet 
uint8_t dotGreen = 0; // fără verde 
uint8_t dotBlue = 0; // fără albastru 

Aceasta ar produce un punct roșu strălucitor. Câteva combinații utile:

• Roșu pur: (255, 0, 0)
• Verde pur: (0, 255, 0)
• Albastru pur: (0, 0, 255)
• Galben: (255, 255, 0)
• Alb: (255, 255, 255)

Luminozitatea generală este adesea controlată de o funcție separată de luminozitate:

 
// Luminozitatea generală a matricei (0–255) 
uint8_t matrixBrightness = 40; // menține-o scăzută pentru a evita prea multă strălucire // În setup(): matrix.setBrightness(matrixBrightness); 

O valoare în jur de 30–60 este de obicei confortabilă pentru utilizare în interior.

Setările Formei Inimii

Pe lângă punctul în mișcare, poți afișa o inimă mică pe matrice când placa pornește prima dată. Codul de exemplu al articolului (încărcat mai jos) include setări similare cu:

 
// Culoarea inimii (inimă plină) 
uint8_t heartRed = 255; 
uint8_t heartGreen = 0; 
uint8_t heartBlue = 0; 
// Opțional: moduri curcubeu sau contur 
bool showOutlinedHeart = false; 
// true = doar contur 
bool useRainbowHeart = false; 
// true = schimbă culorile în timp 

Utilizare tipică:

• Set showOutlinedHeart = false; și useRainbowHeart = false; pentru o inimă roșie plină.
• Set showOutlinedHeart = true; pentru a afișa doar conturul inimii.
• Set useRainbowHeart = true; pentru a schimba continuu culoarea inimii printr-un efect curcubeu.

Inima este desenată folosind funcțiile de coordonate NeoMatrix din codul de mai jos al articolului. Trebuie doar să modifici variabilele de mai sus pentru a-i personaliza aspectul.

Rezumat

Proiectul 1 îți oferă un punct de plecare simplu, dar puternic, cu Matricea LED RGB ESP32-S3: înveți cum să adresezi toți cei 64 de pixeli, să controlezi culoarea, să ajustezi luminozitatea și să setezi viteza animației. Vezi, de asemenea, cât de ușor este să treci de la un punct în mișcare la o inimă statică sau animată pe același hardware.

Asigură-te că urmărești videoclipul complet încorporat pe această pagină pentru o demonstrație pas cu pas a animațiilor cu punct și inimă, împreună cu celelalte cinci proiecte. Codul sursă complet este disponibil mai jos, sub acest articol, și poți sprijini proiectele viitoare achiziționând modulul prin linkurile afiliate listate sub secțiunea de cod.

Imagini

ESP32 S3 Matrix pin out

ESP32 S3 Matrix displaying green heart

ESP32 S3 Matrix displaying rainbow heart

ESP32-S3 RGB Matrix- Mobile Phone Text

ESP32-S3-Mtrix - Alway Up

ESP32 S3 Matrix pin out

ESP32 S3 Matrix displaying green heart

ESP32 S3 Matrix displaying rainbow heart

ESP32-S3 RGB Matrix- Mobile Phone Text

ESP32-S3-Mtrix - Alway Up

/* 
  Project 1: the Dot – ESP32-S3 RGB LED Matrix (Waveshare)

  dialysis a dot on scree and moves it
  
  ▶️ Video Tutorial:
  https://youtu.be/JKLuYrRcLMI

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

  QMI8658_RGB_2
*/

#include <Adafruit_NeoPixel.h>
#ifdef __AVR__
 #include <avr/power.h> // Required for 16 MHz Adafruit Trinket
#endif

// Which pin on the Arduino is connected to the NeoPixels?
#define PIN        14 // On Trinket or Gemma, suggest changing this to 1

// How many NeoPixels are attached to the Arduino?
#define NUMPIXELS 64 // Popular NeoPixel ring size

// When setting up the NeoPixel library, we tell it how many pixels,
// and which pin to use to send signals. Note that for older NeoPixel
// strips you might need to change the third parameter -- see the
// strandtest example for more information on possible values.
Adafruit_NeoPixel pixels(NUMPIXELS, PIN, NEO_RGB + NEO_KHZ800);

#define DELAYVAL 50 // Time (in milliseconds) to pause between pixels

void setup() {
  // These lines are specifically to support the Adafruit Trinket 5V 16 MHz.
  // Any other board, you can remove this part (but no harm leaving it):
#if defined(__AVR_ATtiny85__) && (F_CPU == 16000000)
  clock_prescale_set(clock_div_1);
#endif
  // END of Trinket-specific code.

  pixels.begin(); // INITIALIZE NeoPixel strip object (REQUIRED)
}

void loop() {
  pixels.clear(); // Set all pixel colors to 'off'

  // The first NeoPixel in a strand is #0, second is 1, all the way up
  // to the count of pixels minus one.
  for(int i=0; i<NUMPIXELS; i++) { // For each pixel...

    // pixels.Color() takes RGB values, from 0,0,0 up to 255,255,255
    // Here we're using a moderately bright green color:
    pixels.setPixelColor(i, pixels.Color(255, 255, 0));

    pixels.show();   // Send the updated pixel colors to the hardware.

    delay(DELAYVAL); // Pause before next pass through loop
    pixels.clear();
  }



}