Ovaj tutorijal je dio: ESP32-S3 RGB LED matrica
Kul projekat za kreiranje zabave i praktičnih aplikacija korištenjem ESP32-S3 RGB Matrix modula. Linkovi do drugih videa nalaze se ispod ovog članka.
ESP32-S3 RGB LED Matrix projekat 4 - Tilt tačka
Projekat 4 – Tilt Dot (Pomjerite tačku naginjanjem ESP32-S3 RGB LED Matrix modula)
Projekat 4 predstavlja senzor pokreta ugrađen u ESP32-S3 RGB LED Matrix modul. Umjesto automatskog pomjeranja tačke (kao u Projektu 1) ili skrolovanja teksta (Projekti 2 i 3), ovaj projekat vam omogućava da kontrolišete poziciju tačke jednostavnim naginjanjem ploče. Tačka se glatko kreće preko 8×8 RGB displeja na osnovu očitanja uživo sa QMI8658C akcelerometra na poleđini modula.
Svih šest projekata u ovoj seriji prikazano je u jednom YouTube videu. Isti video je ugrađen na ovoj stranici, tako da možete tačno vidjeti kako se tačka kreće u realnom vremenu dok se ploča naginje. Kompletan kod za ovaj projekat se automatski učitava ispod članka, a affiliate linkovi za kupovinu modula pojavljuju se ispod sekcije s kodom.


Pregled ESP32-S3 RGB LED Matrix modula
Ovaj projekat koristi ESP32-S3 RGB LED Matrix modul, koji uključuje:

- ESP32-S3 mikrokontroler sa Wi-Fi i Bluetooth podrškom
- 8×8 RGB LED matricu (64 pojedinačno adresabilne LED diode)
- QMI8658C akcelerometar na poleđini za detekciju nagiba i pokreta
- USB port za programiranje i napajanje
- Boot / Reset dugmad
- Upotrebljive GPIO pinove za buduća proširenja
QMI8658C senzor očitava X, Y i Z vrijednosti ubrzanja i orijentacije, omogućavajući tački da se pomjera gore/dolje/lijevo/desno na osnovu toga kako je ploča nagnuta.

Projekti prikazani u videu (Vremenske oznake)
- 00:00 – Uvod
- 02:01 – Instalacija ESP32 ploča
- 03:32 – Instalacija biblioteka
- 05:32 – Projekat 1: Pokretna tačka
- 11:11 – Projekat 2: Skrolovanje teksta
- 12:59 – Projekat 3: HTTP tekst
- 16:41 – Projekat 4: Tilt Dot (ovaj projekat)
- 18:55 – Projekat 5: Strelica gore
- 20:02 – Projekat 6: Igra ciljanja
Gledanje demonstracije naginjanja u videu se toplo preporučuje, jer možete vidjeti kako tačka glatko reaguje na orijentaciju ploče.

Instalacija ESP32 ploča u Arduino IDE
Ako ste završili bilo koji raniji projekat, podrška za ploče je već instalirana. U suprotnom, slijedite ove korake:
- Otvori
File > Preferences→ Dodaj ESP32 Boards URL. - Idi na
Tools > Board > Boards Manager…i instaliraj ESP32. - Odaberi svoju ESP32-S3 ploču pod
Tools > Board. - Odaberi ispravan COM port pod
Tools > Port.
Instalacija potrebnih biblioteka
Ovaj projekat zahtijeva sljedeće biblioteke:
Adafruit NeoMatrixAdafruit NeoPixelAdafruit GFX LibraryQMI8658(senzor pokreta)
Instalirajte ih u Library Manageru:
- Otvori
Sketch > Include Library > Manage Libraries…. - Pretraži Adafruit NeoMatrix → Instaliraj.
- Dozvoli automatsku instalaciju Adafruit GFX i Adafruit NeoPixel.
- Pretraži QMI8658 prema navedenom autoru → Instaliraj.
Kako funkcioniše Projekat 4
QMI8658C senzor kontinuirano pruža podatke o ubrzanju duž X, Y i Z osa. Za ovaj projekat koristimo samo X i Y ose da odredimo:
- Koliko daleko pomjeriti tačku lijevo ili desno (X osa)
- Koliko daleko pomjeriti tačku gore ili dolje (Y osa)
Vrijednosti senzora se mapiraju u koordinatni opseg od 0 do 7 (za 8×8 LED matricu). Pozicija tačke se ažurira mnogo puta u sekundi, dajući glatki efekat klizanja dok naginjete modul.
Projekat 4 – Postavke koda (Tilt Dot)
Ispod su korisnički podesive postavke koje se nalaze pri vrhu koda projekta. Kompletan sketch se pojavljuje automatski ispod članka.
Pin i veličina matrice
// 8×8 RGB matrica konfiguracija
const int MATRIX_PIN = 14; // fiksni pin za ovu ploču
const int MATRIX_WIDTH = 8;
const int MATRIX_HEIGHT = 8;
Ostavite MATRIX_PIN na 14. On je hardverski povezan s matricom na ploči.
Svjetlina
// Ukupna svjetlina (0–255)
uint8_t matrixBrightness = 40;
Povećajte ako je potrebno, ali izbjegavajte ekstremnu svjetlinu kada gledate izbliza.
Boja tačke
// Boja tačke (R, G, B)
uint8_t dotRed = 0;
uint8_t dotGreen = 200; // svijetlo zelena (podrazumijevano)
uint8_t dotBlue = 0;
Promijenite ove vrijednosti da biste kreirali bilo koju boju. Primjeri:
- Crvena:
(255, 0, 0) - Žuta:
(255, 255, 0) - Bijela:
(255, 255, 255)
Osjetljivost pokreta
Da bi se spriječili ekstremni skokovi, vrijednosti akcelerometra se obično ograničavaju ili skaliraju. Tipična postavka izgleda ovako:
// Koliko agresivno nagib utiče na kretanje
float sensitivity = 4.0f; // veće = brže kretanje preko ekrana
Ako se tačka kreće presporo → povećajte vrijednost. Ako se tačka kreće prenaglo → smanjite je.
Brzina ažuriranja (Stopa osvježavanja)
Možete dodati malu pauzu između ažuriranja kako biste izgladili pokret:
// Pauza između ažuriranja pozicije (ms)
int refreshDelayMs = 20; // niže = glatkiji i brži odziv
Vrijednosti između 10–30 ms djeluju vrlo responzivno.
Sažetak
Projekat 4 oživljava ugrađeni QMI8658C akcelerometar ESP32-S3 ploče omogućavajući vam da kontrolišete LED matricu fizičkim pokretom. Lagano naginjanje ploče pomiče tačku u istom smjeru, čineći ovaj projekat savršenim odskočnim korakom za naprednije projekte “Arrow Up” i “Target Game”.
Kompletna Tilt Dot skica učitana je ispod ovog članka (automatski). Za najbolje razumijevanje, pogledajte demonstraciju naginjanja u videu, gdje možete vidjeti kako se tačka glatko pomiče dok se ploča rotira. Linkovi za kupovinu ESP32-S3 RGB LED Matrix modula uključeni su ispod sekcije s kodom.
Ovaj tutorijal je dio: ESP32-S3 RGB LED matrica
- ESP32-S3 RGB LED Matrix projekat 1 - Osnovna tačka
- ESP32-S3 RGB LED Matrix projekat 2 - Tekst koji se pomiče
- ESP32-S3 RGB LED Matrix projekat 3 - Tekst sa mobilnog telefona
- ESP32-S3 RGB LED Matrica Projekat 5 - Strelica uvijek gore
- ESP32-S3 RGB LED Matrix projekat 6 - Cible igra
- ESP32-S3 RGB LED matrica Wi-Fi + NTP sat vremena projekat -1 Osnovni sat
- ESP32-S3 RGB LED matrica Internet sat projekat - 2 sata višebojni prikaz vremena i datuma
- ESP32-S3 RGB LED matrica internet sat projekat - 3 noćne boje sa datumom
- ESP32-S3 RGB LED matrica internet sat projekat - 5 duginih boja
- ESP32-S3 RGB LED matrica internet sat projekat - 4 nasumične boje
- ESP32-S3 RGB LED Matrix test for RGB, GRB setting
/*
Project 4: Tilt Dot – ESP32-S3 RGB LED Matrix (Waveshare)
This sketch reads tilt from the QMI8658C IMU and smoothly moves a dot
on the 8×8 RGB LED matrix based on board orientation.
▶️ Video Tutorial:
https://youtu.be/JKLuYrRcLMI
📚⬇️ Resources & Code Page:
https://robojax.com/RJT829
QMI8658_RGB_2
*/
#include <Arduino.h>
#include <math.h>
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>
#include <QMI8658.h> // by Lahav Gahali
// -------- 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
);
// -------- QMI8658 IMU SETUP --------
QMI8658 imu;
QMI8658_Data imuData;
// -------- USER SETTINGS --------
// true -> dot on opposite side: USB↔OUSB, 34↔15
// false -> dot on same side as UP
bool useOppositeMapping = false;
// Dot color (0–255 each)
uint8_t dotRed = 0;
uint8_t dotGreen = 100;
uint8_t dotBlue = 0;
// Board sides
enum Side {
SIDE_CENTER = 0,
SIDE_USB,
SIDE_OUSB,
SIDE_15,
SIDE_34
};
// Smooth dot position (in pixel coordinates, but kept as float for easing)
float dotPosX = 3.0f; // start at center
float dotPosY = 3.0f;
// Smoothing factor: smaller = slower movement (0.1 very slow, 0.5 faster)
const float dotSmooth = 0.25f;
bool isFlat = false;
const char* sideName(Side s) {
switch (s) {
case SIDE_CENTER: return "CENTER";
case SIDE_USB: return "USB";
case SIDE_OUSB: return "OUSB";
case SIDE_15: return "15";
case SIDE_34: return "34";
default: return "?";
}
}
// Detect which side is UP using calibrated axes:
// +X = USB, -X = OUSB, +Y = 34, -Y = 15
Side detectSideUp(float ax_g, float ay_g, float az_g) {
// Flat detection
const float flatThreshXY = 0.15f;
const float flatThreshZ = 0.15f;
if (fabs(ax_g) < flatThreshXY &&
fabs(ay_g) < flatThreshXY &&
fabs(az_g - 1.0f) < flatThreshZ) {
isFlat = true;
return SIDE_CENTER;
}
isFlat = false;
// Thresholds to say "this axis is really tilted"
const float tiltThreshY = 0.5f;
const float tiltThreshX = 0.5f;
// 1) Prefer Y axis for 15 / 34 if it's clearly tilted
if (fabs(ay_g) >= tiltThreshY) {
if (ay_g > 0) {
return SIDE_15; // +Y = 34 up
} else {
return SIDE_34; // -Y = 15 up
}
}
// 2) Otherwise, check X axis for USB / OUSB
if (fabs(ax_g) >= tiltThreshX) {
if (ax_g > 0) {
return SIDE_USB; // +X = USB up
} else {
return SIDE_OUSB; // -X = OUSB up
}
}
// 3) If nothing is strongly tilted, just call it CENTER
return SIDE_CENTER;
}
// Map from UP side to where the dot should go
Side dotSideFromUpSide(Side upSide) {
switch (upSide) {
case SIDE_USB:
return useOppositeMapping ? SIDE_OUSB : SIDE_USB;
case SIDE_OUSB:
return useOppositeMapping ? SIDE_USB : SIDE_OUSB;
case SIDE_34:
return useOppositeMapping ? SIDE_15 : SIDE_34;
case SIDE_15:
return useOppositeMapping ? SIDE_34 : SIDE_15;
case SIDE_CENTER:
default:
return SIDE_CENTER;
}
}
// Convert dot side to matrix coordinates
void getDotPixel(Side dotSide, int &px, int &py) {
// Matrix (0,0) = top-left
// top center: (3,0) → USB
// bottom center: (3,7) → OUSB
// left center: (0,3) → 15
// right center: (7,3) → 34
// center: (3,3)
switch (dotSide) {
case SIDE_USB: px = 3; py = 0; break;
case SIDE_OUSB: px = 3; py = 7; break;
case SIDE_15: px = 0; py = 3; break;
case SIDE_34: px = 7; py = 3; break;
case SIDE_CENTER:
default: px = 3; py = 3; break;
}
}
void setup() {
Serial.begin(115200);
delay(500);
matrix.begin();
matrix.setBrightness(20);
matrix.fillScreen(0);
matrix.show();
// IMU: SDA=11, SCL=12 for ESP32-S3-Matrix
if (!imu.begin(11, 12)) {
Serial.println("Failed to initialize QMI8658!");
while (1) { delay(1000); }
}
imu.setAccelUnit_mg(true);
imu.setGyroUnit_dps(true);
imu.setDisplayPrecision(4);
Serial.print("QMI8658 initialized. useOppositeMapping = ");
Serial.println(useOppositeMapping ? "TRUE" : "FALSE");
}
void loop() {
if (!imu.readSensorData(imuData)) {
return;
}
float ax_g = imuData.accelX / 1000.0f;
float ay_g = imuData.accelY / 1000.0f;
float az_g = imuData.accelZ / 1000.0f;
Side upSide = detectSideUp(ax_g, ay_g, az_g);
Side dotSide = dotSideFromUpSide(upSide);
int targetX, targetY;
getDotPixel(dotSide, targetX, targetY);
// --- Smooth movement toward target ---
dotPosX += (targetX - dotPosX) * dotSmooth;
dotPosY += (targetY - dotPosY) * dotSmooth;
// Convert to integer pixel coordinates
int px = (int)round(dotPosX);
int py = (int)round(dotPosY);
// Clamp just in case
if (px < 0) px = 0;
if (px > 7) px = 7;
if (py < 0) py = 0;
if (py > 7) py = 7;
// --- Draw dot ---
matrix.fillScreen(0);
uint16_t color = matrix.Color(dotRed, dotGreen, dotBlue);
matrix.drawPixel(px, py, color);
matrix.show();
// Debug
Serial.print("AX="); Serial.print(ax_g, 3);
Serial.print(" AY="); Serial.print(ay_g, 3);
Serial.print(" AZ="); Serial.print(az_g, 3);
Serial.print(" | UP="); Serial.print(sideName(upSide));
Serial.print(" | DOT="); Serial.print(sideName(dotSide));
Serial.print(" | px="); Serial.print(px);
Serial.print(" py="); Serial.println(py);
delay(80);
}
Stvari koje bi vam mogle zatrebati
-
Amazon
-
eBay
-
AliExpressPurchase ESP32-S3 RGB matrix from AliExpresss.click.aliexpress.com
-
AliExpressPurchase ESP32-S3 RGB matrix from AliExpress (2)s.click.aliexpress.com
Resursi i reference
-
Interno🎨 Color picker Toolrobojax.com
Datoteke📁
Fritzing datoteka
-
esp32-S3-supermini-tht fritzing part
esp32-S3-supermini-tht.fzpz0.02 MB