Guarda su YouTube

Progetto ESP32-S3 Matrice LED RGB 3 - Testo da telefono cellulare

Progetto 3 - Testo della matrice di controllo dal tuo telefono (Testo HTTP)

In questo progetto il modulo ESP32-S3 RGB LED Matrix ospita una piccola pagina web in modo da poter modificare il testo scorrevole, il colore, la direzione e la velocità direttamente dal tuo telefono o computer. Non hai bisogno di un'app separata, solo di un browser web. Questo rende il modulo un piccolo display di testo Wi-Fi che puoi aggiornare in tempo reale.

Tutti e sei i progetti di questa serie sono spiegati e dimostrati in un video di YouTube. Lo stesso video è incorporato in questa pagina, quindi puoi vedere esattamente come appare l'interfaccia web e come il testo si aggiorna istantaneamente sulla matrice. Il codice sorgente completo per questo progetto viene caricato automaticamente sotto l'articolo, e puoi acquistare il modulo matrice LED RGB ESP32-S3 presso i negozi affiliati elencati nella sezione codice.

In questo articolo ci concentriamo su come funziona la logica di rete (Wi-Fi domestico vs punto di accesso) e su quali impostazioni puoi modificare nel codice per personalizzare il comportamento.

Panoramica del Modulo Matrice LED RGB ESP32-S3

L'hardware è lo stesso di tutti gli altri progetti di questa serie: una scheda microcontrollore ESP32-S3 con una matrice LED RGB 8×8 incorporata e un sensore di movimento QMI8658C sul retro. La porta USB-C è utilizzata per l'alimentazione e la programmazione, e i pin attorno ai bordi sono ancora disponibili per altre I/O.:contentReference[oaicite:0]{index=0}

• ESP32-S3Microcontrollore con capacità Wi-Fi e Bluetooth.
• matrice RGB 8×8- 64 LED RGB indirizzabili per testo e grafica.
• accelerometro QMI8658C- utilizzato nei progetti di tilt e gioco.
• porta USB- alimenta la scheda e carica gli sketch dall'IDE di Arduino.
• Pin esposti- consentire sensori o attuatori aggiuntivi se necessario.
• Pulsanti di avvio/reimpostazione- per il caricamento del firmware e il riavvio.

Per il Progetto 3, la caratteristica più importante è il Wi-Fi dell'ESP32, che consente alla scheda di funzionare come un piccolo server web per la pagina di controllo del testo.:contentReference[oaicite:1]{index=1}

Progetti trattati nel video (Timestamp)

Il video unico per questa serie copre tutti e sei i progetti. Per un rapido riferimento:

• 00:00- Introduzione
• 02:01- Installazione delle schede ESP32
• 03:32- Installazione delle librerie
• 05:32- Progetto 1: Punto in movimento
• 11:11- Progetto 2: Scorrimento del Testo
• 12:59-Progetto 3: HTTP Testo (questo progetto)
• 16:41- Progetto 4: Tilt Dot
• 18:55- Progetto 5: Freccia Su
• 20:02- Progetto 6: Gioco del bersaglio

Si consiglia di guardare la sezione HTTP Text nel video mentre si lavora con questo articolo. Il video mostra come viene generata la pagina web dall'ESP32 e come le modifiche al testo, al colore e alla velocità vengano riflesse istantaneamente sulla matrice di LED.:contentReference[oaicite:2]{index=2}

Installazione delle schede ESP32 nell'Arduino IDE

Se hai già completato i Progetti 1 o 2, la configurazione della scheda è stata completata e puoi saltare questa sezione. Altrimenti, segui questi passaggi nell'IDE Arduino:

1. ApriFile > Preferencese aggiungi l'URL delle schede ESP32 a "URL aggiuntivi del gestore schede".
2. Vai aTools > Board > Boards Manager…, cerca diESP32e installa il pacchetto ufficiale ESP32.
3. Seleziona la scheda matrice RGB ESP32-S3 corretta daTools > Board.
4. Collega il modulo tramite USB e scegli la porta seriale corretta sottoTools > Port.

Senza il supporto corretto per la scheda ESP32 e la porta giusta, lo sketch del server web non verrà caricato.

Installazione di NeoMatrix e librerie richieste

Questo progetto utilizza le stesse librerie del precedente progetto di scorrimento del testo:

• Adafruit NeoMatrix
• Adafruit NeoPixel
• Adafruit GFX Library

Installa tramite il Gestore Librerie:

1. ApriSketch > Include Library > Manage Libraries….
2. Cerca perAdafruit NeoMatrixe fai clicInstalla.
3. Accetta l'installazione delle dipendenzeAdafruit GFXeAdafruit NeoPixel).

Una volta installati, dovresti vedere gli esempi di sketch NeoMatrix e NeoPixel sottoFile > Examples.

Due modalità Wi-Fi nel Progetto 3

Il concetto più importante di questo progetto è che l'ESP32 può funzionare indue modalità diverse:

1. Modalità Stazione (STA)- l'ESP32 si connette alla tua rete Wi-Fi domestica esistente.
2. Modalità Access Point (AP)L'ESP32 crea la propria rete Wi-Fi se la rete Wi-Fi di casa non è disponibile.

Entrambi i modelli utilizzano la stessa interfaccia web: una pagina HTML servita direttamente dall'ESP32, dove puoi cambiare il testo, il colore, la direzione di scorrimento e la velocità.:contentReference[oaicite:3]{index=3}

Modalità 1 - Connessione al Wi-Fi di casa (Modalità Stazione)

In modalità Stazione, l'ESP32 si connette alla rete Wi-Fi di casa o dell'ufficio. Questa è la modalità preferita ogni volta che il tuo router è disponibile perché:

• Il tuo telefono e computer sono già connessi alla stessa rete Wi-Fi.
• Puoi puntare il tuo browser all'indirizzo IP dell'ESP32 e controllare il testo da qualsiasi dispositivo su quella rete.

Nella sezione delle impostazioni dello sketch, fornisci il tuo SSID Wi-Fi e la password:

// Home Wi-Fi credentials (Station mode)
const char* WIFI_SSID = "YourHomeWiFi";
const char* WIFI_PASS = "YourHomePassword";

Dopo che la scheda si avvia, tenta di connettersi aWIFI_SSIDSe ha successo, il codice stampa l'indirizzo IP assegnato al Monitor Serial, per esempio:

Connected to WiFi
IP address: 192.168.1.16

Per controllare il testo:

1. Assicurati che il tuo telefono o PC sia connesso alla stessa rete Wi-Fi (ad esempio,YourHomeWiFi).
2. Apri un browser e inserisci l'indirizzo IP stampato, comehttp://192.168.1.16/. :contentReference[oaicite:4]{index=4}
3. La pagina di controllo apparirà, consentendoti di digitare testo, scegliere il colore, selezionare la direzione e regolare la velocità di scorrimento.

Modalità 2 - Punto di Accesso Standalone (Modalità AP)

Se l'ESP32 non riesce a connettersi al Wi-Fi di casa (password errata, rete non disponibile o se stai utilizzando il modulo all'esterno), lo sketch torna automaticamente alla modalità Punto di Accesso. In modalità AP, l'ESP32 diventa un hotspot Wi-Fi con il proprio nome di rete e password.

In questo progetto, le impostazioni AP sono fissate a:

// Access Point (AP) credentials (fallback mode)
const char* AP_SSID = "ESP32";
const char* AP_PASS = "password";

Quando la modalità Stazione fallisce, il modulo passa alla modalità AP e inizia a trasmettere una rete Wi-Fi chiamataESP32. Per controllare la matrice:

1. Sul tuo telefono o computer, apri le impostazioni Wi-Fi e connettiti alla rete.ESP32.
2. Inserisci la passwordpassword(come definito nel codice).
3. Una volta connesso, apri un browser e vai ahttp://192.168.4.1/(l'indirizzo IP predefinito per la modalità AP dell'ESP32).
4. La stessa pagina di controllo appare, permettendoti di cambiare testo, colore, velocità e direzione.

Questo comportamento di fallback rende il progetto utile ovunque: a casa, in laboratorio o in un ambiente dimostrativo dove non è disponibile alcun router.

Progetto 3 - Impostazioni principali nel codice

Il completo schema del testo HTTP è caricato sotto questo articolo dal sito web. Qui documentiamo solo le opzioni di configurazione più importanti che è probabile tu debba modificare.

Impostazioni Wi-Fi e Punto di Accesso

In cima del disegno troverai la sezione di configurazione Wi-Fi. Cambia solo le credenziali della Stazione (Wi-Fi di casa); le impostazioni AP sono normalmente mantenute come predefinite:

// ---------- Wi-Fi SETTINGS ----------

// Home Wi-Fi (Station mode)
const char* WIFI_SSID = "YourHomeWiFi";      // put your router SSID here
const char* WIFI_PASS = "YourHomePassword";  // put your router password here

// Fallback Access Point (AP mode)
const char* AP_SSID = "ESP32";               // fixed AP name
const char* AP_PASS = "password";            // fixed AP password

Comportamento:

• SeWIFI_SSIDeWIFI_PASSsono corretti e la rete è disponibile → ESP32 si connette come un normale dispositivo Wi-Fi (modalità Stazione).
• Se la connessione fallisce dopo un timeout → ESP32 avvia il proprio AP utilizzandoAP_SSIDeAP_PASS.

Pin della matrice, dimensione e luminosità

Queste impostazioni sono le stesse dei progetti precedenti:

// Matrix configuration
const int MATRIX_PIN    = 14;   // RGB matrix data pin
const int MATRIX_WIDTH  = 8;
const int MATRIX_HEIGHT = 8;

// Overall display brightness (0–255)
uint8_t matrixBrightness = 40;  // adjust for your environment

MantieniMATRIX_PINat14per questa scheda. Puoi aumentarematrixBrightnessse hai bisogno di più luce, ma valori più bassi sono più comodi per la visualizzazione da vicino.

Impostazioni predefinite del testo e di scorrimento

Quando la scheda si avvia, visualizza un messaggio iniziale fino a quando non apri la pagina web e non ne digiti uno nuovo. Puoi cambiare il testo predefinito nella configurazione:

// Default message shown at startup
String currentText = "Robojax";   // overwrite from web UI later

Il resto del comportamento dello scroll è controllato da un insieme di variabili che vengono aggiornate dall'interfaccia web:

// Scroll delay in milliseconds (lower = faster)
int scrollDelayMs = 50;

// Scroll direction: 0=left, 1=right, 2=up, 3=down
int scrollDirection = 0;   // default: scroll left

La pagina web invia nuovi valori basati sulle selezioni dello slider e dei pulsanti. Dal lato di Arduino, devi solo sapere che:

• DecrescentescrollDelayMsrende il testo più veloce.
• In aumentoscrollDelayMslo fa muovere più lentamente.
• CambiandoscrollDirectionpassa tra modalità di scorrimento a sinistra, a destra, in alto o in basso.

Colore del testo (Controllato dalla pagina web)

Il colore del testo è controllato da tre valori compresi tra 0 e 255 (rosso, verde, blu). Vengono aggiornati ogni volta che scegli un nuovo colore sulla pagina web:

// Current text color (R, G, B)
uint8_t textRed   = 255;
uint8_t textGreen = 255;
uint8_t textBlue  = 255;

Quando scegli un colore nel browser e clicchi su Applica, l'ESP32 analizza i valori RGB e aggiorna queste tre variabili; il testo cambia immediatamente colore sulla matrice. Nel video, questo comportamento è dimostrato con molteplici variazioni di colore, inclusi esempi di rosso, verde e blu.:contentReference[oaicite:5]{index=5}

Riepilogo

Il Progetto 3 trasforma il tuo matrice LED RGB ESP32-S3 in un display testuale completamente wireless che puoi controllare utilizzando qualsiasi dispositivo con un browser web. Lo sketch è progettato per essere robusto:

• Prima tenta di connettersi al tuo Wi-Fi domestico utilizzando l'SSID e la password che hai configurato.
• Se ciò fallisce, diventa automaticamente un punto di accesso con il nomeESP32e passwordpassword.
• In entrambe le modalità, l'apertura dell'indirizzo IP corretto in un browser visualizza la stessa pagina di controllo per testo, colore, direzione e velocità.

Il codice HTTP Text completo è disponibile sotto questo articolo (caricato automaticamente sul sito web). Per una guida passo passo completa e una dimostrazione dal vivo su come il testo si aggiorna in tempo reale, assicurati di guardare la sezione Progetto 3 del video. Se desideri costruire il progetto da solo, puoi anche acquistare il modulo LED Matrix RGB ESP32-S3 utilizzando i link affiliati elencati sotto il codice.

Immagini

ESP32 S3 Matrix

ESP32 S3 Matrix pin out

ESP32-S3_RGB_8x8_matrix-3

ESP32 S3 Matrix displaying rainbow heart

ESP32-S3_RGB_8x8_matrix1

ESP32-S3_RGB_8x8_matrix-2

ESP32-S3 RGB Matrix- Mobile Phone Text

ESP32 S3 Matrix

ESP32 S3 Matrix pin out

ESP32-S3_RGB_8x8_matrix-3

ESP32 S3 Matrix displaying rainbow heart

ESP32-S3_RGB_8x8_matrix1

ESP32-S3_RGB_8x8_matrix-2

ESP32-S3 RGB Matrix- Mobile Phone Text