ESP8266 - Botão - Pressão Longa e Pressão Curta

Este tutorial ensina você a usar o ESP8266 para detectar a pressão longa e a pressão curta do botão. Em detalhes, vamos ver os seguintes exemplos:

Na seção final, exploramos como implementar o debounce em aplicações práticas. Para saber mais sobre por que o debounce é necessário para botões, consulte este artigo. Sem debounce, pode ocorrer a detecção incorreta do pressionamento de um botão.

Sobre o Botão

Se você não está familiarizado com botões (pinagem, operação, programação etc.), os tutoriais a seguir podem ajudar você a aprender:

Diagrama de Ligação

Diagrama de ligação do botão com ESP8266 NodeMCU

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.

Neste tutorial, vamos usar o resistor de pull-up interno. Isso significa que o botão fica em estado HIGH quando não está pressionado e em estado LOW quando está pressionado.

Como Detectar a Pressão Curta

Calculamos o intervalo de tempo entre os eventos de pressionado e solto. Se essa duração for menor que um tempo predeterminado, detectamos um evento de pressão curta.

Determine a duração máxima de uma pressão curta.

const int SHORT_PRESS_TIME = 500; // 500 milliseconds
  • Determine quando o botão foi pressionado e registre o momento do pressionamento.
if(prev_button_state == HIGH && button_state == LOW) time_pressed = millis();
  • Detecte quando o botão é solto e registre o momento em que ele foi solto.
if(prev_button_state == LOW && button_state == HIGH) time_released = millis();
  • Force
  • Determine o tempo de duração e a intensidade da pressão aplicada.
long press_duration = time_released - time_pressed;
  • Compare a duração do pressionamento com o tempo predeterminado para uma pressão curta.
  • Identifique se é uma pressão curta com base na comparação.
if( press_duration < SHORT_PRESS_TIME ) Serial.println("A short press is detected");

Código ESP8266 para detectar a pressão curta

/* * 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-long-press-short-press */ #define BUTTON_PIN D7 // The ESP8266 pin connected to button #define SHORT_PRESS_TIME 500 // 500 milliseconds int prev_button_state = LOW; // The previous state from the input pin int button_state; // The current reading from the input pin unsigned long time_pressed = 0; unsigned long time_released = 0; void setup() { Serial.begin(9600); pinMode(BUTTON_PIN, INPUT_PULLUP); } void loop() { // read the state of the switch/button: button_state = digitalRead(BUTTON_PIN); if (prev_button_state == HIGH && button_state == LOW) // button is pressed time_pressed = millis(); else if (prev_button_state == LOW && button_state == HIGH) { // button is released time_released = millis(); long press_duration = time_released - time_pressed; if ( press_duration < SHORT_PRESS_TIME ) Serial.println("A short press is detected"); } // save the the last state prev_button_state = button_state; }

Passos Rápidos

Para começar com o ESP8266 na Arduino IDE, siga estes passos:

  • Veja o tutorial como configurar o ambiente para ESP8266 na Arduino IDE se esta for a sua primeira vez usando o ESP8266.
  • Ligue os componentes como 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 (ex.: NodeMCU 1.0 (ESP-12E Module)), e a respectiva porta COM.
  • Faça o upload do código para o ESP8266 usando a Arduino IDE.
  • Pressione o botão por pouco tempo várias vezes.
  • Confira a saída no Serial Monitor.
∞
Newbiely | Arduino IDE 2.3.8
──
☐
✕
File
Edit
Sketch
Tools
Help
Nodemcu 1.0 (ESP-12E Module)
Newbiely.ino
···
8 Serial.println("Hello World!");
Output
Serial Monitor
Message (Enter to send message to 'Nodemcu 1.0 (ESP-12E Module)' on 'COM15')
New Line
9600 baud
A short press is detected
Ln 11, Col 1
Nodemcu 1.0 (ESP-12E Module) on COM15
2

※ Nota:

O Serial Monitor pode mostrar várias detecções de pressão curta para um único pressionamento. Esse é o comportamento esperado do botão e é chamado de “fenômeno de chattering”. Vamos resolver esse problema na última parte deste tutorial.

Como Detectar a Pressão Longa

Há dois cenários em que a pressão longa pode ser detectada:

  • Quando o botão é solto, o evento de pressão longa será identificado
  • Enquanto o botão está sendo pressionado, o evento de pressão longa será reconhecido, mesmo antes de ele ser solto.
  1. No primeiro caso, calculamos o intervalo de tempo entre os eventos de pressionado e solto. 2. Se a duração for maior que o tempo predeterminado, o evento de pressão longa é identificado.

No segundo caso de uso, assim que o botão é pressionado, o tempo de pressionamento é medido continuamente e o evento de pressão longa é verificado até o botão ser solto. Enquanto o botão está sendo mantido pressionado, se a duração for maior que um tempo predeterminado, o evento de pressão longa é detectado.

Código ESP8266 para detectar a pressão longa ao soltar

/* * 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-long-press-short-press */ #define BUTTON_PIN D7 // The ESP8266 pin connected to button #define LONG_PRESS_TIME 1000 // 1000 milliseconds int prev_button_state = LOW; // The previous state from the input pin int button_state; // The current reading from the input pin unsigned long time_pressed = 0; unsigned long time_released = 0; void setup() { Serial.begin(9600); pinMode(BUTTON_PIN, INPUT_PULLUP); } void loop() { // read the state of the switch/button: button_state = digitalRead(BUTTON_PIN); if(prev_button_state == HIGH && button_state == LOW) // button is pressed time_pressed = millis(); else if(prev_button_state == LOW && button_state == HIGH) { // button is released time_released = millis(); long press_duration = time_released - time_pressed; if( press_duration > LONG_PRESS_TIME ) Serial.println("A long press is detected"); } // save the the last state prev_button_state = button_state; }

Passos Rápidos

Para começar com o ESP8266 na Arduino IDE, siga estes passos:

  • Veja o tutorial como configurar o ambiente para ESP8266 na Arduino IDE se esta for a sua primeira vez usando o ESP8266.
  • Ligue os componentes como 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 (ex.: NodeMCU 1.0 (ESP-12E Module)), e a respectiva porta COM.
  • Faça o upload do código para o ESP8266 usando a Arduino IDE.
  • Espere um segundo e depois pressione e solte o botão.
  • Confira o resultado no Serial Monitor.
∞
Newbiely | Arduino IDE 2.3.8
──
☐
✕
File
Edit
Sketch
Tools
Help
Nodemcu 1.0 (ESP-12E Module)
Newbiely.ino
···
8 Serial.println("Hello World!");
Output
Serial Monitor
Message (Enter to send message to 'Nodemcu 1.0 (ESP-12E Module)' on 'COM15')
New Line
9600 baud
A long press is detected
Ln 11, Col 1
Nodemcu 1.0 (ESP-12E Module) on COM15
2

O evento de pressão longa só é detectado quando o botão é solto.

Código ESP8266 para detectar a pressão longa durante o pressionamento

/* * 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-long-press-short-press */ #define BUTTON_PIN D7 // The ESP8266 pin connected to button #define LONG_PRESS_TIME 1000 // 1000 milliseconds int prev_button_state = LOW; // The previous state from the input pin int button_state; // The current reading from the input pin unsigned long time_pressed = 0; bool is_pressing = false; bool is_long_detected = false; void setup() { Serial.begin(9600); pinMode(BUTTON_PIN, INPUT_PULLUP); } void loop() { // read the state of the switch/button: button_state = digitalRead(BUTTON_PIN); if(prev_button_state == HIGH && button_state == LOW) { // button is pressed time_pressed = millis(); is_pressing = true; is_long_detected = false; } else if(prev_button_state == LOW && button_state == HIGH) { // button is released is_pressing = false; } if(is_pressing == true && is_long_detected == false) { long press_duration = millis() - time_pressed; if( press_duration > LONG_PRESS_TIME ) { Serial.println("A long press is detected"); is_long_detected = true; } } // save the the last state prev_button_state = button_state; }

Passos Rápidos

Para começar com o ESP8266 na Arduino IDE, siga estes passos:

  • Veja o tutorial como configurar o ambiente para ESP8266 na Arduino IDE se esta for a sua primeira vez usando o ESP8266.
  • Ligue os componentes como 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 (ex.: NodeMCU 1.0 (ESP-12E Module)), e a respectiva porta COM.
  • Faça o upload do código para o ESP8266 usando a Arduino IDE.
  • Espere alguns segundos e depois pressione e solte o botão.
  • Veja os resultados no Serial Monitor.
∞
Newbiely | Arduino IDE 2.3.8
──
☐
✕
File
Edit
Sketch
Tools
Help
Nodemcu 1.0 (ESP-12E Module)
Newbiely.ino
···
8 Serial.println("Hello World!");
Output
Serial Monitor
Message (Enter to send message to 'Nodemcu 1.0 (ESP-12E Module)' on 'COM15')
New Line
9600 baud
A long press is detected
Ln 11, Col 1
Nodemcu 1.0 (ESP-12E Module) on COM15
2

O evento de pressionar e manter o botão pressionado só será detectado enquanto o botão não tiver sido solto.

Como Detectar Tanto a Pressão Longa quanto a Pressão Curta

Pressão Curta e Pressão Longa após soltar

/* * 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-long-press-short-press */ #define BUTTON_PIN D7 // The ESP8266 pin connected to button #define SHORT_PRESS_TIME 1000 // 1000 milliseconds #define LONG_PRESS_TIME 1000 // 1000 milliseconds int prev_button_state = LOW; // The previous state from the input pin int button_state; // The current reading from the input pin unsigned long time_pressed = 0; unsigned long time_released = 0; void setup() { Serial.begin(9600); pinMode(BUTTON_PIN, INPUT_PULLUP); } void loop() { // read the state of the switch/button: button_state = digitalRead(BUTTON_PIN); if (prev_button_state == HIGH && button_state == LOW) // button is pressed time_pressed = millis(); else if (prev_button_state == LOW && button_state == HIGH) { // button is released time_released = millis(); long press_duration = time_released - time_pressed; if ( press_duration < SHORT_PRESS_TIME ) Serial.println("A short press is detected"); if ( press_duration > LONG_PRESS_TIME ) Serial.println("A long press is detected"); } // save the the last state prev_button_state = button_state; }

Passos Rápidos

Para começar com o ESP8266 na Arduino IDE, siga estes passos:

  • Veja o tutorial como configurar o ambiente para ESP8266 na Arduino IDE se esta for a sua primeira vez usando o ESP8266.
  • Ligue os componentes como 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 (ex.: NodeMCU 1.0 (ESP-12E Module)), e a respectiva porta COM.
  • Faça o upload do código para o ESP8266 usando a Arduino IDE.
  • Pressione o botão por um tempo longo e por um tempo curto.
  • Confira o resultado no Serial Monitor.

※ Nota:

O Serial Monitor pode mostrar várias detecções de pressão curta quando é feita uma pressão longa. Esse é o comportamento esperado do botão e é chamado de "fenômeno de chattering". O problema será resolvido na parte final deste tutorial.

Pressão Curta e Pressão Longa Durante o pressionamento

/* * 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-long-press-short-press */ #define BUTTON_PIN D7 // The ESP8266 pin connected to button #define SHORT_PRESS_TIME 1000 // 1000 milliseconds #define LONG_PRESS_TIME 1000 // 1000 milliseconds int prev_button_state = LOW; // The previous state from the input pin int button_state; // The current reading from the input pin unsigned long time_pressed = 0; unsigned long time_released = 0; bool is_pressing = false; bool is_long_detected = false; void setup() { Serial.begin(9600); pinMode(BUTTON_PIN, INPUT_PULLUP); } void loop() { // read the state of the switch/button: button_state = digitalRead(BUTTON_PIN); if (prev_button_state == HIGH && button_state == LOW) { // button is pressed time_pressed = millis(); is_pressing = true; is_long_detected = false; } else if (prev_button_state == LOW && button_state == HIGH) { // button is released is_pressing = false; time_released = millis(); long press_duration = time_released - time_pressed; if ( press_duration < SHORT_PRESS_TIME ) Serial.println("A short press is detected"); } if (is_pressing == true && is_long_detected == false) { long press_duration = millis() - time_pressed; if ( press_duration > LONG_PRESS_TIME ) { Serial.println("A long press is detected"); is_long_detected = true; } } // save the the last state prev_button_state = button_state; }

Passos Rápidos

Para começar com o ESP8266 na Arduino IDE, siga estes passos:

  • Veja o tutorial como configurar o ambiente para ESP8266 na Arduino IDE se esta for a sua primeira vez usando o ESP8266.
  • Ligue os componentes como 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 (ex.: NodeMCU 1.0 (ESP-12E Module)), e a respectiva porta COM.
  • Faça o upload do código para o seu ESP8266 usando a Arduino IDE.
  • Pressione o botão por um tempo curto e por um tempo longo.
  • Confira o resultado no Serial Monitor.

※ Nota:

O Serial Monitor pode mostrar várias detecções de pressão curta quando é feita uma pressão longa. Esse é o comportamento esperado do botão e é chamado de "fenômeno de chattering". Uma solução para esse problema será apresentada na seção final deste tutorial.

Pressão Longa e Pressão Curta com Debounce

É essencial implementar o debounce no botão em várias aplicações.

O debounce pode ser complicado, principalmente quando há vários botões envolvidos. Para facilitar para os iniciantes, criamos uma biblioteca chamada ezButton.

Vamos usar essa biblioteca nos códigos abaixo

Pressão Curta e Pressão Longa com debounce após soltar

/* * 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-long-press-short-press */ #include <ezButton.h> #define SHORT_PRESS_TIME 1000 // 1000 milliseconds #define LONG_PRESS_TIME 1000 // 1000 milliseconds ezButton button(D7); // create ezButton object for pin D7 unsigned long time_pressed = 0; unsigned long time_released = 0; void setup() { Serial.begin(9600); button.setDebounceTime(50); // set debounce time to 50 milliseconds } void loop() { button.loop(); // MUST call the loop() function first if (button.isPressed()) time_pressed = millis(); if (button.isReleased()) { time_released = millis(); long press_duration = time_released - time_pressed; if ( press_duration < SHORT_PRESS_TIME ) Serial.println("A short press is detected"); if ( press_duration > LONG_PRESS_TIME ) Serial.println("A long press is detected"); } }

Passos Rápidos

Para começar com o ESP8266 na Arduino IDE, siga estes passos:

  • Veja o tutorial como configurar o ambiente para ESP8266 na Arduino IDE se esta for a sua primeira vez usando o ESP8266.
  • Ligue os componentes como 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 (ex.: NodeMCU 1.0 (ESP-12E Module)), e a respectiva porta COM.
  • Para instalar a biblioteca ezButton, consulte Como Fazer.
  • Faça o upload do código para o ESP8266 usando a Arduino IDE.
  • Mantenha o botão pressionado por um período curto ou longo.
  • Confira o resultado no Serial Monitor.

Pressão Curta e Pressão Longa com debounce Durante o Pressionamento

/* * 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-long-press-short-press */ #include <ezButton.h> #define SHORT_PRESS_TIME 1000 // 1000 milliseconds #define LONG_PRESS_TIME 1000 // 1000 milliseconds ezButton button(D7); // create ezButton object for pin D7 unsigned long time_pressed = 0; unsigned long time_released = 0; bool is_pressing = false; bool is_long_detected = false; void setup() { Serial.begin(9600); button.setDebounceTime(50); // set debounce time to 50 milliseconds } void loop() { button.loop(); // MUST call the loop() function first if (button.isPressed()) { time_pressed = millis(); is_pressing = true; is_long_detected = false; } if (button.isReleased()) { is_pressing = false; time_released = millis(); long press_duration = time_released - time_pressed; if ( press_duration < SHORT_PRESS_TIME ) Serial.println("A short press is detected"); } if (is_pressing == true && is_long_detected == false) { long press_duration = millis() - time_pressed; if ( press_duration > LONG_PRESS_TIME ) { Serial.println("A long press is detected"); is_long_detected = true; } } }

Passos Rápidos

  • Ligue os componentes como 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 (ex.: NodeMCU 1.0 (ESP-12E Module)), e a respectiva porta COM.
  • Instale a biblioteca ezButton. Consulte Como Fazer para ver as instruções.
  • Use a Arduino IDE para fazer o upload do código para o ESP8266.
  • Mantenha o botão pressionado e depois solte.
  • Veja o Serial Monitor para observar o resultado.

Vídeo

Por que Precisamos de Pressão Longa e Pressão Curta

  • Para reduzir a quantidade de botões, um botão pode ser usado para várias finalidades. Por exemplo, uma pressão curta pode ser usada para alternar os modos de operação, e uma pressão longa pode ser usada para desligar o dispositivo.
  • As pressões longas são usadas para evitar pressionamentos acidentais. Por exemplo, alguns dispositivos usam um botão para restaurar as configurações de fábrica. Se ele for pressionado por acidente, isso pode ser perigoso. Para evitar isso, o dispositivo é projetado de modo que a restauração de fábrica só seja ativada quando o botão for pressionado por um tempo longo (ex.: por mais de 5 segundos).

※ NOSSAS MENSAGENS

  • Fique à vontade para compartilhar o link deste tutorial. Porém, por favor, não use nosso conteúdo em outros sites. Investimos muito esforço e tempo para criar este conteúdo, por favor respeite nosso trabalho!