Vamos falar hoje de um ESP32
muito especial, perfeito para a Internet das Coisas, que é o M5Stack. Este sujeito
tem o ESP32 dentro dele, somando-se ainda display, teclado, amplificador,
alto-falante, bateria... Então, é um dispositivo que pode fazer inúmeras
coisas. Eu mesmo, quando recebi esse hardware, peguei um software que eu já
tinha para o ESP32 e só portei para esse display utilizado neste projeto, que é
diferente, mas o código fonte que vamos usar é o mesmo que trabalhamos no vídeo
GRÁFICO DE TEMPERATURA E UMIDADE COM DISPLAY OLED.
Neste circuito de hoje, no
entanto, quero destacar que temos o M5Stack com ligações positivo e negativo, alimentando
ele mesmo um sensor DHT22, ambos conectados por um GPIO. Os dados são exibidos
em um gráfico.
Gostou do M5Stack? Quer comprar um?
Acesse: https://goo.gl/ruoYVj
Neste artigo, então, vamos fazer uma introdução ao M5Stack e discutir suas aplicações. Importante destacar que este dispositivo tem entrada para cartão micro SD, Speaker de 1W, Battery Socket, possui ainda botões de interação, conector para i2c, USB tipo C, IOs expostos, display de duas polegadas TFT, entre outros recursos, como exposto na imagem acima. Podemos dizer que é um dispositivo pronto para IOT, já com Bluetooth e WiFi do ESP32, incluindo ainda um imã para fixação em superfícies de metal.
M5Stack
Uma inovação do M5Stack é que,
se você tirar a parte traseira dele, você pode encaixar diferentes módulos com
as mais diversas funções, como, por exemplo, módulo GPS, GSM, LoRa, entre
outros, como você vê na imagem abaixo.
Trago abaixo mais exemplos de módulos, que vai desde RS485, DC Motor, Maker, Core, até controle de motor de passo.
Portanto, esta é uma maneira muito rápida de montar um protótipo. Antigamente, era preciso comprar diversos chips transistores e executar inúmeras montagens, o que demandava bastante tempo e investimento até chegar até a prototipagem de um produto. Foi, então, que surgiram o Arduino e o Raspberry, que são placas. Agora, enfim, temos o M5Stack, que é essa caixinha fechada pronta para uso, o que nos desobriga a ter que executar outros inúmeros passos.
Veja abaixo outros modelos do
M5Stack. Na imagem da esquerda temos um dispositivo com teclados alfanumérico,
numérico e de game, os quais o possibilitam trabalhar como uma espécie de
computador. Na direita da imagem temos um exemplo de software rodando, o qual
pode ser programado em MicroPython, Arduino, ESP-IDF, NodeJS, além do Basic.
M5Stack - Possíveis Aplicações
Entre os exemplos de
aplicações do M5Stack, temos o osciloscópio, como você vê na imagem abaixo, à
esquerda. No lado direito temos uma espécie de calculadora/tabela de ferramenta
de corte.
E que tal um velocímetro para
bicicleta?
Pode ser também uma furadeira
remota, ou seja, impressa em 3D e monitorada à distância por um controle.
Tudo isso mostra que a eletrônica de controle está muito mais acessível e barata nos dias de hoje, assim como mais fácil tem se tornado a programação destes circuitos.
M5Stack - Pinos
Temos na imagem abaixo a parte
traseira do M5Stack, que mostra que a alimentação é de 5 volts. A imagem ainda
revela que temos tudo que existe no ESP32 com a conectividade.
Biblioteca DHT
Utilize a lib SimpleDHT, a
mesma que usei no vídeo GRÁFICO DE TEMPERATURA E UMIDADE COM DISPLAY OLED.
Arduino IDE Library Manage
Já no “Menu: Sketch -> Incluir Biblioteca
-> Gerenciar Bibliotecas”, vamos instalar as duas bibliotecas expostas
na imagem abaixo. Lembrando que antes de tudo isso, você precisa instalar o
core Arduino do ESP32. Veja como neste vídeo: ESP32: COMO INSTALAR NA IDE DO ARDUINO.
Código fonte
O código fonte, como
mencionado, é o mesmo que utilizei no vídeo GRÁFICO DE TEMPERATURA E UMIDADE COM DISPLAY OLED. A única mudança que fiz para este projeto foi em relação ao
tamanho do display.
M5StackDHTGraph.ino
Vamos incluir as bibliotecas M5Stack.h
e SimpleDHT.h, definir cores que serão empregadas no display, bem como o pino de
dados do DHT. Vamos ainda construir um objeto para comunicação com o sensor,
definir a variável responsável pelas leituras e indicar o valor do eixo X.
//Libs do M5Stack e DHT #include <M5Stack.h> #include <SimpleDHT.h> // definição das cores que serão utilizadas #define BLACK 0x0000 #define RED 0xF800 #define CYAN 0x07FF #define YELLOW 0xFFE0 #define WHITE 0xFFFF #define DHTPIN 5 //pino de dados do DHT //construtor do objeto para comunicar com o sensor SimpleDHT22 dht; //variável responsavel por contar o número de leituras realizadas e indicador do valor no eixo X int leituraAtual = 1;
Seguimos para definições do
posicionamento dos eixos X e Y, da coordenada de exibição dos dados de
temperatura e umidade, bem como das variáveis que armazenarão os valores lidos.
Ainda apontamos a variável para impressão do gráfico no display.
//definições do posicionamento dos eixos X e Y #define POS_X_GRAFICO 30 #define POS_Y_GRAFICO 3 #define ALTURA_GRAFICO 180 #define COMPRIMENTO_GRAFICO 270 //definição da coordenada onde escreveremos os dados de temperatura e umidade #define POS_X_DADOS 30 #define POS_Y_DADOS 200 //variáveis que armazenarão os valores lidos da umidade e temperatura int umidade = 0; int temperatura = 0; //variável que armazenará o valor da coordenada Y para desenharmos uma linha de exemplo //que varia os valores de 1 em 1 int linhaExemplo = 20; int fator = 1; //indicará se somaremos ou subtrairemos uma unidade na variável linhaExemplo
M5StackDHTGraph.ino – setup
No Setup, inicializamos o
M5Stack. Definimos comandos para desenho do gráfico, configuramos a fonte, bem
como cores de texto, e posicionamos o cursor para escrita.
void setup(void) { Serial.begin(115200); //Inicializa o M5Stack M5.begin(); //pinta a tela toda de preto M5.Lcd.fillScreen(BLACK); //os comandos a seguir irão desenhar as linhas dos eixos cartesianos na cor branca //drawFastVLine(x,y,width,color) --> linha vertical M5.Lcd.drawFastVLine(POS_X_GRAFICO,POS_Y_GRAFICO, ALTURA_GRAFICO,WHITE); //eixo Y //drawFastHLine(x,y,width,color) --> linha horizontal M5.Lcd.drawFastHLine(POS_X_GRAFICO,ALTURA_GRAFICO+1,COMPRIMENTO_GRAFICO,WHITE); //eixo X //configura o tamnaho do texto que escreveremos em tela M5.Lcd.setTextSize(3); //configura a cor branca para o texto M5.Lcd.setTextColor(WHITE); //posiciona o cursor para escrita M5.Lcd.setCursor(POS_X_DADOS, POS_Y_DADOS); M5.Lcd.print("T: "); //indicando a temperatura M5.Lcd.setCursor(POS_X_DADOS+105, POS_Y_DADOS); M5.Lcd.print(" U: "); //indicando a umidade }
M5StackDHTGraph.ino - loop 1/3
Na primeira parte do Loop,
realizamos a leitura da temperatura e umidade, mapeamos o valor das variáveis
para colocar no gráfico e desenhamos na tela o ponto referente a estes valores
lidos do sensor.
void loop() { //Fazemos a leitura da temperatura e umiade float temp, umid; int status = dht.read2(DHTPIN, &temp, &umid, NULL); if (status == SimpleDHTErrSuccess) { temperatura = temp; umidade = umid; } //mapeando o valor das variáveis para colocar no gráfico //necessário pois o display tem 240px de altura e separamos apenas 180 para o gráfico //umidade pode ser lida de 0-100 int temperaturaMapeada = map(temperatura,0,100,0,ALTURA_GRAFICO); int umidadeMapeada = map(umidade,0,100,0,ALTURA_GRAFICO); //desenha na tela o ponto referente aos valores lidos do sensor M5.Lcd.drawPixel(POS_X_GRAFICO+leituraAtual, ALTURA_GRAFICO-temperaturaMapeada, RED); M5.Lcd.drawPixel(POS_X_GRAFICO+leituraAtual, ALTURA_GRAFICO-umidadeMapeada, CYAN); //desenha na tela o ponto referente a nossa linha de exemplo que fica variando M5.Lcd.drawPixel(POS_X_GRAFICO+leituraAtual, ALTURA_GRAFICO-linhaExemplo, YELLOW);
M5StackDHTGraph.ino - loop 2/3
Nesta etapa e na seguinte, definimos
possibilidades de impressão do gráfico no display.
//aqui controlamos nossa linha de exemplo, quando chega no valor máximo decrementamos o valor //até um valor mínimo determinado (no nosso caso 10), e a partir daí, incrementa novamente if(linhaExemplo == 50) fator = -1; else if(linhaExemplo == 10) fator = 1; //soma o valor de linhaExemplo linhaExemplo += fator; //incrementa o contador de leituras realizadas leituraAtual++; //se a leitura chegar em 270 (número máximo do eixo X) então limparemos a área do gráfico para voltarmos a desenhar. if(leituraAtual == 270) { //limpa a área toda do gráfico M5.Lcd.fillRect(POS_X_GRAFICO+1, POS_Y_GRAFICO-1, COMPRIMENTO_GRAFICO, ALTURA_GRAFICO-1, BLACK); leituraAtual = 1; //volta o contador de leitura para 1 (nova coordenada X) } //limpa a área onde colocamos o valor da temperatura e da umidade M5.Lcd.fillRect(POS_X_DADOS+50, POS_Y_DADOS, 60, 30, BLACK); M5.Lcd.fillRect(POS_X_DADOS+165, POS_Y_DADOS, 90, 30, BLACK);
M5StackDHTGraph.ino - loop 3/3
//reposiciona o cursor para escrever a temperatura M5.Lcd.setCursor(POS_X_DADOS+50, POS_Y_DADOS); M5.Lcd.setTextColor(RED); M5.Lcd.print(temperatura); M5.Lcd.print((char)247); //reposiciona o cursor para escrever a umidade M5.Lcd.setCursor(POS_X_DADOS+165, POS_Y_DADOS); M5.Lcd.setTextColor(CYAN); M5.Lcd.print(umidade); M5.Lcd.print("%"); delay(1000); }
Faça download dos arquivos:
6 Comentários
Nossa muito legal mesmo!
ResponderExcluirGostei do artigo. Tenho um que chegou a uns 10 dias.
ResponderExcluirGostaria de um tutorial que mostrasse o sensor de 9dof dele em um espaço 3d.
e também alguma maneira de instalar o Circuit Python nele.
Olá, achei muito interessante esse carinha...
ResponderExcluirCom ele vc conseguiria montar por exemplo um marcador de horário?
Explico melhor, poderia mandar um pulso para cada hora fechada, 1h-1pulso, 2h-2pulso, 3h-3pulso etc...
Fernando,muito bom, excelente divulgação.
ResponderExcluirBom dia! Dá para programar utilizando a linguagem LUA ?
ResponderExcluirOlá,
ResponderExcluirEstou com uma dúvida. No AliExpress vende um kit com 8 sensores já prontos para usar no m5stack (https://www.aliexpress.com/item/33001053329.html). Porém eu não entendi ainda se estes sensores podem ser usados simultâneamente ou se é 1 sensor para 1 m5stack. A segunda dúvida são esses módulos encaixáveis no m5stack, eu posso usar vários ou apenas 1 (https://www.aliexpress.com/item/33047139454.html)?