ESP32-S3 RGB LED Matrix projekat 1 - Osnovna tačka

ESP32-S3 RGB LED Matrix projekat 1 - Osnovna tačka

Projekat 1 – Animacija pokretne tačke i srca na ESP32-S3 RGB LED matrici

U ovom projektu počinjemo s najjednostavnijom mogućom animacijom na ESP32-S3 RGB LED matrici: jednom tačkom koja se kreće preko 8×8 RGB ekrana. Pored toga, dodajemo malu animaciju srca kako biste ploču mogli pretvoriti u mali dekorativni ekran kada je uključena. Ovo je odličan prvi korak ka upoznavanju s kontrolisanjem pojedinačnih piksela, boja i brzine animacije na matrici.

Svih šest projekata u ovoj seriji prikazano je i objašnjeno u jednom videu. Isti video je ugrađen na ovoj stranici, tako da možete pogledati cjelokupno objašnjenje korak po korak i demonstraciju uživo animacija pokretne tačke i srca. Kompletan kod za ovaj projekat automatski se učitava ispod članka, a modul ESP32-S3 RGB LED Matrix možete kupiti iz affiliate prodavnica navedenih ispod sekcije s kodom.

Ako tek počinjete s ovom pločom, ovaj projekat je savršen način da:

• Provjerite da li vaša ESP32-S3 ploča i USB veza rade.
• Potvrdite da je 8×8 RGB matrica povezana na ispravan pin.
• Eksperimentišete s osnovnim tajmingom animacije, bojom i svjetlinom.

Pregled ESP32-S3 RGB LED Matrix modula

Ploča korištena u ovom projektu zasnovana je na ESP32-S3 mikrokontroleru, kombinovanom s 8×8 RGB LED matricom (64 pojedinačno adresabilne RGB LED diode), QMI8658C senzorom pokreta na poleđini i USB priključkom za napajanje i programiranje.:contentReference[oaicite:0]{index=0}

Ključne karakteristike ovog modula:

• ESP32-S3 dvojezgarni mikrokontroler s Wi-Fi i Bluetooth podrškom.
• 8×8 RGB LED matrica (64 RGB LED diode) na prednjoj strani ploče, idealna za ikone, tekst i male igre.
• QMI8658C akcelerometar / senzor pokreta na poleđini, tako da možete detektovati nagib, pokret i orijentaciju za interaktivne projekte.
• USB priključak za programiranje i napajanje.
• Pristupačni pinovi oko ivica, tako da se ploča i dalje može koristiti kao običan ESP32 za druge IO projekte.
• Boot i reset dugmad za ulazak u programski režim i ponovno pokretanje skice.

U ovom prvom projektu koristimo samo LED matricu ploče, ali isti hardver je dovoljno moćan za prikaz teksta, web-kontrolisane poruke, igre kontrolisane pokretom i još mnogo toga — što je obrađeno u ostalim projektima ove serije.

Projekti obrađeni u videu (Vremenske oznake)

Svih šest projekata dijeli isti YouTube video. Približne vremenske oznake su:

• 00:00 – Uvod
• 02:01 – Instaliranje ESP32 ploča
• 03:32 – Instaliranje biblioteka
• 05:32 – Projekat 1: Pokretna tačka (i osnovne postavke boje / brzine)
• 11:11 – Projekat 2: Tekst skrol
• 12:59 – Projekat 3: HTTP tekst
• 16:41 – Projekat 4: Tačka na nagib
• 18:55 – Projekat 5: Strelica gore
• 20:02 – Projekat 6: Igra ciljanja

Za najbolje razumijevanje, snažno vam preporučujemo da gledate video dok pratite ovaj članak. Video prikazuje ponašanje tačke i srca uživo na matrici, plus sve korake unutar Arduino IDE-a.

Instaliranje ESP32 ploča u Arduino IDE

Prije nego što prenesete bilo koji kod na ESP32-S3, morate instalirati paket podrške za ESP32 ploče u Arduino IDE-u. U videu je ovo prikazano u sekciji “instaliranje ploča”.

Opći koraci:

1. Otvorite Arduino IDE i idite na File > Preferences.
2. U polje “Additional Boards Manager URLs” dodajte zvanični URL za ESP32 ploče.
3. Otvorite Tools > Board > Boards Manager…, potražite ESP32 i instalirajte paket za ESP32 ploče.
4. Nakon instalacije, idite na Tools > Board i odaberite ispravan unos za vaš ESP32-S3 RGB LED Matrix modul.
5. Povežite ploču putem USB-a i odaberite njen serijski port pod Tools > Port.

Ako ispravna ploča i port nisu odabrani, vaša skica se neće prenijeti, čak i ako je vaš kod ispravan.

Instaliranje NeoMatrix i potrebnih biblioteka

LED matrica interno koristi Adafruit NeoPixel drajver, a za lakše 2D crtanje koristimo Adafruit NeoMatrix biblioteku. Instaliranje NeoMatrix automatski će povući zavisnosti.

NeoMatrix i zavisnosti

Instalirajte sljedeće iz Library Manager-a:

• Adafruit NeoMatrix
• Adafruit NeoPixel
• Adafruit GFX Library

U Library Manager-u:

1. Otvorite Sketch > Include Library > Manage Libraries….
2. Potražite Adafruit NeoMatrix i kliknite na Install.
3. Dozvolite IDE-u da instalira sve predložene zavisnosti (Adafruit GFX i Adafruit NeoPixel).

QMI8658C biblioteka za senzor pokreta (Za kasnije projekte)

Projekat 1 ne koristi akcelerometar direktno, ali je dobra ideja da instalirate biblioteku za senzor pokreta sada jer će biti potrebna za Projekte 4, 5 i 6.

Iz Library Manager-a:

1. Potražite QMI8658 biblioteku po imenu autora.
2. Instalirajte biblioteku tako da se pojavi pod File > Examples za brzo testiranje.

Projekat 1 – Postavke koda (Pokretna tačka i srce)

Kompletna skica koja pokreće Projekat 1 automatski se učitava ispod ovog članka na web stranici. Ovdje se fokusiramo samo na ključne postavke koje ćete vjerovatno mijenjati: pin, broj piksela, svjetlinu, boju i brzinu animacije. Za animaciju srca također pokazujemo kako kontrolisati boju i da li je srce popunjeno ili samo obrisano.

LED Pin i Broj Piksela

Na ovom modulu, 8×8 RGB matrica je povezana na GPIO 14 ESP32-S3. Ukupan broj piksela je 64 (8 × 8). U vašem kodu trebali biste vidjeti nešto slično:

 
// Pin povezan na 8×8 RGB matricu 
const int MATRIX_PIN = 14;
 // mora biti 14 na ovom modulu 
// Ukupan broj LED dioda (8 × 8 matrica) 
const int NUMPIXELS = 64; // promijenite samo ako koristite drugu veličinu matrice 

Ako slučajno ostavite NUMPIXELS na 16 (iz originalnog NeoPixel primjera), samo će četvrtina matrice biti iskorištena i animacija neće ispuniti cijeli 8×8 ekran.

Redoslijed Boja i Tip LED-a

Različite LED trake i matrice mogu koristiti različite redoslijede boja (na primjer, GRB umjesto RGB). Matrica na ovoj ploči očekuje RGB redoslijed. U NeoPixel ili NeoMatrix konstruktoru, provjerite da je tip boje ispravno postavljen:

 // Primjer za NeoPixel-stil objekat: 
Adafruit_NeoPixel pixels( NUMPIXELS, MATRIX_PIN, NEO_RGB + NEO_KHZ800 // provjerite da odgovara redoslijedu boja matrice ); 

Ako primijetite da su crvena i zelena zamijenjene na displeju, prvo provjerite ovu liniju i ispravite redoslijed boja.

Brzina Animacije (Kašnjenje Između Koraka)

Brzina pokretne tačke obično se kontroliše jednostavnom vrijednošću kašnjenja u milisekundama. Manje kašnjenje znači brže kretanje; veće kašnjenje znači sporije kretanje. Potražite varijablu sličnu:

 
// Kašnjenje između pomjeranja tačke (u milisekundama)
 int dotDelayMs = 50; // 50 ms je prilično brzo 

Uobičajena podešavanja:

• Postavite dotDelayMs = 20; za vrlo brzu pokretnu tačku.
• Postavite dotDelayMs = 100; ili više za sporu, mirnu animaciju.

U funkciji loop(), ova vrijednost se obično prosljeđuje funkciji delay(dotDelayMs); nakon svakog ažuriranja okvira.

Boja Tačke i Svjetlina

RGB boja pokretne tačke kontroliše se pomoću tri vrijednosti u rasponu 0–255 (crvena, zelena, plava). Na primjer:

 
// Boja tačke (R, G, B) od 0–255 uint8_t dotRed = 255; // puna crvena 
uint8_t dotGreen = 0; // nema zelene 
uint8_t dotBlue = 0; // nema plave 

Ovo bi proizvelo svijetlo crvenu tačku. Neke korisne kombinacije:

• Čista crvena: (255, 0, 0)
• Čista zelena: (0, 255, 0)
• Čista plava: (0, 0, 255)
• Žuta: (255, 255, 0)
• Bijela: (255, 255, 255)

Ukupna svjetlina se često kontroliše zasebnom funkcijom za svjetlinu:

 
// Ukupna svjetlina matrice (0–255) 
uint8_t matrixBrightness = 40; // držite je niskom da izbjegnete previše odsjaja // U setup(): matrix.setBrightness(matrixBrightness); 

Vrijednost oko 30–60 obično je ugodna za upotrebu u zatvorenom prostoru.

Postavke Oblika Srca

Osim pokretne tačke, možete prikazati malo srce na matrici kada se ploča prvi put uključi. Uzorak koda iz članka (učitan ispod) uključuje postavke slične:

 
// Boja srca (popunjeno srce) 
uint8_t heartRed = 255; 
uint8_t heartGreen = 0; 
uint8_t heartBlue = 0; 
// Opcionalno: dugin ili obrisani modovi 
bool showOutlinedHeart = false; 
// true = samo obris 
bool useRainbowHeart = false; 
// true = ciklično mijenjanje boja tokom vremena 

Uobičajena upotreba:

• Postavite showOutlinedHeart = false; i useRainbowHeart = false; za popunjeno crveno srce.
• Postavite showOutlinedHeart = true; da prikažete samo obris srca.
• Postavite useRainbowHeart = true; da neprekidno mijenjate boju srca kroz dugin efekat.

Srce se crta pomoću NeoMatrix koordinatnih funkcija unutar koda ispod članka. Trebate samo promijeniti gornje varijable da prilagodite njegov izgled.

Sažetak

Projekat 1 vam daje jednostavnu ali moćnu polaznu tačku sa ESP32-S3 RGB LED matricom: naučite kako adresirati svih 64 piksela, kontrolisati boju, podesiti svjetlinu i postaviti brzinu animacije. Također vidite kako je lako preći sa pokretne tačke na statično ili animirano srce na istom hardveru.

Obavezno pogledajte cijeli video ugrađen na ovoj stranici za kompletnu, korak-po-korak demonstraciju animacija pokretne tačke i srca, zajedno sa preostalih pet projekata. Kompletni izvorni kod dostupan je ispod ovog članka, a možete podržati buduće projekte kupovinom modula putem affiliate linkova navedenih ispod sekcije s kodom.

Images

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



}