fbpixel
Etiquetas: , , , ,

O ecrã Nextion é uma das melhores soluções para criar uma interface gráfica para controlar o seu projeto Arduino. A interface mais conhecida para interagir com um Arduino é o ecrã LCD com alguns botões e potenciómetros à custa de E/S e de sobrecarga de código Arduino. Neste tutorial, veremos como configurar um ecrã Nextion e como utilizá-lo com o Arduino.

Hardware

  • Arduino (ou outra placa com porta UART)
  • Ecrã Nextion
  • Adaptador USB-TTL 5V
  • 4x fio Dupont com conetor JST

Apresentação do cartão Nextion

A interface básica para controlar um Arduino, e presente em todos os kits, é o ecrã LCD com alguns botões e potenciómetros, que existe sob a forma de um LCD Shield. Existem também Shields com ecrãs tácteis, mas estes utilizam todas as E/S do Arduino e sobrecarregam o código do Arduino. Uma solução é utilizar um ecrã Nextion, que contém o seu próprio programa e comunica com qualquer microcontrolador através da porta série.

nextiron-screen-back Utilizar um ecrã Nextion com o Arduino

N.B.: É possível criar uma interface gráfica num PC ou criar uma interface Web para controlar o projeto, adicionando um módulo de comunicação sem fios.

Instalação e apresentação do editor Nextion

Descarregar e instalar o editor Nextion

nextion-editor-overview Utilizar um ecrã Nextion com o Arduino

Quando abre um novo projeto ou ficheiro, o software pede-lhe o modelo de ecrã (no nosso caso, NX4832K035_011). Pode alterar a seleção no menu Dispositivo>Definições.

nextion-editor-select-model Utilizar um ecrã Nextion com o Arduino

Em seguida, escolha a orientação do ecrã e a codificação.

nextion-editor-select-direction Utilizar um ecrã Nextion com o Arduino

Criar uma interface gráfica

Vamos utilizar o editor gráfico Nextion para criar a nossa interface gráfica. Neste exemplo, vamos adicionar:

  • Uma imagem
  • Alguns textos para o título ou para apresentar dados
  • Um botão que altera a interface
  • Um botão que envia um comando para a porta série
  • Um temporizador que actualiza a interface
  • Uma variável que armazena os dados recebidos da porta série
nextion-editor-hmi-example-display Utilizar um ecrã Nextion com o Arduino

Para adicionar um objeto, clique no objeto pretendido na janela Caixa de ferramentas e o objeto será automaticamente inserido na janela Mostrar. Pode então configurar o objeto na janela Atributos

Pode descarregar o ficheiro GUI para o importar para o Editor Nextion. Com este exemplo, será capaz de criar interfaces muito mais complexas.

Adicionar uma imagem

Para adicionar uma imagem, comece por importá-la para o software utilizando o botão (+) na janela “Imagem”.

nextion-editor-add-picture Utilizar um ecrã Nextion com o Arduino

Pode então inserir um objeto Imagem na janela de visualização e selecionar a imagem premindo o atributo pic > procurar….

nextion-editor-browse-picture Utilizar um ecrã Nextion com o Arduino

N.B.: Adicionar uma imagemaux dimensions désirées

Adicionar texto

Antes de adicionar um objeto de texto, é necessário gerar um tipo de letra. Isto pode ser feito em Ferramentas> Gerar tipo de letra

nextion-editor-tools Utilizar um ecrã Nextion com o Arduino

Quando o tipo de letra tiver sido gerado, pode seleccioná-lo no atributo font do objeto Text. Pode então modificar o texto no atributo txt (tenha em atenção o número máximo de caracteres txt_maxl).

nextion-editor-add-text Utilizar um ecrã Nextion com o Arduino

Estamos a adicionar quatro objectos de texto:

  • A etiqueta do título
  • o estado do LED
  • a etiqueta “Analog Val
  • o valor analógico recebido do microcontrolador

Adicionar um botão

Depois de o objeto botão ter sido adicionado à interface, pode ajustar os seus atributos:

  • o texto apresentado
  • a cor quando o botão é premido
  • a cor quando libertada

Na janela Eventos, pode programar o que o ecrã fará quando o botão for premido ou libertado. Há uma série de instruções que pode utilizar nestas janelas. Estas incluem

  • Modificar elementos da interface (por exemplo, t0.txt=”Pressionado”)
  • Enviar identificador de botão através da porta série
  • Envoyer une autre commande avec prints
  • Botão b0
nextion-editor-events Utilizar um ecrã Nextion com o Arduino
  • Botão b1

No separador Touch Release Event, escrevemos o seguinte comando, que é um comando predefinido da biblioteca Nextion e corresponde a trigger1()

printh 23 02 54 01
  • Botão b2

Para o botão b2, utilizamos o mesmo comando, mas para trigger2()

printh 23 02 54 02

Adicionar um temporizador

O objeto Timer pode ser utilizado para executar código numa base regular. É particularmente útil para obter dados da porta série e atualizar a interface.

No separador Evento do temporizador, utilizamos a função covx para converter o valor da variável numa cadeia de caracteres e escrevê-la no texto t4

covx analog0.val,t4.txt,0,0
nextion-editor-timer-event Utilizar um ecrã Nextion com o Arduino

Carregar o programa no ecrã Nextion

Ligar o cartão Nextion ao conversor USB-TTL

nextion-wiring-upload Utilizar um ecrã Nextion com o Arduino

Para carregar a interface, prima Compilar e depois Carregar

nextion-editor-upload Utilizar um ecrã Nextion com o Arduino

Ligar o ecrã Nextion ao microcontrolador Arduino

nextion-arduino-wiring Utilizar um ecrã Nextion com o Arduino

Para descarregar o código Arduino para a placa, os pinos RX e TX devem ser desligados do ecrã.

Usando a biblioteca Nextion.h

Existem várias bibliotecas que podem ser utilizadas para gerir um ecrã Nextion

Utilizamos o EasyNextion

No Editor Nextion, definimos um evento de libertação “printh 23 02 54 01” para o botão ON e um evento de libertação “printh 23 02 54 02” para o botão Off.

Utilizando a função NextionListen(), estes comandos activam as funções trigger1 e trigger2.

#include "EasyNextionLibrary.h"

#define baudrate 9600

EasyNex myNex(Serial);

//Variables
uint16_t analog;
bool ledstate;

const int REFRESH_TIME = 100;
unsigned long refresh_timer = millis();

void setup() {
  myNex.begin(baudrate);

  pinMode(A0, INPUT);
  pinMode(LED_BUILTIN, OUTPUT);
}

void loop() {
  myNex.NextionListen();

  if ((millis() - refresh_timer) > REFRESH_TIME) {
    analog = analogRead(A0);
    myNex.writeNum("analog0.val", analog);

    refresh_timer = millis();
  }
}

//`printh 23 02 54 XX` , where `XX` the id for the triggerXX() in HEX.
void trigger1() {
  digitalWrite(LED_BUILTIN, HIGH);
  myNex.writeStr("t2.txt", "LED ON");
}

void trigger2() {
  digitalWrite(LED_BUILTIN, LOW);
  myNex.writeStr("t2.txt", "LED OFF");
}

Resultados

nextion-ihm-example-btn-pressed Utilizar um ecrã Nextion com o Arduino
nextion-ihm-example-btn-released Utilizar um ecrã Nextion com o Arduino
nextion-ihm-example-btn-on Utilizar um ecrã Nextion com o Arduino

Bónus: Simulador do editor Nextion

A Nextion propõe um simulador para testar as interacções entre o ecrã, o microcontrolador e a interface gráfica. Este simulador pode ser acedido clicando em “Debug”.

nextion-editor-simulator Utilizar um ecrã Nextion com o Arduino

Fontes