ESP8266 - Contador de Botão - OLED
Este tutorial ensina você a usar o ESP8266 e um botão para contar os pressionamentos e exibir o valor em um OLED. Em detalhes:
- O ESP8266 conta quantas vezes um botão é pressionado
- O ESP8266 exibe o número da contagem em um OLED.
- O ESP8266 alinha automaticamente o número da contagem ao centro do display OLED, na horizontal e na vertical.
Neste tutorial, vamos fazer o debounce de um botão sem usar a função delay(). Para mais informações sobre por que o debounce é necessário, veja Por que precisamos de debounce?
Você pode adaptar isto para funcionar com outros sensores no lugar do botão.
Hardware Necessário
Or you can buy the following kits:
| 1 | × | DIYables Sensor Kit (18 sensors/displays) |
Divulgação: Alguns dos links desta seção são links de afiliado da Amazon. Podemos receber uma comissão pelas compras feitas por meio desses links, sem custo adicional para você. Agradecemos o seu apoio.
Buy Note: If you want a bigger OLED display, use the 2.42 inch OLED Display 128x64 .
Sobre o OLED e o Botão
Se você não conhece o OLED e o botão (pinagem, funcionalidade, programação ...), os tutoriais a seguir podem ajudar:
Diagrama de Ligação
This image is created using Fritzing. Click to enlarge image
Para mais informações, veja Pinagem do ESP8266 e como alimentar o ESP8266 e outros componentes.
Código ESP8266 - exibindo a contagem do botão no OLED
/*
* Este código de ESP8266 NodeMCU foi desenvolvido por pt.newbiely.com
* Este código de ESP8266 NodeMCU é disponibilizado ao público sem nenhuma restrição.
* Para tutoriais completos e diagramas de ligação, visite:
* https://pt.newbiely.com/tutorials/esp8266/esp8266-button-count-oled
*/
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#include <ezButton.h>
#define OLED_WIDTH 128 // OLED display width, in pixels
#define OLED_HEIGHT 64 // OLED display height, in pixels
Adafruit_SSD1306 oled(OLED_WIDTH, OLED_HEIGHT, &Wire, -1); // create SSD1306 display object connected to I2C
ezButton button(7); // create ezButton object for pin 7;
unsigned long prev_count = 0;
void setup() {
Serial.begin(9600);
// initialize OLED display with address 0x3C for 128x64
if (!oled.begin(SSD1306_SWITCHCAPVCC, 0x3C)) {
Serial.println(F("SSD1306 allocation failed"));
while (true);
}
delay(2000); // wait for initializing
oled.clearDisplay(); // clear display
oled.setTextSize(2); // text size
oled.setTextColor(WHITE); // text color
oled.setCursor(0, 10); // position to display
button.setDebounceTime(50); // set debounce time to 50 milliseconds
button.setCountMode(COUNT_FALLING);
}
void loop() {
button.loop(); // MUST call the loop() function first
unsigned long count = button.getCount();
if (prev_count != count) {
Serial.println(count); // print count to Serial Monitor
oled.clearDisplay(); // clear display
oled.println(count); // display count
oled.display(); // show on OLED
prev_count != count;
}
}
Passos Rápidos
Para começar com o ESP8266 na Arduino IDE, siga estes passos:
- Veja o tutorial como configurar o ambiente para o ESP8266 na Arduino IDE se esta for a sua primeira vez usando o ESP8266.
- Ligue os componentes conforme mostrado no diagrama.
- Conecte a placa ESP8266 ao seu computador usando um cabo USB.
- Abra a Arduino IDE no seu computador.
- Escolha a placa ESP8266 correta, como (por exemplo, NodeMCU 1.0 (ESP-12E Module)), e a respectiva porta COM.
- Clique no ícone Libraries na barra à esquerda da Arduino IDE.
- Pesquise por “ezButton” e localize a biblioteca de botão fornecida pela ArduinoGetStarted.
- Pressione o botão Install para instalar a biblioteca ezButton.
- Pesquise por “SSD1306” e localize a biblioteca SSD1306 criada pela Adafruit.
- Clique no botão Install para adicionar a biblioteca.
- Você será solicitado a instalar dependências adicionais da biblioteca.
- Para instalar todas elas, clique no botão Install All.
- Copie o código e abra-o na Arduino IDE.
- Clique no botão Upload na Arduino IDE para compilar e carregar o código no ESP8266.
- Pressione o botão várias vezes.
- Confira o número da contagem mudando no OLED.
O código acima mostra o número de pressionamentos do botão no canto superior esquerdo. Vamos fazer uma alteração para centralizá-lo!
Código ESP8266 - Alinhamento Central Vertical e Horizontal no OLED
/*
* Este código de ESP8266 NodeMCU foi desenvolvido por pt.newbiely.com
* Este código de ESP8266 NodeMCU é disponibilizado ao público sem nenhuma restrição.
* Para tutoriais completos e diagramas de ligação, visite:
* https://pt.newbiely.com/tutorials/esp8266/esp8266-button-count-oled
*/
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#include <ezButton.h>
#define OLED_WIDTH 128 // OLED display width, in pixels
#define OLED_HEIGHT 64 // OLED display height, in pixels
Adafruit_SSD1306 oled(OLED_WIDTH, OLED_HEIGHT, &Wire, -1); // create SSD1306 display object connected to I2C
ezButton button(7); // create ezButton object for pin 7;
unsigned long prev_count = 0;
void setup() {
Serial.begin(9600);
// initialize OLED display with address 0x3C for 128x64
if (!oled.begin(SSD1306_SWITCHCAPVCC, 0x3C)) {
Serial.println(F("SSD1306 allocation failed"));
while (true);
}
delay(2000); // wait for initializing
oled.clearDisplay(); // clear display
oled.setTextSize(2); // text size
oled.setTextColor(WHITE); // text color
oled.setCursor(0, 10); // position to display
button.setDebounceTime(50); // set debounce time to 50 milliseconds
button.setCountMode(COUNT_FALLING);
}
void loop() {
button.loop(); // MUST call the loop() function first
unsigned long count = button.getCount();
if (prev_count != count) {
Serial.println(count); // print count to Serial Monitor
String text = String(count);
oled_display_center(text);
prev_count != count;
}
}
void oled_display_center(String text) {
int16_t x1;
int16_t y1;
uint16_t width;
uint16_t height;
oled.getTextBounds(text, 0, 0, &x1, &y1, &width, &height);
// center the display both horizontally and vertically
oled.clearDisplay(); // clear display
oled.setCursor((OLED_WIDTH - width) / 2, (OLED_HEIGHT - height) / 2);
oled.println(text); // text to display
oled.display();
}
※ Nota:
Este código centraliza o texto no display OLED, na horizontal e na vertical. Para mais informações, consulte Como centralizar vertical/horizontalmente no OLED.