- Display OLED
- Componentes necessários
- Conexões de pinos SPI entre NodeMCU e display OLED
- NodeMCU de programação para interface OLED
- Converter imagem em valores de bitmap
Neste tutorial, faremos a interface do display OLED com o NodeMCU ESP8266. NodeMCU é uma plataforma de IoT de código aberto que inclui firmware que é executado no SoC de Wi-Fi ESP8266 habilitado para Wi-Fi de baixo custo da Espressif Systems. Possui pinos GPIO para conectar outros periféricos e suporta comunicação serial usando pinos SPI, I2C e UART. Ele também possui pinos para ADC e PWM. Anteriormente, fizemos a interface do OLED com outro microcontrolador, incluindo o controlador da família ESP (ESP32):
- Interface do display OLED SSD1306 com Raspberry Pi
- Interface do display OLED SSD1306 com o Arduino
- Construir um Smart Watch através da interface do display OLED com o telefone Android usando o Arduino
- Relógio da Internet usando ESP32 e display OLED
Neste tutorial, usaremos o protocolo SPI para fazer a interface do display OLED SSD1306 0,96 monocromático de 7 pinos com o NodeMCU e aprenderemos a exibir a imagem na tela OLED com o NodeMCU ESP8266.
Display OLED
O Diodo Emissor de Luz Orgânico (OLED) é um tipo de Diodo Emissor de Luz em que uma camada emissora de luz feita de composto orgânico emite luz quando a corrente elétrica é fornecida. Esta camada é colocada entre dois eletrodos. Esta tecnologia é utilizada em ecrãs como computadores, televisores, smartphones, etc. Os ecrãs OLED têm luz própria e não precisam de retroiluminação como no LCD, pelo que são eficientes em termos de energia e utilizados com muitos microcontroladores. Outra vantagem de usar telas OLED em vez de LCD é a exibição de gráficos grandes e de melhor qualidade em OLEDs. Saiba mais sobre a tecnologia de exibição OLED aqui.
Existem vários tipos de monitores OLED disponíveis no mercado. Esses visores são caracterizados com base na cor, número de pinos, IC do controlador e tamanho da tela. Com base na cor, os OLEDs estão disponíveis em azul monocromático, branco monocromático e amarelo / azul. E com base na comunicação, principalmente dois tipos de OLEDs estão disponíveis - 3 pinos e 7 pinos. O OLED de 3 pinos pode ser usado no modo de comunicação I2C e o OLED de 7 pinos pode ser usado no modo SPI ou no modo I2C.
Neste tutorial, usaremos um display OLED “ SSD1306 0,96 monocromático de 7 pinos ” com 128 pixels de largura e 64 pixels de comprimento. Este monitor pode funcionar com os protocolos de comunicação SPI e I2C. Usaremos o protocolo SPI neste tutorial. SSD1306 IC está presente neste OLED que ajuda a exibir os pixels na tela.
Componentes necessários
- Tela OLED SSD1306 de 0,96 ”monocromática de 7 pinos
- NodeMCU ESP8266
- Cabo micro usb
- Tábua de pão
- Fios de ligação macho para macho
Conexões de pinos SPI entre NodeMCU e display OLED
Abaixo está o diagrama de circuito para conectar o display OLED de 7 pinos com o NodeMCU para se comunicar usando o protocolo de comunicação serial SPI.
A tabela abaixo mostra as conexões entre o display OLED e o NodeMCU ESP8266. O pino GND vai para NodeMCU GND, o pino VDD pode ser conectado a 3,3 V ou 5 V, SCK é o pino do relógio no display OLED que está conectado ao D5 do NodeMCU para relógio SPI. O pino SDA que é o pino MOSI no OLED da interface SPI vai para D7 do NodeMCU. O pino RESET vai para D3. DC, o pino de comando de dados está conectado a D2 de NodeMCU. O último pino é CS vai para D8, seleção de chip de NodeMCU.
|
Não. |
Display Oled |
NodeMCU |
|
1 |
GND |
GND |
|
2 |
VDD |
3,3 V |
|
3 |
SCK |
D5 |
|
4 |
MOSI (SPI) ou SDA (I2C) |
D7 |
|
5 |
REDEFINIR |
D3 |
|
6 |
DC |
D2 |
|
7 |
CS |
D8 |
Aqui, usaremos as bibliotecas “ Adafruit _SSD1306.h” e “ Adafruit_GFX.h ” para fazer a interface de OLED com NodeMCU. Abra o Arduino IDE e instale a versão mais recente do Arduino IDE ( Sketch> Incluir Biblioteca> Gerenciar Bibliotecas ou Ctrl + Shift_I ).
Como o tamanho do pixel do nosso display OLED id 128x64, portanto, temos que fazer uma mudança no arquivo de cabeçalho de Adafruit_SSD1306. Abra as bibliotecas do Arduino, vá para Adafruit_SSD1306 e abra seu arquivo de cabeçalho ( Adafruit _SSD1306.h ). Comente a linha “ #define SSD1306_128_32 ” e descomente a linha “#define SSD1306_128_64 ” conforme mostrado na imagem abaixo e salve o arquivo. Por padrão, esta biblioteca vem com “# define SSD1306_128_32 ”.
Finalmente, altere os números dos pinos no exemplo “ ssd1306_128x64_spi ” Adafruit SSD1306 de acordo com a tabela mostrada acima. Agora, ao executar o esboço após fazer a conexão adequada do display OLED com o NodeMCU, você verá o logotipo da Adafruit no display OLED, que por padrão é salvo na biblioteca. Após o logotipo da Adafruit, ele exibe muitos outros gráficos como linhas, retângulos, triângulos, círculos, strings, números, animações e bitmap. Aqui neste tutorial, aprenderemos como exibir qualquer imagem em OLED com NodeMCU ESP8266.
NodeMCU de programação para interface OLED
Como sempre, o código completo é fornecido no final, aqui explicamos o código em detalhes.
Inicie o código importando as bibliotecas necessárias. Como estamos usando o protocolo SPI, importaremos a biblioteca “SPI.h” e também importaremos “Adafruit_GFX.h” e “Adafruit_SSD1306.h” para display OLED.
#incluir
O tamanho do nosso OLED é 128x64, portanto, definimos a largura e a altura da tela como 128 e 64, respectivamente. Portanto, defina as variáveis para os pinos OLED conectados ao NodeMCU para comunicação SPI.
#define SCREEN_WIDTH 128 // Largura do display OLED, em pixels #define SCREEN_HEIGHT 64 // Altura do display OLED, em pixels // Declaração para display SSD1306 conectado usando software SPI (caso padrão): #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);
Inicialize o display OLED usando SSD1306_SWITCHCAPVCC para gerar 3,3 V internamente para inicializar o display.
if (! display.begin (SSD1306_SWITCHCAPVCC)) { Serial.println (F ("SSD1306 alocação falhou")); para(;;); // Não continue, faça um loop para sempre }
A exibição da tela OLED é limpa antes de exibir qualquer coisa, chamando a função display.clearDisplay (). Definimos o tamanho da fonte como 2 chamando a função setTextSize (font-size) e definimos a cor do texto e a posição do cursor usando setTextColor e a função setCursor . O comando Display.display () é usado para transferir dados para a memória interna do controlador SSD1306. Após a transferência, o pixel aparece na tela. Agora podemos começar a rolar o texto de várias maneiras chamando display.startscrollright (x-pos, y-pos) e display.startscrollleft (x-pos, y-pos) para o tempo dado na função de atraso. A rolagem do texto pode ser interrompida usando a função display.stopscroll ().
void testscrolltext (void) {display.clearDisplay (); // limpa a tela de exibição do OLED display.setTextSize (2); // Desenhe texto em escala 2X display.setTextColor (WHITE); display.setCursor (0, 0); display.println (F ("CIRCUITO")); display.println (F ("DIGEST")); display.display (); // Mostra o atraso do texto inicial (100); // Rola em várias direções, pausando entre: display.startscrollright (0x00, 0x0F); atraso (2000); display.stopscroll (); atraso (1000); display.startscrollleft (0x00, 0x0F); atraso (2000); display.stopscroll (); atraso (1000); display.startscrolldiagright (0x00, 0x07); atraso (2000); display.startscrolldiagleft (0x00, 0x07); atraso (2000); display.stopscroll (); atraso (1000); }
Chamamos a função display.drawBitmap () que usa 6 parâmetros (coordenada x, coordenada y, matriz de bitmap, largura, altura e cor) para desenhar a imagem em OLED. Como o tamanho da tela é 128x64, definimos a largura e a altura como 128 e 64, respectivamente. Aqui, a matriz de bitmap contém as informações de pixel para desenhar o pixel na tela para criar a imagem. Essa matriz de bitmap pode ser gerada online, conforme explicado abaixo, ou há muitos softwares disponíveis para converter imagens em matriz de 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, 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, 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, 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, 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, 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, 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, 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, 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, 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, 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, BLACK, WHITE); display.display ();
Converter imagem em valores de bitmap
O bitmap online pode ser gerado em http://javl.github.io/image2cpp/. Carregue o arquivo de imagem que deseja exibir no OLED e defina o tamanho como 128x64. Uma imagem de visualização será exibida e, em seguida, a matriz de bitmap será gerada.
As capturas de tela abaixo mostram o processo para gerar o valor de bitmap de qualquer imagem.
Finalmente, carregue o código completo no NodeMCU ESP8266 e você verá a imagem exibida na tela OLED. Aqui estamos exibindo o logotipo da CircuitDigest no display OLED.
