L’elemento caratterizzante più evidente di Arduino R4 è senza alcun dubbio la matrice di LED, che potremo utilizzare come sistema di output immediato, ma anche per creare animazioni o giochi, o ancora mettere in evidenza lo stato di un sensore. La matrice LED è costituita da 12×8 LED.

La matrice e la sua API sono sviluppate per essere programmate in diversi modi, ciascuno adatto per diverse applicazioni. Questa breve lezione vi guiderà attraverso i concetti di base per gestire la matrice di LED aiutandovi a creare le vostre animazioni, mostrando tre diversi metodi di gestione dei LED che potrete scegliere in funzione del progetto che desiderate implementare.

Per lo svolgimento di questa lezione avete necessità solamente della scheda Arduino UNO R4 e di un cavo USB C.

Inizializzare la matrice

L’inizializzazione della matrice di LED avviene in 3 passi:

1. inclusione nel vostro sketch della libreria:

#include "Arduino_LED_Matrix.h"

1. creazione dell’oggetto matrix aggiungendo la seguente riga:

ArduinoLEDMatrix matrix;

L’oggetto ovviamente potrà avere un nome a vostro piacimento nell’esempio è stato scelto: “matrix”

1. avviare la matrice aggiungendo nel setup():

matrix.begin();

Il codice di avvio sarà il seguente:

#include "Arduino_LED_Matrix.h"

ArduinoLEDMatrix matrix;

void setup() {
  Serial.begin(115200);
  matrix.begin();
}

Come realizzare un frame

Il principio di funzionamento della libreria di gestione della matrice di LED è quello basato sulla creazione di un frame (fotogramma) memorizzato in un buffer di memoria e poi visualizzato.

Un frame è ciò che viene chiamato anche “immagine” visualizzata in un dato momento sulla matrice di LED. Un’animazione è costituita da una serie di immagini pertanto possiamo dire in altro modo che un’animazione è costituita da una sequenza di frame .

Per controllare la matrice LED 12×8 è indispensabile utilizzare uno spazio in memoria che sia di almeno 96 bit e la libreria fornisce due modi per farlo.

Modo n. 1

Il primo è quello di creare un array bidimensionale di byte nel modo che segue:

byte frame[8][12] = {
  { 0, 0, 1, 1, 0, 0, 0, 1, 1, 0, 0, 0 },
  { 0, 1, 0, 0, 1, 0, 1, 0, 0, 1, 0, 0 },
  { 0, 1, 0, 0, 0, 1, 0, 0, 0, 1, 0, 0 },
  { 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0 },
  { 0, 0, 0, 1, 0, 0, 0, 1, 0, 0, 0, 0 },
  { 0, 0, 0, 0, 1, 0, 1, 0, 0, 0, 0, 0 },
  { 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0 },
  { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 }
};

La prima modalità è molto semplice da capire, la struttura frame rappresenta la matrice di LED e la serie di 1 indicherà quali LED saranno accesi, mentre quelli a 0 rappresentano i LED spenti. L’array sopra permetterà di visualizzare sulla matrice un cuore.

Suggerimento: Potete vedere il cuore più facilmente se evidenziate tutti gli “1” sulla pagina premendo CTRL/command + F e cercando “1”.

Per fare riferimento ad un pixel specifico ricordare che l’origine degli assi si trova in alto a sinistra ed avrà coordinate (0, 0) pertanto il codice che segue permette di porre ad 1 (on) il terzo pixel da sinistra e secondo dall’alto:

frame[2][1] = 1;
matrix.renderBitmap(frame, 8, 12);

Questo metodo però richiede più memoria di quella necessaria. Anche se ogni LED ha bisogno solo di un singolo bit per memorizzare il suo stato, vengono usati per ognuno di esse otto bit (un byte). Il metodo più efficiente, in termini di memoria per memorizzare un fotogramma è utilizzare un array di interi a 32 bit, descritto di seguito.

Vedremo ora come realizzare uno o più fotogrammi, realizzazione che può anche essere svolta con il LED Matrix tool messo a disposizione da Arduino, ma al fine di comprenderne a pieno il funzionamento, consiglio di seguire le indicazioni che trovate di seguito.

La parte di programma che utilizza codici esadecimali e rappresenta l’immagine del cuore indicata sopra è:

unsigned long frame[] = {
  0x3184a444,
  0x42081100,
  0xa0040000
};

Una variabile long senza segno contiene 32 bit, quindi per gestire 92 LED (bit) avremo necessità di 96/32 che corrisponde a 3 variabili long in grado di rappresentare ogni immagine che appare sulla matrice di LED, pertanto un array di tre variabili long senza segno è un modo efficiente per contenere tutti i bit necessari per rappresentare un’immagine sulla matrice di LED.

Ma come sono relazionate la serie dei 3 valori esadecimali con la posizione di ogni songolo pixel?

Ciò dovrà essere fatto convertendo i valori esadecimali in binario utilizzando il codice che segue:

for (int b = 0; b < 3; b++) {
    Serial.println(frame[b], BIN);
  }

Che permetterà di stampare tutti i valori dei bit dell’array. L’output sarà il seguente:

110001100001001010010001000100
1000010000010000001000100000000
10100000000001000000000000000000

Questo metodo, però, non mostra tutti i bit. Ogni elemento dell’array deve avere 32 bit. Se completiamo correttamente, aggiungendo gli zeri mancanti alla fine avremo i 32 bit di ogni elemento:

00110001100001001010010001000100
01000010000010000001000100000000
10100000000001000000000000000000

Ora suddividiamo il blocco precedente in gruppi da 12 bit ed otterremo nuovamente l’immagine del cuore:

001100011000
010010100100
010001000100
001000001000
000100010000
000010100000
000001000000
000000000000

Se si hanno diversi fotogrammi, è possibile caricarli e visualizzarli in questo modo:

const uint32_t felice[] = {
    0x19819,
    0x80000001,
    0x81f8000
};

const uint32_t cuore[] = {
    0x3184a444,
    0x44042081,
    0x100a0040
};

  matrix.loadFrame(felice);
  delay(500);

  matrix.loadFrame(cuore);
  delay(500);

Proviamo il codice

Applichiamo questi concetti con due sketch che visualizzano fotogrammi diversi sulla tua scheda.

Esempio 01

Creiamo prima 3 fotogrammi interi a 32 bit e carichiamoli sulla scheda uno alla volta.

#include "Arduino_LED_Matrix.h"

ArduinoLEDMatrix matrix;

void setup() {
  Serial.begin(115200);
  matrix.begin();
}

const uint32_t felice[] = {
    0x19819,
    0x80000001,
    0x81f8000
};
const uint32_t cuore[] = {
    0x3184a444,
    0x44042081,
    0x100a0040
};
  
void loop(){
  matrix.loadFrame(felice);
  delay(500);

  matrix.loadFrame(cuore);
  delay(500);
}

Lo sketch è molto semplice è permette di mostrate due stati diversi.

Esempio 02

Cambiamo ora approccio è creiamo un’immagine che cambia durante l’esecuzione del programma. Il programma include diverse funzioni che concorrono alla costruzione del volto e modificano alcuni pixel che permettono di fare l’occhiolino dall’occhio sinistro.

#include "Arduino_LED_Matrix.h"

ArduinoLEDMatrix matrix;

void setup() {
  Serial.begin(115200);
  matrix.begin();
}

uint8_t frame[8][12] = {
  { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
  { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 }
};

void occhioSinistro() {
  //Occhio sinistro
  frame[1][3] = 1;
  frame[1][4] = 1;
  frame[2][3] = 1;
  frame[2][4] = 1;
}

void occhiolino() {
  //Fare un occhiolino con occhio sinistro
  frame[1][3] = 0;
  frame[1][4] = 0;
  frame[2][3] = 1;
  frame[2][4] = 1;
}

void occhioDestro() {
  //Occhio destro
  frame[1][8] = 1;
  frame[1][9] = 1;
  frame[2][8] = 1;
  frame[2][9] = 1;
}

void bocca() {
  //Bocca
  frame[5][3] = 1;
  frame[5][9] = 1;
  frame[6][3] = 1;
  frame[6][4] = 1;
  frame[6][5] = 1;
  frame[6][6] = 1;
  frame[6][7] = 1;
  frame[6][8] = 1;
  frame[6][9] = 1;
}

void loop() {
  occhioSinistro();
  occhioDestro();
  bocca();

  matrix.renderBitmap(frame, 8, 12);

  delay(1000);
  occhiolino();

  matrix.renderBitmap(frame, 8, 12);
  delay(1000);
}

Esempio 03

Vediamo ora come, usando il LED Matrix tool, possono essere realizzati due visi sorridenti di cui uno che fa l’occhiolino.
Lascio a voi capire come usare gli strumenti da disegno, essenziale però descrivervi come effettuare il download dei frame.
Costruire due immagini una che riporta un viso con sorriso e l’altra un viso con sorriso che fa l’occhiolino:

Esportare il codice:

aprire il file scaricato: animazione.h ed includerlo all’interno del codice:

#include "Arduino_LED_Matrix.h"
#include <stdint.h>

ArduinoLEDMatrix matrix;

const uint32_t animazione[][4] = {
	// viso sorridente - frame n. 0
  {
		0x18c18,
		0xc0000000,
		0x1041fc,
		66
	},
  // viso sorridente con occhiolino - frame n. 1
	{
		0xc18,
		0xc0000000,
		0x1041fc,
		66
	}
};

void setup() {
  // inizializzazione della seriale
  Serial.begin(115200);
  // avvio della matrice di LED
  matrix.begin();
}

void loop() {
  // caricamento dalla prima animazione e visualizzazione su display
  matrix.loadFrame(animazione[0]);
  // attesa di 1 secondo
  delay(1000);

  // caricamento dalla seconda animazione e visualizzazione su display
  matrix.loadFrame(animazione[1]);
  // attesa di 1 secondo
  delay(1000);
}

Esempio 04

Vediamo ora come sincronizzare la visualizzazione alternata delle due immagini con il lampeggio del LED L. Nel setup() bisognerà impostare il pin a cui è connesso il LED L ad output, dopo di che richiamare accensione e spegnimento eattamente nella stessa posizione in cui viene richiamata la funzione matrix.loadFrame():

#include "Arduino_LED_Matrix.h"
#include <stdint.h>

ArduinoLEDMatrix matrix;

const uint32_t animazione[][4] = {
	// viso sorridente - frame n. 0
  {
		0x18c18,
		0xc0000000,
		0x1041fc,
		66
	},
  // viso sorridente con occhiolino - frame n. 1
	{
		0xc18,
		0xc0000000,
		0x1041fc,
		66
	}
};

void setup() {
  // inizializzazione della seriale
  Serial.begin(115200);
  // avvio della matrice di LED
  matrix.begin();
  // pin a cui collegato il LED L (pin 13) impostato come output
  pinMode(LED_BUILTIN, OUTPUT);
}

void loop() {
  // caricamento dalla prima animazione e visualizzazione su display
  matrix.loadFrame(animazione[0]);
  // accensione del LED L
  digitalWrite(LED_BUILTIN, HIGH);
  // attesa di 1 secondo
  delay(1000);

  // caricamento dalla seconda animazione e visualizzazione su display
  matrix.loadFrame(animazione[1]);
  // spegnimento del LED L
  digitalWrite(LED_BUILTIN, LOW);
  // attesa di 1 secondo
  delay(1000);
}

Buon Making a tutti 🙂