2 Comentários

ESP32 e display touch com LittlevGL

Primeiros passos
LittlevGL e ESP32
Este post faz parte da série LittlevGL e ESP32. Leia também os outros posts da série:

No início de 2019 a Espressif anunciou o suporte oficial da biblioteca gráfica LittlevGL para o ESP32, que permite trabalhar com display touch.


Neste post vou compartilhar os primeiros passos de forma prática para começar a utilizar a biblioteca com um display touch. Todo os passos listados aqui está descrito de forma clara no repositório oficial da biblioteca com port do ESP32.

LittlevGL Possui elementos gráficos em forma de gadgets e objetos fáceis de usar, temas, efeitos visuais, simulador multiplataforma e outras features. Entre os gadgets para criar sua GUI personalizada estão: botões, gráficos, imagens, listas, barras deslizantes e muito mais. A biblioteca é open source e gratuita com licença MIT, que permite uso comercial.

O projeto é sólido e com uma documentação muito clara e bem descrita que pode ser encontrada aqui. O repositório oficial é este e os usuários também podem contar com um fórum.

Considerações Técnicas

Este post não cobre o processo de instalação do ESP-IDF, pois já há um artigo no embarcados a respeito. Para tornar o artigo mais acessível, não faremos o port do projeto para eclipse e afins, caso você opte pela utilização, o processo já foi descrito por mim em outro post aqui no embarcados.

A ferramenta utilizada para editar os códigos é o sublime text, sinta-se livre para utilizar qualquer outro editor ou até mesmo utilizar alguma IDE.

Hardware

O hardware que estou utilizando é o Esp32 devkit V1 e um display touch resistivo 240 x 320 px. O display possui o driver ILI9341 e o controlador Touch XPT2046.

display touch com LittlevGL
Figura 1: Foto da placa Esp32 utilizada.

O pinout do projeto ficou da seguinte forma:

ILI9341

MOSICLKCSDCRSTBCKL
13141522421

Tabela 1: Pinout do ESP32 aos pinos do ILI9341 no display.

No projeto original, o sinal DC é conectado ao pino 2, porém achei mais conveniente colocá-lo ao pino 22 pois mais a frente iremos utilizar o pino 2 para acender o led onboard do ESP.

Devido a esta mudança, mais a frente iremos alterar o pino DC no código.

XPT2046

MOSIMISOCLKCSIRQ
231918525

Tabela 2: Pinout do ESP32 aos pinos do XPT2046 no display.

Clonando o projeto para trabalhar com display touch e LittlevGL

Na data deste artigo o projeto é compatível com a versão 3.X e 4.X do IDF. Portanto você poderá usar o Make ou o CMake - é recomendável que seja utilizado a versão 4.x para utilizar o CMake. Os comandos de build utilizados neste artigo serão usando idf.py (que chama o CMake). Se você for utilizar Make, troque o “idf.py” por “make” nos comandos.

Quem utiliza Windows irá usar o “ESP-IDF Command Prompt” para executar os comandos. Ao abrir o executável, o caminho inicial já é da sua pasta IDF. Quem utiliza o Linux deverá utilizar o terminal e navegar até a pasta de projetos e se atentar as permissões do usuário que utiliza. Se necessário utilize o sudo para executar os comandos como root.

Vamos navegar até a pasta de projetos do IDF e começar clonando o repositório.

display touch com LittlevGL
Figura 2: Clonando o repositório para o diretório.

Aguarde o download e após isto, execute os comandos abaixos.

Ao abrir o menuconfig, utilize as setas para nevegar até “Component config” e pressione enter. Conforme imagem abaixo.

display touch com LittlevGL
Figura 3: Aparência do menuconfig.

Em “Component Config”, navegue até o “LittlevGL (LVGL)” e pressione enter.

display touch com LittlevGL
Figura 4: Selecionando o componente LittlevGL para configuração.

Se houver algum display pré configurado, retire e coloque “none” para aparecer as opções de configuração, pois nós iremos configurar nosso display manualmente.

Figura 5: Retirando a pré configuração de displays.

Utilize os parâmetros conforme imagem abaixo e logo em seguida entre em “Touchpanel Configuration”.

Figura 6: Mostrando as configurações do display e entrando no menu de configuração do touch.

Utilize os parâmetros conforme imagem abaixo.

Obs: você pode mexer nos valores para calibrar o posicionamento e resolução do toque. Esta configuração foi a que melhor se adequou em meus testes.

Figura 7: Configurando parâmetros do touch.

Agora você já pode clicar em save e salvar todas as suas modificações. Após isto, clique em Exit para sair e confirme que deseja salvar se for perguntado.

Após configurar todos os parâmetros no menuconfig, abra o arquivo ili9341.h que se encontra em: ~\lv_port_esp32_ili9341\components\lvgl_ili9341

Nos defines faça a seguinte alteração do pino DC para o GPIO 22:

#define ILI9341_DC   22

Figura 8: definindo sinal DC como pino 22.

Pronto! Agora é só executar o seguinte comando para build e flash:

Troque o X pelo número da porta em que o dispositivo está conectado.

Se você estiver utilizando o IDF 3.X utilize o seguinte comando (neste caso a porta é configurada no próprio menuconfig): $ make flash

O primeiro processo de build do projeto demora alguns minutos. Aguarde.

Resultados no display touch

Esta são as imagens do nosso projeto funcionando! O Exemplo conta com teclado QWERTY, listas, gráfico e alterna automaticamente entre as abas.

display touch com LittlevGL
Figura 9: Demo funcionando.
display touch com LittlevGL
Figura 10: Demo funcionando.
display touch com LittlevGL
Figura 11: Demo funcionando.

Este post foi útil para você? tem sugestões?


Deixe um comentário. Seu feedback é muito importante para mim.

Saiba mais sobre display touch com LittlevGL

Espressif anuncia suporte para bibliotecas gráficas no ESP32

Outros artigos da série

LittlevGL e ESP32 - Portando para um projeto existente >>
Este post faz da série LittlevGL e ESP32. Leia também os outros posts da série:
Licença Creative Commons Esta obra está licenciada com uma Licença Creative Commons Atribuição-CompartilhaIgual 4.0 Internacional.

Receba os melhores conteúdos sobre sistemas eletrônicos embarcados, dicas, tutoriais e promoções.

Software » ESP32 e display touch com LittlevGL
Talvez você goste:
Comentários:

2
Deixe um comentário

avatar
1 Comentários
1 Respostas
0 Seguidores
 
Discussão de maior alcance
Discussão mais quente
2 Autores de comentários
Muriel CostaJoselito Oliveira Comentários recentes
  Notificações  
recentes antigos mais votados
Notificar
Joselito Oliveira
Visitante
joselito

Olá Muriel.
Ótimo post.
Eu tenho uma dúvida em relação a ligação do display na ESP32.
Verifiquei que tanto o display quanto o toutch utilizam o SPI como meio de comunicação, e esse protocolo pode ser usando com mais de um device conetado ao mesmo barramento sendo apenas o pino CS de cada device com GPIO's respectivos no ESP32.
será que o codigo não poderia utilizar esse recurso, para ao invez de utilizar duas SPI, usar apenas uma e assim economizar GPIO's.
DEsde já agradeço pelo excelente post.

Séries



Outros da Série

Menu