Panoramica del Progetto

I sei progetti trattati in questo tutorial:

• Progetto 1– Punto in Movimento (configurazione base della matrice)
• Progetto 2– Scorrimento del testo sulla matrice 8 × 8
• Progetto 3– Testo HTTP: invia testo dal tuo telefono o PC tramite Wi-Fi
• Progetto 4– Tilt Dot, controllato dall'accelerometro QMI8658
• Progetto 5– Freccia Sempre Verso l'Alto (indicatore di orientamento che utilizza QMI8658)
• Progetto 6– Gioco a bersaglio con controllo a pulsante e inclinazione

Se in qualsiasi fase ti perdi, confronta le tue impostazioni con i frammenti di codice forniti per ciascun progetto di seguito.

Introduzione

I progetti iniziano con l'animazione più semplice possibile (un singolo punto in movimento) e aggiungono gradualmente testo, controllo Wi-Fi e infine l'interazione basata su sensori utilizzando l'accelerometro QMI8658. Alla fine, comprenderai come controllare la matrice LED e reagire all'orientamento della scheda.

Installazione delle schede ESP32-S3 nell'IDE Arduino

Prima di caricare qualsiasi codice, installa il supporto ufficiale per la scheda ESP32 nell'IDE di Arduino e seleziona un profilo di scheda ESP32-S3 (ad esempio, un modulo di sviluppo ESP32-S3). Ciò garantisce che le impostazioni corrette per la dimensione della memoria flash, la frequenza e l'USB vengano applicate durante la compilazione e il caricamento.

Installazione delle Librerie Richieste

Le seguenti librerie sono necessarie per questi progetti:

• Adafruit NeoPixel
• Adafruit GFX
• Adafruit NeoMatrix
• QMI8658 (di Lahav Gahali)

Installa le librerie una volta utilizzando il Gestore Librerie di Arduino, poi potrai riutilizzarle per tutti e sei i progetti.

Informazioni sul QMI8658 Accelerometro

Il QMI8658 è un'IMU a 6 assi che combina un accelerometro a 3 assi e un giroscopio a 3 assi. In questi progetti, i valori dell'accelerometro vengono utilizzati per rilevare l'inclinazione e l'orientamento della scheda.

Convenzione degli assi utilizzata in tutti i progetti:

• X– sinistra / destra
• Sì– avanti / indietro
• Z– verticale (su / giù)

In tutti i progetti basati sull'inclinazione, configurerai una sola volta il range dell'accelerometro e il data rate di output, e poi leggerai i valori per spostare un punto, orientare una freccia o controllare un gioco.

// Common QMI8658 configuration used in tilt projects
// (Projects 4, 5, and 6)

const auto ACC_RANGE   = QMI8658AccRange_2g;
const auto ACC_ODR     = QMI8658AccODR_31_25Hz;
const auto GYR_RANGE   = QMI8658GyrRange_256dps;
const auto GYR_ODR     = QMI8658GyrODR_31_25Hz;

// Sensitivity factor for converting tilt to pixels
const float TILT_TO_PIXEL_SCALE = 4.0f;   // increase for more sensitivity
    

Progetto 1 – Punto in Movimento (Impostazioni Matrice di Base)

Progetto 1 è una semplice animazione di un punto in movimento che verifica il cablaggio della matrice LED e le impostazioni di base di NeoMatrix. Si definiscono le dimensioni della matrice, il pin dei dati, la luminosità e la velocità di movimento del punto.

Impostazioni Chiave

// Project 1 – Moving Dot (basic matrix setup)

// Matrix geometry
#define MATRIX_PIN       14
#define MATRIX_WIDTH      8
#define MATRIX_HEIGHT     8

// Layout (choose one; many boards use ZIGZAG or PROGRESSIVE)
#define MATRIX_LAYOUT  (NEO_MATRIX_TOP + NEO_MATRIX_LEFT + \
                        NEO_MATRIX_ROWS + NEO_MATRIX_ZIGZAG)
// Alternative if needed:
// #define MATRIX_LAYOUT  (NEO_MATRIX_TOP + NEO_MATRIX_LEFT + \
//                         NEO_MATRIX_ROWS + NEO_MATRIX_PROGRESSIVE)

// Visual parameters
const uint8_t  P1_BRIGHTNESS     = 40;         // overall brightness (0–255)
const uint16_t P1_DOT_COLOR      = matrix.Color(0, 255, 0); // green dot
const uint16_t P1_STEP_DELAY_MS  = 80;         // smaller = faster movement
    

ModificandoP1_DOT_COLOReP1_STEP_DELAY_MS, puoi testare rapidamente diversi colori e velocità di animazione.

Progetto 2 – Scorrimento del Testo

Progetto 2 visualizza testo scorrevole comeRobojax. Tu controlli il messaggio stesso, la direzione di scorrimento, il colore del testo e la velocità. Questo progetto introduce la resa del testo su una matrice molto piccola.

Impostazioni Chiave

// Project 2 – Text Scroll

// Scrolling message
const char* P2_MESSAGE = "Robojax";

// Text color (R, G, B)
const uint16_t P2_TEXT_COLOR = matrix.Color(255, 0, 0);  // red text

// Scroll speed
const uint16_t P2_SCROLL_DELAY_MS = 70;  // smaller = faster scroll

// Scroll direction (you will use this in your logic)
// Possible values: -1 for left, +1 for right, or use an enum
const int8_t P2_SCROLL_DIR_X = -1;  // -1 = scroll left, +1 = scroll right
const int8_t P2_SCROLL_DIR_Y =  0;  //  0 = no vertical scroll
    

Se in seguito decidi di scorrere verticalmente (verso l'alto o il basso), impostaP2_SCROLL_DIR_Xa0e usaP2_SCROLL_DIR_Yinvece.

Progetto 3 – Messaggio su Telefono Mobile (Messaggio Controllato via Wi-Fi)

Progetto 3 trasforma l'ESP32-S3 in un piccolo server web. Ti connetti alla scheda via Wi-Fi, apri la sua pagina web e digiti un messaggio. Il testo, il colore e la velocità di scorrimento vengono poi utilizzati per pilotare in tempo reale lo stesso effetto di scorrimento del testo sulla matrice.

Impostazioni Wi-Fi e SMS

// Project 3 – HTTP Text

// Wi-Fi credentials (change to your own network)
const char* P3_WIFI_SSID     = "YourWiFiName";
const char* P3_WIFI_PASSWORD = "YourWiFiPassword";

// Default text before anything is sent from the browser
String P3_currentText = "Robojax";

// Default color for the HTTP-controlled text
uint16_t P3_TEXT_COLOR = matrix.Color(0, 255, 255); // cyan

// Scroll speed for HTTP text
uint16_t P3_SCROLL_DELAY_MS = 80;  // can be updated from web page

// Allowed scroll directions (used as options in the HTML form)
enum P3_Direction {
  P3_LEFT,
  P3_RIGHT,
  P3_UP,
  P3_DOWN
};
P3_Direction P3_scrollDirection = P3_LEFT;
    

Nella pagina web, l'utente sceglie la direzione e la velocità. Il tuo codice si limita ad aggiornareP3_scrollDirectioneP3_SCROLL_DELAY_MSin base alle opzioni selezionate.

Progetto 4 – Tilt Dot (Utilizzando QMI8658)

Il Progetto 4 legge l'accelerometro QMI8658 e sposta un singolo punto sulla matrice in base all'inclinazione della scheda. Quando la scheda è piatta, il punto è al centro. Inclinando la scheda, il punto si sposta in quella direzione.

`

Impostazioni Matrix e Tilt

// Project 4 – Tilt Dot

// Matrix geometry / brightness
#define MATRIX_PIN_TILT       14
#define MATRIX_WIDTH_TILT      8
#define MATRIX_HEIGHT_TILT     8

const uint8_t  P4_BRIGHTNESS   = 40;
const uint16_t P4_DOT_COLOR    = matrix.Color(0, 255, 0); // green
const uint16_t P4_UPDATE_DELAY = 30;  // ms between updates

// QMI8658 configuration (reuse from common settings if desired)
const auto P4_ACC_RANGE = QMI8658AccRange_2g;
const auto P4_ACC_ODR   = QMI8658AccODR_125Hz;

// Mapping accelerometer to pixel offset
// Negative sign may be adjusted depending on how the board is held
const float P4_TILT_SCALE_X = 3.5f; // affects left/right sensitivity
const float P4_TILT_SCALE_Y = 3.5f; // affects up/down sensitivity
    

Nel tuo codice, limiti le letture dell'accelerometro a un intervallo come[-1, 1], moltiplicarli perP4_TILT_SCALE_XeP4_TILT_SCALE_Y, e aggiungile alle coordinate del centro. Se il movimento sembra invertito, basta invertire il segno.

Progetto 5 – Freccia Sempre Verso l'Alto

Progetto 5 mostra una freccia sulla matrice 8 × 8 che punta sempre verso il lato "superiore" della scheda. Quando si ruota la scheda, la freccia ruota in modo da puntare verso il lato che è rivolto verso l'alto.

Impostazioni Freccia e Orientamento

// Project 5 – Arrow Always Up

// Matrix brightness and color for the arrow
const uint8_t  P5_BRIGHTNESS     = 50;
const uint16_t P5_ARROW_COLOR    = matrix.Color(255, 150, 0);  // orange

// How often to update orientation
const uint16_t P5_UPDATE_DELAY_MS = 40;

// Tilt thresholds (in g) used to decide which side is "up"
// Adjust according to the board orientation in your video/demo
const float P5_TILT_THRESHOLD_LOW  = -0.25f;
const float P5_TILT_THRESHOLD_HIGH =  0.25f;

// Example mapping corners/sides based on accelerometer values
// (used in your logic to choose which arrow shape to draw)
/*
  ax, ay conditions (examples):
    ax >  P5_TILT_THRESHOLD_HIGH  -> USB side up
    ax <  P5_TILT_THRESHOLD_LOW   -> opposite USB side up
    ay >  P5_TILT_THRESHOLD_HIGH  -> one lateral side up
    ay <  P5_TILT_THRESHOLD_LOW   -> other lateral side up
*/
    

Il disegno effettivo della freccia è implementato conmatrix.drawPixel()ematrix.drawLine(). La parte fondamentale è decidere quale orientamento della freccia utilizzare in base alle zone di inclinazione definite daP5_TILT_THRESHOLD_LOWeP5_TILT_THRESHOLD_HIGH.

Progetto 6 – Gioco di Precisione (Controllato con Inclinazione)

Progetto 6 è un piccolo gioco in cui controlli un puntino del giocatore usando l'accelerometro, cerchi di spostarlo su un pixel bersaglio e ricevi un feedback sia dalla matrice che da un buzzer quando colpisci il bersaglio.

Impostazioni di Gioco e Cicalino

// Project 6 – Tilt-Based Target Game

// Matrix brightness
const uint8_t P6_BRIGHTNESS = 60;

// Colors for game elements
const uint16_t P6_PLAYER_COLOR    = matrix.Color(0, 255, 0);   // green
const uint16_t P6_TARGET_COLOR    = matrix.Color(255, 0, 0);   // red
const uint16_t P6_BACKGROUND_COLOR = matrix.Color(0, 0, 0);    // off
const uint16_t P6_HIT_FLASH_COLOR = matrix.Color(255, 255, 0); // yellow on hit

// Buzzer pin and timing
const int      P6_BUZZER_PIN       = 4;       // change if wired differently
const uint16_t P6_BUZZER_ON_MS     = 120;     // beep duration
const uint16_t P6_BUZZER_OFF_MS    = 80;      // pause between beeps
const uint8_t  P6_BUZZER_VOLUME    = 128;     // if using PWM, duty cycle (0–255)

// Movement and game timing
const uint16_t P6_UPDATE_DELAY_MS  = 35;      // game loop delay
const float    P6_TILT_SCALE_X     = 3.5f;    // convert tilt to pixels (left/right)
const float    P6_TILT_SCALE_Y     = 3.5f;    // convert tilt to pixels (up/down)

// Minimum distance in pixels to count as a "hit"
const uint8_t  P6_HIT_DISTANCE_MAX = 0;       // 0 = exact same pixel
    

Nella logica di gioco dovrai:

• Leggi l'accelerometro e sposta il punto del giocatore di una quantità scalata.
• Blocca la posizione del giocatore all'interno della griglia 8 × 8.
• Verifica se la posizione del giocatore corrisponde alla posizione target (o è entro la distanza consentita).
• Al colpo, lampeggia la matrice usandoP6_HIT_FLASH_COLORe attiva il cicalino utilizzandoP6_BUZZER_ON_MSeP6_BUZZER_OFF_MS.
• Poi sposta il bersaglio in una nuova posizione casuale e continua.

Mappa con spilli

Conclusione

Questi sei progetti coprono i blocchi essenziali per lavorare con il display a LED RGB Waveshare ESP32-S3: il controllo base dei pixel, lo scorrimento del testo, l'interazione basata sul Wi-Fi e la grafica e i giochi basati sull'inclinazione utilizzando l'accelerometro QMI8658.

Puoi combinare queste idee per creare i tuoi progetti, come tabelloni segnapunti, piccoli display di stato, mini-giochi o pannelli di notifica, tutti controllati tramite inclinazione, tocco o messaggi dal tuo telefono o computer.