Exibir Temperatura, Umidade e Pressão do BME280 em Touchscreen Nextion

Componentes e materiais

Arduino Nano R3	1
Sensor Atmosférico BME280 SparkFun	1
Display Touch TFT LCD HMI Nextion NX8048T070 7.0"	1
Conversor USB-Serial FT232RL SparkFun	1

Aplicativos e serviços online

• Visuino - Ambiente de Desenvolvimento Gráfico para Arduino
• Arduino IDE

Sobre o projeto

Existem muitas opções de Display para adicionar interface gráfica a placas Arduino. A maioria, porém, requer quantidade considerável de memória e tempo de processamento, e não são adequadas para placas Arduino com memória e poder de processamento limitados, como Arduino UNO ou Arduino Nano. Quando a memória é limitada e uma interface de usuário avançada é necessária, os Displays Nextion Seriais Programáveis Inteligentes são uma escolha popular. A Itead oferece um Editor Gráfico Nextion gratuito para projetar a interface do usuário do display.

O BME280 é um sensor combinado de Temperatura, Umidade e Pressão Barométrica muito preciso. Pode ser conectado via interface I2C ou SPI.

O Visuino tem suporte completo ao Display Nextion, e eu vinha planejando um tutorial para o suporte ao Nextion há um tempo. Também queria fazer um tutorial para o sensor BME280. Finalmente decidi combiná-los e fazer um único tutorial exibindo Temperatura, Umidade e Pressão Barométrica do BME280 nos 3 canais de um componente Scope (Forma de onda) no Display Nextion.

Passo 1: Componentes

• Uma placa Arduino compatível (uso Arduino Nano, pois tenho um, mas qualquer outra funcionará)
• Um Módulo Sensor BME280
• Um Display Inteligente Serial Nextion (usei NX4024K032_11 mas qualquer outro também deve funcionar)
• 4 jumpers fêmea-fêmea
• Para programar o display, você também precisará de um Módulo Conversor USB-TTL Serial 5V

Passo 2: Conectar o Display Nextion ao Módulo de Comunicação Serial USB

Para programar o Display Nextion com o Editor Nextion, você precisa conectá-lo com um Conversor USB-TTL Serial ao seu computador:

• Conecte o Conector de Fios Nextion ao Display
• Se seu Módulo USB-Serial for configurável, certifique-se de que está configurado para fornecer energia 5V
• Conecte o Fio Terra (Preto) do Display Nextion ao pino Terra do Conversor
• Conecte o Fio Alimentação +5V (Vermelho) do Display Nextion ao pino VCC/+5V do Conversor
• Conecte o Fio RX (Amarelo) do Display Nextion ao pino TX do Conversor
• Conecte o Fio TX (Azul) do Display Nextion ao pino RX do Conversor
• Conecte o Módulo Conversor USB-TTL Serial ao computador com cabo USB

Passo 3: Iniciar o Editor Nextion e selecionar tipo e orientação do display

Para programar o Display Nextion, você precisará Baixar e Instalar o Editor Nextion.

• Inicie o Editor Nextion
• No Menu selecione File > New
• Na caixa "Save As", digite nome do arquivo do projeto e selecione local para salvar
• Clique no botão "Save"
• Na caixa "Settings", selecione o Tipo de display (no meu caso NX4024K032_11)
• Clique na aba "DISPLAY" à esquerda para mostrar configurações do display
• Selecione orientação Horizontal para o display
• Clique no botão "OK" para fechar a caixa

Passo 4: No Editor Nextion: Adicionar e configurar componente Waveform (Scope)

Precisamos adicionar um componente Scope e configurá-lo para ter 3 canais para Temperatura, Pressão e Umidade:

• Na "Toolbox" à esquerda, clique no componente "Waveform" para adicioná-lo à área de design
• Redimensione o componente para preencher o display
• Na "Attribute" toolbox, defina o valor do atributo "ch" para "3"
• Na "Attribute" toolbox, defina o valor do atributo "dir" para "right to left"

Passo 5: No Editor Nextion: Carregar o projeto no Display Nextion

• Clique no botão "Upload"
• Na caixa "Upload to Nextion Device", clique no botão "Go" para iniciar o upload
• Quando o upload terminar, clique no botão "Exit" para fechar a caixa

Passo 6: Iniciar Visuino e selecionar tipo de placa Arduino

Como o Arduino Nano tem apenas uma porta Serial, e ela é necessária para programar o Arduino, você precisará programar o Arduino Nano antes de conectar o Display Nextion.

Para começar a programar o Arduino, você precisará ter o Arduino IDE instalado: https://www.arduino.cc/ .

Esteja ciente de que existem bugs críticos no Arduino IDE 1.6.6. Certifique-se de instalar 1.6.7 ou superior, caso contrário este tutorial não funcionará!

O Visuino: https://www.visuino.com também precisa ser instalado.

• Inicie o Visuino
• Clique no botão "Tools" no componente Arduino no Visuino
• Quando a caixa aparecer, selecione Arduino Nano

Passo 7: No Visuino: Adicionar componente Nextion Display e elemento Scope

Para controlar o Display Nextion, precisamos adicionar componente Nextion Display no Visuino, e então adicionar a ele elemento para controlar o Scope:

• Digite "next" na caixa Filter da Component Toolbox, selecione componente "Nextion Display" e solte na área de design
• Clique no botão "Tools" do componente DisplayNextion1
• No editor "Elements", selecione elemento "Scope(Wave)" e clique no botão "+" à esquerda para adicionar elemento Scope

Passo 8: No Visuino: Adicionar 3 canais ao elemento Scope e conectar Display Nextion

Em seguida, precisamos adicionar canais ao Scope.

• No Object Inspector, clique no botão "..." ao lado do valor da sub-propriedade "Channels" do elemento Scope1
• No editor Channels, selecione elemento "Channel" à direita e clique 3 vezes no botão "+" à esquerda para adicionar 3 canais
• Feche as caixas "Channels" e "Elements"
• Conecte o pino de saída "Out" do componente DisplayNextion1 ao pino de entrada "In" do canal "Serial[ 0 ]" do componente Arduino

Passo 9: No Visuino: Adicionar e configurar 3 componentes Map Range

Os canais Scope do Display Nextion são projetados para exibir valores entre 0.0 e 1.0. Para exibir Temperatura, Umidade e Pressão, precisamos converter os valores para o range 0.0 a 1.0. Podemos usar componentes Map Range para isso:

• Digite "map" na caixa Filter da Component Toolbox, selecione componente "Map Range" e solte 3 deles na área de design
• Selecione componente MapRange1 (para Pressão)
• No Object Inspector, expanda propriedade "Input Range"
• Defina "Max" para "101000" e "Min" para "99000" (ajuste conforme pressão atmosférica local)
• Selecione componente MapRange2 (para Temperatura)
• Defina "Max" para "100" e "Min" para "-20"
• Selecione componente MapRange3 (para Umidade)
• Defina "Max" para "100" e "Min" para "0"

Passo 10: No Visuino: Conectar componentes Map Range aos canais do Display Nextion

• Conecte saída "Out" do MapRange1 à entrada "In" de Elements.Scope1.Channels.Channel1 do DisplayNextion1
• Conecte saída "Out" do MapRange2 à entrada "In" de Elements.Scope1.Channels.Channel2 do DisplayNextion1
• Conecte saída "Out" do MapRange3 à entrada "In" de Elements.Scope1.Channels.Channel3 do DisplayNextion1

Passo 11: No Visuino: Adicionar e conectar componente BME280

Precisamos adicionar componente para ler dados do Módulo BME280:

• Digite "280" na caixa Filter da Component Toolbox, selecione "Pressure Temperature Humidity BME280 I2C" e solte na área de design
• Meu Módulo BME280 tem endereço I2C 118 (0x76). Se o seu tiver endereço diferente, defina valor da propriedade "Address"
• Conecte saída "Pressure(Pa)" do PressureTemperatureHumidity1 à entrada "In" do MapRange1
• Conecte saída "Temperature" do PressureTemperatureHumidity1 à entrada "In" do MapRange2
• Conecte saída "Humidity(%)" do PressureTemperatureHumidity1 à entrada "In" do MapRange3
• Conecte saída "Out" do PressureTemperatureHumidity1 à entrada "In" do canal I2C do componente Arduino

Passo 12: No Visuino: Adicionar, configurar e conectar componente Clock Generator

Podemos usar o projeto como está, porém ele atualizará o Scope muito rápido o tempo todo. É melhor se o Scope for atualizado, por exemplo, 10 vezes por segundo. Para isso, adicionaremos um componente clock para clock a leitura do sensor e atualização do Scope.

• Digite "clock" na caixa Filter da Component Toolbox, selecione "Clock Generator" e solte na área de design
• No Object Inspector, defina valor da propriedade "Frequency" do ClockGenerator1 para "10"
• Conecte saída "Out" do ClockGenerator1 ao pino de entrada "Clock" do PressureTemperatureHumidity1

Passo 13: Gerar, compilar e fazer upload do código Arduino

• No Visuino, pressione F9 ou clique no botão mostrado para gerar o código Arduino e abrir o Arduino IDE
• No Arduino IDE, clique no botão Upload para compilar e fazer upload

Passo 14: Conectar sensor BME280 ao Arduino

• Conecte VCC 3V3 (Vermelho), Terra (Preto), SDA (Verde) e SCL (Amarelo) ao Módulo BME280
• Conecte a outra extremidade do fio Terra (Preto) ao pino GND do Arduino Nano
• Conecte a outra extremidade do fio VCC 3V3 (Vermelho) ao pino 3V3 do Arduino Nano
• Conecte a outra extremidade do fio SDA (Verde) ao pino SDA/Analog 4 do Arduino Nano
• Conecte a outra extremidade do fio SCL (Amarelo) ao pino SCL/Analog 5 do Arduino Nano

Passo 15: Conectar Display Nextion ao Arduino

• Desconecte os fios do Display Nextion do Módulo Conversor USB-TTL Serial
• Conecte o Fio Terra (Preto) do Display Nextion ao pino GND do Arduino Nano
• Conecte o Fio TX (Azul) do Display Nextion ao pino RX (D0) do Arduino Nano
• Conecte o Fio RX (Amarelo) do Display Nextion ao pino TX (D1) do Arduino Nano
• Conecte o Fio Alimentação +5V (Vermelho) do Display Nextion ao pino 5V do Arduino Nano

Passo 16: E pronto...

Parabéns! Você completou o projeto.

A imagem mostra o projeto conectado e ligado. Como você pode ver, o Scope no Display Nextion plotará a Pressão, a Temperatura e a Umidade do Módulo BME280.

O diagrama completo do Visuino está disponível no projeto anexado (arquivo FJE6Y04IWE4O3H6.zip), que também inclui o projeto do Editor Nextion.