Interfacciamento del display oled con nodemcu esp8266: visualizzazione dell'immagine bitmap su oled

In questo tutorial interfacciamo il display OLED con NodeMCU ESP8266. NodeMCU è una piattaforma IoT open source che include firmware che gira sul SoC Wi-Fi ESP8266 abilitato Wi-Fi a basso costo di Espressif Systems. Ha pin GPIO per il collegamento di altre periferiche e supporta la comunicazione seriale utilizzando i pin SPI, I2C e UART. Ha anche pin per ADC e PWM. In precedenza abbiamo interfacciato OLED con altri microcontrollori incluso il controller della famiglia ESP (ESP32):

Interfacciamento del display OLED SSD1306 con Raspberry Pi
Interfacciamento del display OLED SSD1306 con Arduino
Costruisci uno smartwatch interfacciando il display OLED con il telefono Android utilizzando Arduino
Orologio Internet tramite ESP32 e display OLED

In questo tutorial useremo il protocollo SPI per interfacciare il display OLED SSD1306 0.96 monocromatico a 7 pin con NodeMCU e impareremo a visualizzare l'immagine sullo schermo OLED con NodeMCU ESP8266.

Display OLED

Il diodo organico a emissione di luce (OLED) è un tipo di diodo a emissione di luce in cui uno strato emettitore di luce costituito da composto organico emette luce quando viene fornita corrente elettrica. Questo strato è posto tra due elettrodi. Questa tecnologia viene utilizzata negli schermi di visualizzazione come computer, televisori, smartphone ecc. I display OLED hanno la propria luce e non necessitano di retroilluminazione come negli LCD, quindi sono efficienti dal punto di vista energetico e utilizzati con molti microcontrollori. Un altro vantaggio dell'utilizzo di display OLED su LCD è la visualizzazione di una grafica ampia e di migliore qualità sugli OLED. Scopri di più sulla tecnologia OLED Display qui.

Esistono vari tipi di display OLED disponibili sul mercato. Questi display sono caratterizzati in base al colore, al numero di pin, al controller IC e alle dimensioni dello schermo. In base al colore, gli OLED sono disponibili nei colori blu monocromatico, bianco monocromatico e giallo / blu. E sulla base della comunicazione, sono disponibili principalmente due tipi di OLED: 3 pin e 7 pin. OLED a 3 pin può essere utilizzato in modalità di comunicazione I2C e OLED a 7 pin può essere utilizzato in modalità SPI o in modalità I2C.

In questo tutorial utilizzeremo il display OLED " Monochrome 7-pin SSD1306 0.96 " che è largo 128 pixel e lungo 64 pixel. Questo display può funzionare su entrambi i protocolli di comunicazione SPI e I2C. Useremo il protocollo SPI in questo tutorial. L'IC SSD1306 è presente su questo OLED che aiuta a visualizzare i pixel sullo schermo.

Componenti richiesti

Display OLED SSD1306 da 0,96 pollici monocromatico a 7 pin
NodeMCU ESP8266
Cavo micro USB
Breadboard
Cavi ponticello maschio a maschio

Connessioni pin SPI tra NodeMCU e display OLED

Di seguito è riportato lo schema del circuito per il collegamento del display OLED a 7 pin con NodeMCU per comunicare utilizzando il protocollo di comunicazione seriale SPI.

La tabella seguente mostra le connessioni tra display OLED e NodeMCU ESP8266. Il pin GND va a NodeMCU GND, il pin VDD può essere collegato a 3,3 V o 5 V, SCK è il pin dell'orologio sul display OLED che è collegato a D5 di NodeMCU per l'orologio SPI. Il pin SDA che è il pin MOSI sull'OLED dell'interfaccia SPI va a D7 di NodeMCU. Il pin RESET va a D3. DC, il pin di comando dati è collegato a D2 di NodeMCU. L'ultimo pin è CS va a D8, selezione del chip di NodeMCU.

No.	Display Oled	NodeMCU
1	GND	GND
2	VDD	3,3V
3	SCK	D5
4	MOSI (SPI) o SDA (I2C)	D7
5	RIPRISTINA	D3
6	DC	D2
7	CS	D8

Qui useremo le librerie " Adafruit _SSD1306.h" e " Adafruit_GFX.h " per interfacciare OLED con NodeMCU. Apri l'IDE di Arduino e installa l'ultima versione dall'IDE di Arduino ( Sketch> Includi libreria> Gestisci librerie o Ctrl + Shift_I ).

Poiché la dimensione dei pixel del nostro display OLED è 128x64, dobbiamo quindi modificare il file di intestazione di Adafruit_SSD1306. Apri le librerie Arduino, vai su Adafruit_SSD1306 e apri il suo file di intestazione ( Adafruit _SSD1306.h ). Commentare la riga " #define SSD1306_128_32 " e rimuovere il commento dalla riga "#define SSD1306_128_64 " come mostrato nell'immagine sottostante e quindi salvare il file. Per impostazione predefinita, questa libreria include " # define SSD1306_128_32 ".

Infine cambia i numeri dei pin in " ssd1306_128x64_spi " Adafruit SSD1306 esempio secondo la tabella mostrata sopra. Ora, quando esegui lo schizzo dopo aver effettuato la corretta connessione del display OLED con NodeMCU, vedrai il logo di Adafruit sul display OLED che per impostazione predefinita è salvato nella libreria. Dopo il logo Adafruit, mostra molti altri elementi grafici come linee, rettangoli, triangoli, cerchi, stringhe, numeri, animazioni e bitmap. Qui In questo tutorial impareremo come visualizzare qualsiasi immagine su OLED con NodeMCU ESP8266.

Programmazione NodeMCU per interfacciare OLED

Come sempre il codice completo viene fornito alla fine, qui abbiamo spiegato il codice in dettaglio.

Avvia il codice importando le librerie necessarie. Poiché stiamo utilizzando il protocollo SPI, quindi importeremo la libreria "SPI.h" e importeremo anche "Adafruit_GFX.h" e "Adafruit_SSD1306.h" per il display OLED.

#includere #include #include

La nostra dimensione OLED è 128x64, quindi stiamo impostando la larghezza e l'altezza dello schermo rispettivamente su 128 e 64. Quindi definire le variabili per i pin OLED collegati a NodeMCU per la comunicazione SPI.

#define SCREEN_WIDTH 128 // Larghezza display OLED, in pixel #define SCREEN_HEIGHT 64 // Altezza display OLED, in pixel // Dichiarazione per display SSD1306 connesso tramite software SPI (caso predefinito): #define OLED_MOSI D7 #define OLED_CLK D5 #define OLED_DC D2 #define OLED_CS D8 #define OLED_RESET D3 Adafruit_SSD1306 display (SCREEN_WIDTH, SCREEN_HEIGHT, OLED_MOSI, OLED_CLK, OLED_DC, OLED_RESET, OLED_CS);

Inizializza il display OLED utilizzando SSD1306_SWITCHCAPVCC per generare 3,3 V internamente per inizializzare il display.

if (! display.begin (SSD1306_SWITCHCAPVCC)) { Serial.println (F ("SSD1306 allocation failed")); per(;;); // Non procedere, loop per sempre }

La visualizzazione dello schermo OLED viene cancellata prima di visualizzare qualsiasi cosa chiamando la funzione display.clearDisplay (). Abbiamo impostarne la dimensione di 2 chiamando la funzione setTextSize (font-size), e impostare il colore del testo e la posizione del cursore utilizzando SetTextColor e setCursor funzione . Il comando Display.display () viene utilizzato per trasferire i dati nella memoria interna del controller SSD1306. Dopo il trasferimento, i pixel vengono visualizzati sullo schermo. Ora possiamo iniziare a far scorrere il testo in vari modi chiamando display.startscrollright (x-pos, y-pos) e display.startscrollleft (x-pos, y-pos) per il tempo dato nella funzione di ritardo. Lo scorrimento del testo può essere interrotto utilizzando la funzione display.stopscroll ().

void testscrolltext (void) {display.clearDisplay (); // cancella lo schermo del display OLED display.setTextSize (2); // Disegna display.setTextColor di testo in scala 2X (WHITE); display.setCursor (0, 0); display.println (F ("CIRCUIT")); display.println (F ("DIGEST")); display.display (); // Mostra il ritardo del testo iniziale (100); // Scorri in varie direzioni, fermandoti in mezzo: display.startscrollright (0x00, 0x0F); ritardo (2000); display.stopscroll (); ritardo (1000); display.startscrollleft (0x00, 0x0F); ritardo (2000); display.stopscroll (); ritardo (1000); display.startscrolldiagright (0x00, 0x07); ritardo (2000); display.startscrolldiagleft (0x00, 0x07); ritardo (2000); display.stopscroll (); ritardo (1000); }

Chiamiamo la funzione display.drawBitmap () che accetta 6 parametri (coordinata x, coordinata y, array bitmap, larghezza, altezza e colore) per disegnare l'immagine su OLED. Poiché la dimensione del nostro display è 128x64, impostiamo la larghezza e l'altezza rispettivamente su 128 e 64. Qui l'array bitmap contiene le informazioni sui pixel per disegnare il pixel sullo schermo per creare l'immagine. Questo array bitmap può essere generato online come spiegato di seguito oppure sono disponibili molti software per convertire un'immagine in array bitmap.

const unsigned char myBitmap PROGMEM = { 0xff, 0xff, 0xff, 0xe0, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0xc0, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf7, 0xc0, 0x00, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc7, 0x80, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x0f, 0x01, 0xc0, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x0f, 0x03, 0xff, 0xc0, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff , 0xff, 0xf8, 0x1e, 0x03, 0x3f, 0xf8, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x3e, 0x03, 0x3f, 0xfc, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe0, 0x3c, 0x03, 0x7f, 0x0x, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x7c, 0x03, 0xf0, 0x3f, 0x83, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0xff, 0xff, 0xff, 0xff 0x78, 0x00, 0xc0, 0x0f, 0xc1, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0xf8, 0x00, 0x00, 0x07, 0xe0, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x01, 0xf0, 0x00, 0x00, 0x03, 0xf8, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x0, 0x01, 0xf 0x00, 0x00, 0xfc, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x03, 0xe0, 0x00, 0x0f, 0x00, 0x7e, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x07, 0xc0, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x7f, 0xf9, 0x80, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0x80, 0xff, 0xf9, 0x80, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0xff, 0xff, 0x80, 0x03, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x01, 0xf0, 0x1f, 0x80, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x03 0x06, 0x00, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x03, 0xc0, 0x00, 0x00, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x07, 0xc0, 0x03, 0x00, 0xff, 0x00, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x07, 0x80, 0x00, 0x00, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80 0x0f, 0x80, 0x00, 0x00, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x0f, 0x00, 0x80, 0x00, 0x00, 0x01, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x1e, 0x01, 0xe0, 0x00, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff , 0x03, 0x00, 0x1e 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x3c, 0x03, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x7c, 0x03, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0xf8, 0x01, 0xe0, 0x00, 0x00, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x00, 0x00, 0x00, 0x00, 0xff, 0x 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x00, 0x00, 0x00, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x00 0x00, 0x00, 0x00, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x00, 0x00 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x01, 0xf0, 0x00, 0x00, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80 0x03, 0xb0, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x03, 0x18, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x03, 0xbc, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0xfe 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x00, 0xff, 0xff, 0x80, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x1f, 0xff, 0x00, 0x00, 0x03 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x00, 0x07, 0xfc, 0x00, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x 0x80, 0x03, 0xf0, 0x00, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe0, 0x01, 0xc0, 0x00, 0x00, 0x0f, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x00, 0x00, 0x00, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x0x, 0xff 0x00, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x00, 0xff, 0xe0, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x00, 0x3f, 0xe0, 0x00, 0x1f, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x00, 0x0e, 0x30, 0x00, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0x07, 0x70, 0x00, 0xff, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x03, 0xe0, 0x1b, 0xfc, 0x01, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x01, 0xc0, 0x7f, 0xf0, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0xe0 0x7f, 0xc0, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x00, 0x67, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x00, 0x00, 0x66, 0x00, 0x1f, 0x 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x00, 0x00, 0x7e, 0x00, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0x00, 0x00, 0x3c, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff }; display.drawBitmap (35, 0, myBitmap, 128, 64, NERO, BIANCO); display.display ();

Converti l'immagine in valori bitmap

Bitmap in linea può essere generato da http://javl.github.io/image2cpp/. Carica il file immagine che desideri visualizzare sull'OLED e imposta la dimensione su 128x64. Verrà mostrata un'immagine di anteprima e quindi verrà generato un array bitmap.

Gli screenshot di seguito mostrano il processo per generare il valore bitmap di qualsiasi immagine.

Infine carica il codice completo in NodeMCU ESP8266 e vedrai l'immagine visualizzata sullo schermo OLED. Qui stiamo visualizzando il logo CircuitDigest sul display OLED.