Embedded

Urna eletrônica com display Nextion

urna eletrônica com Nextion

Melhor já começar esclarecer antes que se inicie uma celeuma por aí. O propósito desse artigo é mostrar uma comunicação com dados recebidos pela serial de forma passiva. Essa simulação tem fim exclusivo de tutorial do display e a urna eletrônica simulada aqui passa a milhares de anos luz do funcionamento de uma urna real.

Iniciando o design da urna eletrônica

Para fazer o visual exibido no display, fiz um screenshot de uma imagem da urna que peguei no Google Images. Depois, copiei só a frente da urna e trabalhei em cima dela utilizando o programa Gimp, que possui versões para Linux, Windows e MAC. Você pode conferir no site do Gimp.

No arquivo primário, fui criando camadas, uma para cada botão. Isso foi o suficiente para simular o pressionamento dos botões da urna eletrônica. Também peguei a foto de 2 candidatos e um desejoso, mas a próxima vez que ele estará em uma urna será em seu enterro.

Não pretendo fazer tutoriais de Gimp, mas acho que nem é necessário para um tutorial tão simplório. O primeiro passo será pegar a frente da urna e dimensionar para o tamanho do display. No meu caso, 400×240, que é o display de 3.2″.

urna eletrônica feita no Gimp

Foram separados os botões em camadas simplesmente para modificar o contraste dele. Faz-se um com maior luminosidade, depois faz-se um com a cor natural. Isso é necessário porque o widget de botão requer 2 imagens; a natural e a de reação ao clique.

Na área do display dessa imagem, um retângulo do tamanho das fotos dos candidatos também foi gerado para iniciar o display Nextion como se não houvesse nada, mas sim, já há uma imagem na região do display.

Na urna eletrônica real, dois quadrados ficam acima da imagem para comportar os números. Também, aparece o nome do candidato quando selecionado. Um som é emitido nesse momento e outro ao clicar em confirma ou em branco. só coloquei o som em Confirma.

Projeto no Nextion Editor

Cria-se um novo projeto, rotaciona-se a tela à 90 graus e seleciona-se o display que será utilizado. A composição da tela ficou assim:

urna eletrônica no nextion editor

t0

Um label foi adicionado para fazer uma brincadeira, que você vê no vídeo. A lógica para o label é simples; não exibe nada no início. Se clicar em “Branco”, um texto é exibido. Clicando em corrige, o texto é retirado novamente.

p0

Incluí o widget Picture para exibir a imagem do candidato selecionado. Esse widget está sendo iniciado com um crop do background, de modo que a tela inicial parece estar vazia. Mas não está.

n0 e n1

Utilizando o widget Number, criei as caixas referentes aos números digitados no teclado virtual. Não fiz os quadrados que envolvem os números na urnaeletrônica real. Todos os eventos estão fora destes widgets supracitados.

Button

Adicionei 13 botões, apesar de estar utilizando apenas 8 deles. O código de interação com a interface está disposto neles. O botão Confirmar tem uma instrução extra para enviar ao dispositivo remoto o resultado de cada transação da urna eletrônica de brinquedo.

va0 e va1

Incluí 2 widgets Variable, sendo um deles para coletar e atribuir os números digitados e o outro, para concatenar os valores que serão enviados ao dispositivo remoto.

tm0

Esse timer é responsável por colocar na tela a imagem do respectivo candidato selecionado.

Código utilizado no display

Agora a parte mais deliciosa da brincadeira; o dispositivo remoto não tem nenhuma tarefa relacionada à interface, sua função exclusiva é tratar os valores da conclusão de um voto! Não é fascinante a capacidade desse display? Toda a interface e todo o código de interação feito no Nextion Editor. Tente imaginar a complexidade que seria fazer algo parecido com uma MCU qualquer. E para fazer igual? A chance disso acontecer seria infinitesimal.

Botões

Todos os botões numéricos recebem o mesmo código, mudando apenas o valor que para o widget Number é variável. Os botões ficam assim:

O primeiro passo é saber se n0 está com o valor 0. Se sim, será nele que o número escolhido será incluído. Se não, vai para o n1. Se fosse um projeto sério, uma coisa que deveria ser considerada aqui é a interrupção dessa funcionalidade após alimentar o segundo valor. Também, nenhum candidato começa com 0, senão seria necessário criar uma variável para ser usado como índice do posicionamento.

No final da atribuição, o tm0 é iniciado e então seu código (exibido mais adiante) é executado.

O botão Branco simplesmente alimenta o t0 com uma string. Não faz a votação em branco, de propósito.

O botão Corrigir só atribui valores a algumas variáveis:

No botão Branco, invés do valor “”, está sendo incluído o texto, mas o formato é exatamente o mesmo.

O botão Confirmar é o mais elaborado desses 3.

val1 recebe a soma dos valores de n0 e n1. n0 é multiplicado por 10 por se tratar da posição das dezenas. Quando um voto é confirmado, a urna eletrônica deve voltar ao estado inicial. Na urna eletrônica de verdade é exibida uma mensagem FIM, que deve permanecer lá até que o mesário libere a urna para o próximo eleitor.

A última linha (prints) envia a mensagem para o dispositivo remoto via comunicação serial.

O tm0 recebe o seguinte código:

Aqui estou usando uma lógica que poderia ser simplificada, se fizesse nos botões numéricos a soma das variáveis n0 e n1, mas só pensei nisso depois de ter escrito esse código. Como está funcional, preferi não reescrever, afinal, é só uma brincadeira.

A última linha interrompe o timer.

Código utilizado para recepção dos dados advindos da serial

Fiz a comunicação com o desktop mesmo. Eu não sabia qual era o formato que viria, não sabia  o tipo também, então foi um bocado trabalhoso descobrir. Não achei nenhum exemplo pronto, então fui na tentativa e erro para descobrir a forma ideal de fazer essa comunicação. Estou deixando um exemplo prontinho pra você compreender como é feita a comunicação a partir do display.

Chamei de urna.py:

Só isso, o projeto está pronto! Faz-se o upload, então inicia-se o script Python no console e o resto você vê no video, que estará disponível em algumas horas no nosso canal DobitAoByteBrasil no Youtube. Se inscreva, deixe seu like e clique no sininho para receber notificações, para motivar a produção de mais conteúdos.

Onde adquirir seu display Nextion

Essa belezinha está disponível no parceiro MASUGUX, aproveite que estamos no começo dos tutoriais e vamos tocando juntos os projetos! Vi que as pessoas tem se interessado muito na versão de 4.3″, mas a 3.2″ (a que estou utilizando para escrever esses artigos) é extremamente satisfatória e se for para uso pessoal, está bem mais em conta, dê uma checada nos dois modelos.

Versão 3.2″

Versão 4.3″

Não perca o próximo tutorial, já teremos video e brincadeiras!

Siga-nos no Do bit Ao Byte no Facebook.

Prefere twitter? @DobitAoByte.

Inscreva-se no nosso canal Do bit Ao Byte Brasil no YouTube.

Nossos grupos:

Arduino BR

https://www.facebook.com/groups/microcontroladorarduinobr/
Raspberry Pi BR

https://www.facebook.com/groups/raspberrybr/
Orange Pi BR

https://www.facebook.com/groups/OrangePiBR/
Odroid BR

https://www.facebook.com/groups/odroidBR/
Sistemas Embarcados BR

https://www.facebook.com/groups/SistemasEmbarcadosBR/

Sistemas Eletrônicos

https://www.facebook.com/groups/544679592355388/

Projetos Arduino | Eletrônica

https://www.facebook.com/groups/projetosarduinoeletronica/

ESP8266 e ESP32

https://www.facebook.com/groups/ESP8266BR/

ARM Brasil

https://www.facebook.com/groups/508153815944410/

MIPS BR

https://www.facebook.com/groups/MIPSBR/
Do Bit ao Byte

https://www.facebook.com/groups/dobitaobyte/

Próximo post a caminho!