- Afișaj OLED
- Componente necesare
- Conexiuni Pin SPI între NodeMCU și afișaj OLED
- Programare NodeMCU pentru interfața OLED
- Convertiți imaginea în valori Bitmap
În acest tutorial vom interfața afișajul OLED cu NodeMCU ESP8266. NodeMCU este o platformă IoT open source care include firmware care rulează pe SoC Wi-Fi cu cost redus ESP8266 Wi-Fi SoC de la Espressif Systems. Are pini GPIO pentru conectarea altor periferice și acceptă comunicații seriale utilizând pini SPI, I2C și UART. Are, de asemenea, pini pentru ADC și PWM. Am interfațat anterior OLED cu alt microcontroler, inclusiv controlerul familiei ESP (ESP32):
- Interfațarea afișajului OLED SSD1306 cu Raspberry Pi
- Interfațarea afișajului OLED SSD1306 cu Arduino
- Construiți un ceas inteligent interfațând afișajul OLED cu telefonul Android folosind Arduino
- Ceas Internet utilizând ESP32 și ecran OLED
În acest tutorial vom folosi protocolul SPI pentru a interfața monocrom cu 7 pini SSD1306 0.96 Display OLED cu NodeMCU și vom învăța să afișăm imaginea pe ecranul OLED cu NodeMCU ESP8266.
Afișaj OLED
Dioda Organică Emițătoare de Lumină (OLED) este un fel de diodă emițătoare de lumină în care un strat emițător de lumină care este compus din compus organic emite lumină atunci când este furnizat curent electric. Acest strat este plasat între doi electrozi. Această tehnologie este utilizată pe ecrane precum computere, televizoare, smartphone-uri etc. Ecranele OLED au propria lor lumină și nu au nevoie de lumină de fundal ca în LCD, prin urmare sunt eficiente din punct de vedere energetic și sunt utilizate cu multe microcontrolere. Un alt avantaj al utilizării afișajelor OLED peste LCD este acela de a afișa grafică mare și mai bună pe OLED-uri. Aflați mai multe despre tehnologia de afișare OLED aici.
Există diferite tipuri de afișaje OLED disponibile pe piață. Aceste afișaje sunt caracterizate pe baza culorii, a numărului de pini, a controlerului IC și a dimensiunii ecranului. Pe baza culorii, OLED-urile sunt disponibile în albastru monocrom, alb monocrom și galben / albastru. Și pe baza comunicării, sunt disponibile în principal două tipuri de OLED - 3 pini și 7 pini. OLED cu 3 pini poate fi utilizat în modul de comunicare I2C și OLED cu 7 pini poate fi utilizat fie în modul SPI, fie în modul I2C.
În acest tutorial vom folosi afișajul OLED „ Monochrome 7-pin SSD1306 0.96 ”, care are o lățime de 128 pixeli și o lungime de 64 pixeli. Acest afișaj poate funcționa atât pe protocoalele de comunicații SPI, cât și pe cele I2C. Vom folosi protocolul SPI în acest tutorial. SSD1306 IC este prezent pe acest OLED, care ajută la afișarea pixelilor pe ecran.
Componente necesare
- Afișaj OLED monocrom cu 7 pini SSD1306 0,96 ”
- NodeMCU ESP8266
- Cablu micro USB
- Breadboard
- Fire de la bărbați la bărbați
Conexiuni Pin SPI între NodeMCU și afișaj OLED
Mai jos este Diagrama circuitului pentru conectarea afișajului OLED cu 7 pini cu NodeMCU pentru a comunica utilizând protocolul de comunicație serial SPI.
Tabelul de mai jos prezintă conexiunile dintre afișajul OLED și NodeMCU ESP8266. Pinul GND merge la NodeMCU GND, pinul VDD poate fi conectat la 3,3V sau 5V, SCK este pinul de ceas de pe afișajul OLED care este conectat la D5 al NodeMCU pentru ceasul SPI. Pinul SDA care este pinul MOSI pe interfața OLED a SPI merge la D7 al NodeMCU. PIN-ul RESET merge la D3. DC, pinul de comandă a datelor este conectat la D2 al NodeMCU. Ultimul pin este CS merge la D8, selectarea cipului NodeMCU.
|
Nu. |
Afișaj Oled |
NodeMCU |
|
1 |
GND |
GND |
|
2 |
VDD |
3,3V |
|
3 |
SCK |
D5 |
|
4 |
MOSI (SPI) sau SDA (I2C) |
D7 |
|
5 |
RESET |
D3 |
|
6 |
DC |
D2 |
|
7 |
CS |
D8 |
Aici vom folosi biblioteca „ Adafruit _SSD1306.h” și „ Adafruit_GFX.h ” pentru interfața OLED cu NodeMCU. Deschideți Arduino IDE și instalați cea mai recentă versiune din Arduino IDE ( Sketch> Include Library> Manage Libraries sau Ctrl + Shift_I ).
Deoarece dimensiunea pixelilor ID-ului nostru de afișaj OLED 128x64, trebuie să facem o schimbare în fișierul antet al Adafruit_SSD1306. Deschideți bibliotecile Arduino, accesați Adafruit_SSD1306 și deschideți fișierul antet ( Adafruit _SSD1306.h ). Comentează rândul „ #define SSD1306_128_32 ” și decomentează linia „#define SSD1306_128_64 ” așa cum se arată în imaginea de mai jos și apoi salvează fișierul. În mod implicit, această bibliotecă vine cu „# define SSD1306_128_32 ”.
În cele din urmă, schimbați numerele de pin în exemplul „ ssd1306_128x64_spi ” Adafruit SSD1306 în conformitate cu tabelul prezentat mai sus. Acum, când rulați schița după ce ați făcut conexiunea corectă a ecranului OLED cu NodeMCU, veți vedea sigla Adafruit pe ecranul OLED, care este salvat în mod implicit în bibliotecă. După sigla Adafruit afișează multe alte elemente grafice, cum ar fi linii, dreptunghiuri, triunghi, cercuri, șiruri, numere, animații și bitmap. Aici În acest tutorial vom învăța cum să afișăm orice imagine pe OLED cu NodeMCU ESP8266.
Programare NodeMCU pentru interfața OLED
Ca întotdeauna codul complet este furnizat la sfârșit, aici am explicat codul în detaliu.
Porniți codul importând bibliotecile necesare. Deoarece utilizăm protocolul SPI, vom importa biblioteca „SPI.h” și vom importa și „Adafruit_GFX.h” și „Adafruit_SSD1306.h” pentru afișajul OLED.
#include
Dimensiunea noastră OLED este de 128x64, deci setăm lățimea și înălțimea ecranului ca 128 și respectiv 64. Deci, definiți variabilele pentru pinii OLED conectați la NodeMCU pentru comunicarea SPI.
#define SCREEN_WIDTH 128 // OLED lățime de afișare, în pixeli #define SCREEN_HEIGHT 64 // OLED înălțime de afișare, în pixeli // Declarație pentru afișare SSD1306 conectat folosind software - ul SPI (caz implicit): #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);
Inițializați afișajul OLED utilizând SSD1306_SWITCHCAPVCC pentru a genera 3.3V intern pentru a inițializa afișajul.
if (! display.begin (SSD1306_SWITCHCAPVCC)) { Serial.println (F ("Alocarea SSD1306 a eșuat")); pentru(;;); // Nu continuați, buclați pentru totdeauna }
Afișarea ecranului OLED este ștearsă înainte de a afișa ceva apelând funcția display.clearDisplay (). Am stabilit dimensiunea fontului la 2 prin apelarea funcției setTextSize (font-size), și setați culoarea textului și poziția cursorului prin utilizarea setTextColor și setCursor funcția . Comanda Display.display () este utilizată pentru a transfera date în memoria internă a controlerului SSD1306. După transfer, pixelul apare pe ecran. Acum putem începe să derulați textul în diferite moduri apelând display.startscrollright (x-pos, y-pos) și display.startscrollleft (x-pos, y-pos) pentru timpul dat în funcția de întârziere. Derularea textului poate fi oprită folosind funcția display.stopscroll ().
void testscrolltext (nul) {display.clearDisplay (); // ștergeți ecranul de afișare al ecranului OLED display.setTextSize (2); // Desenați textul la scară 2X display.setTextColor (ALB); display.setCursor (0, 0); display.println (F ("CIRCUIT")); display.println (F ("DIGEST")); display.display (); // Afișați întârzierea textului inițial (100); // Derulați în diferite direcții, oprindu-vă între: display.startscrollright (0x00, 0x0F); întârziere (2000); display.stopscroll (); întârziere (1000); display.startscrollleft (0x00, 0x0F); întârziere (2000); display.stopscroll (); întârziere (1000); display.startscrolldiagright (0x00, 0x07); întârziere (2000); display.startscrolldiagleft (0x00, 0x07); întârziere (2000); display.stopscroll (); întârziere (1000); }
Noi numim display.drawBitmap () funcția care ia 6 parametri (x-coordonate, y-coordonate, bitmap matrice, lățime, înălțime și culoare) pentru a desena imaginea OLED. Deoarece dimensiunea afișajului nostru este de 128x64, prin urmare, setăm lățimea și înălțimea ca 128 și respectiv 64. Aici matricea bitmap conține informații despre pixeli pentru a desena pixelul pe ecran pentru a crea imaginea. Această matrice bitmap poate fi generată online, ceea ce este explicat mai jos sau există multe software-uri disponibile pentru a converti imaginea în matrice 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, 0xf, 0xc7, 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, 0xff, 0xc7, 0x80, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x0f, 0x01, 0xc0, 0x,, 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, 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, 0xfe, 0xfe, 0xfe 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x7c, 0x03, 0xf0, 0x3f, 0x83, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 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, 0xff, 0xfe, 0x01, 0xf0, 0x00, 0x00, 0x03, 0xf8, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfx, 0x0, 0x0 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, 0x80 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 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, 0xff, 0x01, 0xf0, 0x1f, 0x80, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x00 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, 0x00, 0x00, 0x00, 0x00, 0x00 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x07, 0x80, 0x00, 0x00, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 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, 0x00, 0x00, 0x0 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, 0xf8, 0x03, 0xff, 0xff, 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, 0xff 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, 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, 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, 0x00, 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, 0xff, 0x80, 0x00, 0x03, 0xbc, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x00, 0x00 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, 0x00, 0x00 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x00, 0x07, 0xfc, 0x00, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0x80, 0x03, 0xf0, 0x00, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe0, 0x01, 0xc0, 0x00, 0x00, 0x0f, 0x, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x00, 0x00, 0x00, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x0x, 0x0x, 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, 0xff, 0xff, 0xfe, 0x00, 0x0e, 0x30, 0x00, 0x7f, 0xff, 0xff, 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, 0xff, 0xff, 0x00 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, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x00, 0x00, 0x7e, 0x00, 0x7f, 0xff, 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, 0xff, 0xf0, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 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, BLACK, WHITE); display.display ();
Convertiți imaginea în valori Bitmap
Bitmap-ul online poate fi generat de pe http://javl.github.io/image2cpp/. Încărcați fișierul imagine pe care doriți să îl afișați pe OLED și setați dimensiunea 128x64. Va fi afișată o imagine de previzualizare și apoi va fi generată matricea de bitmap.
Capturile de ecran de mai jos arată procesul de generare a valorii bitmap a oricărei imagini.
În cele din urmă, încărcați codul complet în NodeMCU ESP8266 și veți vedea imaginea afișată pe ecranul OLED. Aici afișăm sigla CircuitDigest pe afișajul OLED.
