- Wyświetlacz OLED
- Wymagane składniki
- Połączenia pinowe SPI między NodeMCU a wyświetlaczem OLED
- Programowanie NodeMCU do łączenia się z OLED
- Konwertuj obraz na wartości bitmapowe
W tym samouczku połączymy wyświetlacz OLED z NodeMCU ESP8266. NodeMCU to platforma IoT typu open source, która zawiera oprogramowanie układowe działające na niedrogim układzie SoC ESP8266 Wi-Fi z obsługą Wi-Fi firmy Espressif Systems. Posiada piny GPIO do podłączenia innych urządzeń peryferyjnych oraz obsługuje komunikację szeregową przy pomocy pinów SPI, I2C i UART. Posiada również styki dla ADC i PWM. Wcześniej połączyliśmy OLED z innym mikrokontrolerem, w tym kontrolerem z rodziny ESP (ESP32):
- Połączenie wyświetlacza OLED SSD1306 z Raspberry Pi
- Interfejs wyświetlacza OLED SSD1306 z Arduino
- Zbuduj inteligentny zegarek, łącząc wyświetlacz OLED z telefonem z Androidem za pomocą Arduino
- Zegar internetowy za pomocą ESP32 i wyświetlacza OLED
W tym samouczku użyjemy protokołu SPI do połączenia Monochromatycznego 7-pinowego wyświetlacza OLED SSD1306 0.96 z NodeMCU i nauczymy się wyświetlać obraz na ekranie OLED za pomocą NodeMCU ESP8266.
Wyświetlacz OLED
Organiczna dioda elektroluminescencyjna (OLED) to rodzaj diody elektroluminescencyjnej, w której warstwa emitująca światło wykonana ze związku organicznego emituje światło, gdy dostarczany jest prąd elektryczny. Ta warstwa jest umieszczona między dwiema elektrodami. Technologia ta jest stosowana w ekranach wyświetlaczy, takich jak komputery, telewizory, smartfony itp. Wyświetlacze OLED mają własne światło i nie potrzebują podświetlenia, jak w przypadku LCD, dzięki czemu są energooszczędne i używane z wieloma mikrokontrolerami. Kolejną zaletą używania wyświetlaczy OLED nad LCD jest wyświetlanie dużej i lepszej jakości grafiki na wyświetlaczach OLED. Dowiedz się więcej o technologii wyświetlania OLED tutaj.
Na rynku dostępne są różne rodzaje wyświetlaczy OLED. Wyświetlacze te charakteryzowane są na podstawie koloru, liczby pinów, układu scalonego kontrolera oraz rozmiaru ekranu. Ze względu na kolor diody OLED są dostępne w kolorze monochromatycznym niebieskim, monochromatycznym białym i żółto-niebieskim. A na podstawie komunikacji dostępne są głównie dwa typy diod OLED - 3pin i 7pin. 3-pinowy OLED może być używany w trybie komunikacji I2C, a 7-pinowy OLED może być używany w trybie SPI lub w trybie I2C.
W tym samouczku użyjemy wyświetlacza OLED „ Monochrome 7-pin SSD1306 0,96 ” o szerokości 128 pikseli i długości 64 pikseli. Ten wyświetlacz może pracować zarówno z protokołami komunikacyjnymi SPI, jak i I2C. W tym samouczku będziemy używać protokołu SPI. Układ scalony SSD1306 jest obecny na tym OLED, który pomaga wyświetlać piksele na ekranie.
Wymagane składniki
- Monochromatyczny 7-pinowy wyświetlacz OLED SSD1306 0,96 ”
- NodeMCU ESP8266
- Kabel micro USB
- Płytka prototypowa
- Przewody połączeniowe męsko-męskie
Połączenia pinowe SPI między NodeMCU a wyświetlaczem OLED
Poniżej znajduje się schemat obwodu do połączenia 7-pinowego wyświetlacza OLED z NodeMCU w celu komunikacji przy użyciu protokołu komunikacji szeregowej SPI.
Poniższa tabela przedstawia połączenia między wyświetlaczem OLED a NodeMCU ESP8266. Pin GND idzie do NodeMCU GND, pin VDD można podłączyć do 3,3 V lub 5 V, SCK to pin zegara na wyświetlaczu OLED, który jest podłączony do D5 NodeMCU dla zegara SPI. Pin SDA, który jest pinem MOSI na OLED interfejsu SPI, idzie do D7 NodeMCU. Pin RESET przechodzi do D3. DC, pin polecenia danych jest podłączony do D2 NodeMCU. Ostatni pin to CS idzie do D8, wybór chipów NodeMCU.
|
Nie. |
Wyświetlacz OLED |
NodeMCU |
|
1 |
GND |
GND |
|
2 |
VDD |
3,3 V. |
|
3 |
SCK |
D5 |
|
4 |
MOSI (SPI) lub SDA (I2C) |
D7 |
|
5 |
RESETOWANIE |
D3 |
|
6 |
DC |
D2 |
|
7 |
CS |
D8 |
Tutaj użyjemy biblioteki „ Adafruit _SSD1306.h” i „ Adafruit_GFX.h ” do połączenia OLED z NodeMCU. Otwórz Arduino IDE i zainstaluj najnowszą wersję z Arduino IDE ( Szkic> Dołącz bibliotekę> Zarządzaj bibliotekami lub Ctrl + Shift_I ).
Ponieważ rozmiar naszego wyświetlacza OLED to 128x64 piksele, musimy zmienić plik nagłówkowy Adafruit_SSD1306. Otwórz biblioteki Arduino, przejdź do Adafruit_SSD1306 i otwórz jego plik nagłówkowy ( Adafruit _SSD1306.h ). Skomentuj wiersz „ #define SSD1306_128_32 ” i usuń komentarz z wiersza „#define SSD1306_128_64 ”, jak pokazano na poniższym obrazku, a następnie zapisz plik. Domyślnie ta biblioteka zawiera „# define SSD1306_128_32 ”.
Na koniec zmień numery pinów w przykładzie „ ssd1306_128x64_spi ” Adafruit SSD1306 zgodnie z tabelą pokazaną powyżej. Teraz po uruchomieniu szkicu po poprawnym połączeniu wyświetlacza OLED z NodeMCU zobaczysz logo Adafruit na wyświetlaczu OLED, które jest domyślnie zapisane w bibliotece. Po logo Adafruit wyświetla wiele innych grafik, takich jak linie, prostokąty, trójkąty, okręgi, ciągi znaków, liczby, animacje i bitmapy. Tutaj W tym samouczku nauczymy się, jak wyświetlić dowolny obraz na OLED za pomocą NodeMCU ESP8266.
Programowanie NodeMCU do łączenia się z OLED
Jak zawsze kompletny kod znajduje się na końcu, tutaj szczegółowo wyjaśniliśmy kod.
Uruchom kod , importując niezbędne biblioteki. Ponieważ używamy protokołu SPI, zaimportujemy bibliotekę „SPI.h”, a także zaimportujemy „Adafruit_GFX.h” i „Adafruit_SSD1306.h” dla wyświetlacza OLED.
#zawierać
Nasz rozmiar OLED to 128x64, więc ustawiamy szerokość i wysokość ekranu odpowiednio na 128 i 64. Zdefiniuj więc zmienne dla pinów OLED podłączonych do NodeMCU dla komunikacji SPI.
# zdefiniować SCREEN_WIDTH 128 // szerokość wyświetlacza OLED w pikselach # zdefiniować wysokość ekranu OLED w pikselach // deklaracja dla wyświetlacza SSD1306 podłączonego za pomocą oprogramowania SPI (przypadek domyślny): # zdefiniować OLED_MOSI D7 # zdefiniować OLED_CLK D5 # zdefiniować OLED_DC D2 #define OLED_CS D8 #define OLED_RESET D3 Wyświetlacz Adafruit_SSD1306 (SCREEN_WIDTH, SCREEN_HEIGHT, OLED_MOSI, OLED_CLK, OLED_DC, OLED_RESET, OLED_CS);
Zainicjuj wyświetlacz OLED za pomocą SSD1306_SWITCHCAPVCC, aby wygenerować 3,3 V wewnętrznie w celu zainicjowania wyświetlacza.
if (! display.begin (SSD1306_SWITCHCAPVCC)) { Serial.println (F ("alokacja SSD1306 nie powiodła się")); dla(;;); // Nie kontynuuj, zapętlaj na zawsze }
Wyświetlanie ekranu OLED jest czyszczone przed wyświetleniem czegokolwiek przez wywołanie funkcji display.clearDisplay (). Możemy ustawić rozmiar czcionki do 2 poprzez wywołanie funkcji SetTextSize (font-size), i ustawić kolor tekstu i pozycji kursora za pomocą SetTextColor i setCursor funkcji . Polecenie Display.display () służy do przesyłania danych do wewnętrznej pamięci kontrolera SSD1306. Po przeniesieniu na ekranie pojawia się piksel. Teraz możemy rozpocząć przewijanie tekstu na różne sposoby, wywołując display.startscrollright (x-pos, y-pos) i display.startscrollleft (x-pos, y-pos) na czas podany w funkcji opóźnienia. Przewijanie tekstu można zatrzymać za pomocą funkcji display.stopscroll ().
void testscrolltext (void) {display.clearDisplay (); // wyczyść ekran wyświetlacza OLED display.setTextSize (2); // Rysuj tekst display.setTextColor (WHITE) w skali 2X; display.setCursor (0, 0); display.println (F ("CIRCUIT")); display.println (F ("DIGEST")); display.display (); // Pokaż początkowe opóźnienie tekstu (100); // Przewijaj w różnych kierunkach, zatrzymując się pomiędzy: display.startscrollright (0x00, 0x0F); opóźnienie (2000); display.stopscroll (); opóźnienie (1000); display.startscrollleft (0x00, 0x0F); opóźnienie (2000); display.stopscroll (); opóźnienie (1000); display.startscrolldiagright (0x00, 0x07); opóźnienie (2000); display.startscrolldiagleft (0x00, 0x07); opóźnienie (2000); display.stopscroll (); opóźnienie (1000); }
Nazywamy display.drawBitmap () funkcja, która trwa 6 parametrów (współrzędnej x, y współrzędnych tablica mapy bitowej, szerokość, wysokość i kolor), aby wyciągnąć obraz na wyświetlaczu OLED. Ponieważ nasz rozmiar wyświetlacza to 128x64, ustawiamy szerokość i wysokość odpowiednio na 128 i 64. Tutaj tablica bitmapowa zawiera informacje o pikselach potrzebne do narysowania piksela na ekranie w celu utworzenia obrazu. Tę tablicę bitmap można wygenerować online, co wyjaśniono poniżej, lub dostępnych jest wiele programów do konwersji obrazu na tablicę 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, 0xc0, 0x00, 0x7f, 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, 0x00, 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, 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, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x7c, 0x03, 0xf0, 0x3f, 0x83, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 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, 0xff, 0xfe, 0x01, 0xf0, 0x00, 0x00, 0x03, 0xf8, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x01, 0xf0, 0x00, 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, 0x80, 0x3f, 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, 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, 0x03, 0xe0, 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, 0x03, 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, 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, 0xff, 0x80, 0x00, 0x1e, 0x01, 0xe0, 0x00, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x1e, 0x03, 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, 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, 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, 0xff, 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, 0x01, 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, 0xff, 0xfe, 0x00, 0x07, 0xfc, 0x00, 0x00, 0x07, 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, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x00, 0x00, 0x00, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x03, 0xff, 0xc0, 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, 0x00, 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, 0xff, 0xc0, 0x01, 0xc0, 0x7f, 0xf0, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe0, 0x00, 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, 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, 0xfe, 0x00, 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, CZARNY, BIAŁY); display.display ();
Konwertuj obraz na wartości bitmapowe
Bitmapę online można wygenerować ze strony http://javl.github.io/image2cpp/. Prześlij plik obrazu, który chcesz wyświetlić na OLED i ustaw rozmiar na 128x64. Zostanie wyświetlony podgląd obrazu, a następnie zostanie wygenerowana tablica bitmapowa.
Poniższe zrzuty ekranu pokazują proces generowania wartości bitmapy dowolnego obrazu.
Na koniec prześlij cały kod do NodeMCU ESP8266, a zobaczysz obraz wyświetlany na ekranie OLED. Tutaj wyświetlamy logo CircuitDigest na wyświetlaczu OLED.
