Mais um vídeo de Introdução ao
ESP32 LoRa, desta vez falando especificamente sobre um display gráfico, este de
128x64 pixels. Vamos utilizar a biblioteca SSD1306 para mostrar informações
neste display OLED e apresentar um exemplo de animação utilizando imagens XBM.
Recursos usados
1 Heltec WiFi LoRa 32
Protoboard
O display
O display usado na placa de
desenvolvimento é um OLED de 0,96 polegadas.
Possui 128x64 e é
monocromático.
Possui comunicação I2C e está
ligado ao ESP32 através de 3 fios:
SDA no GPIO4 (para dados)
SCL no GPIO15 (para o clock)
RST no GPIO16 (para o reset e inicio do display)
A biblioteca SSD1306
Pode ser encontrada junto com
o conjunto de bibliotecas fornecidas por Heltec-Aaron-Lee.
Possui diversas funções para escrita
de strings, desenho de linhas, retângulos, círculos e a exibição de imagens.
A animação e os arquivos XBM
Utilizaremos a função drawXbm
da biblioteca para apresentar no display uma animação.
O formato XBM de imagem
consiste em uma matriz de caracteres onde cada elemento representa textualmente
um conjunto de pixels monocromáticos (1
bit cada), através de um valor hexadecimal, equivalente a um byte.
Como são utilizados vários
caracteres para representar um único byte, estes arquivos tendem a ficar
maiores que os formatos adotados atualmente. A vantagem é que podem ser
compilados diretamente sem necessidade de tratamento prévio.
Além da matriz, duas
definições que determinam o tamanho da imagem estão incluidos.
Para construir a animação,
vamos precisar das imagens que formarão os frames.
Podemos utilizar qualquer
software de edição de imagem para trabalhar. Os únicos cuidados que devemos ter
a princípio é manter o tamanho compatível com o do display e usar arquivos
monocromáticos.
Para gerar os arquivos,
podemos desenhá-los ou importar imagens. Aqui, decidimos editar uma imagem
colorida usando o PaintBrush e dela tirar cada um dos frames.
Imagem original - 960x707
pixels - Formato PNG
O próximo passo é torná-la monocromática, salvando como bitmap monocromático.
E em seguida redimensioná-la
para um tamanho compatível com os display.
Atenção com as unidades de
medida. Neste caso ajustamos a imagem para que ela ocupasse a toda a altura o
display (vertical = 64 pixels).
Com a imagem no tamanho
correto, vamos editá-lo para formar os frames. Aqui, fomos apagando cada arco
de nível de sinal e salvando como os frames correspondentes.
Agora temos que converter os
arquivos BMP para o formato XBM
Existem vários softwares que
podem fazer esta conversão. Escolhemos o GIMP por ser uma opção de editor
também.
Em nosso exemplo utilizamos o
Paint para gerar e editar os arquivos, mas todo processo poderia ter sido
realizado no Gimp ou qualquer outro editor.
Para converter, primeiro
abrimos o arquivo.
Com a imagem aberta, podemos
selecionar Arquivo => Exportar
como...
Na janela de Exportar Imagem,
devemos alterar a extensão do arquivo de destino para XBM. O Gimp se
encarregará de identificar o formato desejado e apresentar mais opções . . .
Ao exportar, o Gimp
apresentará outras opções. Podemos deixar os valores padrão.
Após converter todos os arquivos, teremos quatro arquivos XBM, um para cada frame.
Agora, vamos copiá-los para a pasta do código fonte e renomeá-los alterando suas extensões para .h.
Visualizando os arquivos XBM
Podemos abrir os arquivos XBM
em qualquer editor de texto, nele veremos a matriz da imagem e as informações
do tamanho da imagem já definidas.
Código-Fonte: Declarações
Vamos incluir as bibliotecas
necessárias, bem como os arquivos de imagem. Definimos as posições da imagem e
o intervalo de transição. Apontamos ainda os pinos do Oled conectados ao ESP32.
Por fim, criamos e ajustamos o objeto Display.
//Incluindo as bibliotecas necessárias #include <Wire.h> #include "SSD1306.h" //Incluindo os arquivos de imagem #include "frame1.h" #include "frame2.h" #include "frame3.h" #include "frame4.h" //definições de posição da imagem e intervalo de transição #define posX 21 #define posY 0 #define intervalo 500 //Pinos do OLED estão conctados ao ESP32: I2C //OLED_SDA -- GPIO4 //OLED_SCL -- GPIO15 //OLED_RST -- GPIO16 #define SDA 4 #define SCL 15 #define RST 16 //O RST deve ser controlado por software SSD1306 display(0x3c, SDA, SCL, RST); //Cria e ajusta o Objeto display
Código-Fonte: Setup()
Inicializamos o display e
invertemos verticalmente a tela, ação esta opcional.
void setup() { display.init(); //inicia o display display.flipScreenVertically(); //inverte verticalmente a tela (opcional) }
Código-Fonte: Loop()
Primeira coisa no Loop é
limpar a tela. Carregamos para o buffer o frame 1 usando as posições iniciais
posX e posY. Informamos o tamanho da imagem com frame1_width e frame1_height e
o nome da matriz que contem os bits da imagem. Mostramos o buffer no display e aguardamos
um intervalo antes de mostrar o próximo frame.
void loop() { display.clear(); //limpa tela //carrega para o buffer o frame 1 //usando as posições iniciais posX e posY //informa o tamanho da imagem com frame1_width e frame1_height //informa o nome da matriz que contem os bits da imagem, no caso frame1_bits display.drawXbm(posX, posY, frame1_width, frame1_height, frame1_bits); //mostra o buffer no display display.display(); //aguarda um intervalo antes de mostrar o próximo frame delay(intervalo);
Repetimos o processo para
todos os outros frames.
//repete o processo para todos os outros frames display.clear(); display.drawXbm(posX, posY, frame2_width, frame2_height, frame2_bits); display.display(); delay(intervalo); display.clear(); display.drawXbm(posX, posY, frame3_width, frame3_height, frame3_bits); display.display(); delay(intervalo); display.clear(); display.drawXbm(posX, posY, frame4_width, frame4_height, frame4_bits); display.display(); delay(intervalo); }
Fazendo o UpLoad do código
Com a IDE aberta, abra o
arquivo com o código-fonte, clicando duas vezes sobre o arquivo .ino ou através
do menu Arquivo.
Com o Heltec conectado a USB,
selecione o menu Ferramentas => Placa: “Heltec_WIFI_LoRa_32”
Ainda no menu Ferramentas,
selecione a porta COM na qual o Heltec está conectado.
Clique no botão UPLOAD...
...E aguarde a conclusão.
Faça o download dos arquivos:
8 Comentários
Aula Sensacional! Parabéns Fernando!
ResponderExcluirNa Lib https://github.com/Heltec-Aaron-Lee/WiFi_Kit_series,,, os arquivos para OLED não existem mais. Eu testava acompanhando seu tutorial e me deparei com essa surpresa. Como posso resolver isso? Obrigado!
ResponderExcluirVejam isso! Funciona.
Excluirhttps://docs.heltec.cn/#/zh_CN/user_manual/how_to_install_esp32_Arduino
Boa moleque! funcionou aqui também!
Excluir
ResponderExcluirola fernando Suas postagens são excelentes. Estou escrevendo por ajuda, não consigo compilar o código de animação no display oled. Eu recebo um erro nesta linha - display SSD1306 (0x3c, SDA, SCL, RST); -. se eu excluir a palavra RST desta linha, o sketck compila, mas não mostra nenhuma imagem. o link da biblioteca para ssd1306 não contém mais as bibliotecas OLED. Espero que você possa me ajudar com qualquer solução. OBRIGADO
Olá, se vc ler a página do link o Sr Lee explica que colocou o link das bibliotecas Oled em outro lugar e dá para baixar facilmente. depois disso vc precisa colocar as bibliotecas na mesma pasta do programa ino fechar o programa e abrir novamente. No programa essas bibliotecas precisam ser declaradas com "" e nao com <>
ExcluirFernando , boa noite , você pode me ensinar a retirar um erro . O meu esp32 lora está com um erro de que a placa não existe.
ResponderExcluirE esse o erro que está acontecendo .
Traceback (most recent call last):
File "esptool.py", line 2637, in
File "esptool.py", line 2630, in _main
File "esptool.py", line 2356, in main
File "esptool.py", line 407, in connect
File "esptool.py", line 387, in _connect_attempt
File "esptool.py", line 341, in sync
File "esptool.py", line 305, in command
File "site-packages\serial\serialutil.py", line 352, in timeout
File "site-packages\serial\serialwin32.py", line 222, in _reconfigure_port
serial.serialutil.SerialException: Cannot configure port, something went wrong. Original message: WindowsError(31, 'Um dispositivo conectado ao sistema n\xe3o est\xe1 funcionando.')
Failed to execute script esptool
a porta serial Failed to execute script esptool
selecionada não existe ou sua placa não está conectada
Vou responder pois aconteceu comigo. Sei que já faz muito tempo, mas pode servir pra alguém no futuro. No meu caso era o cabo. Estava usando um cabo que não transmitia dados. Troquei e resolveu.
Excluir