ESP32 - Botón - Pulsación larga / Pulsación corta
Este tutorial explica cómo usar el ESP32 para detectar la pulsación larga y la pulsación corta. En detalle, aprenderemos:
- Cómo detectar la pulsación corta en el botón
- Cómo detectar la pulsación larga en el botón
- Cómo detectar tanto la pulsación larga como la pulsación corta
Hardware Requerido
Or you can buy the following kits:
| 1 | × | DIYables ESP32 Starter Kit (ESP32 included) | |
| 1 | × | DIYables Sensor Kit (30 sensors/displays) | |
| 1 | × | DIYables Sensor Kit (18 sensors/displays) |
Divulgación: Algunos de los enlaces proporcionados en esta sección son enlaces de afiliado de Amazon. Podemos recibir una comisión por las compras realizadas a través de estos enlaces sin costo adicional para usted. Apreciamos su apoyo.
Acerca del botón
Tenemos tutoriales específicos sobre el botón. Cada tutorial contiene información detallada e instrucciones paso a paso sobre el pinout de hardware, el principio de funcionamiento, la conexión de cableado al ESP32 y el código para ESP32... Obtenga más información sobre ellos en los siguientes enlaces:
Diagrama de Cableado
- Esquema de cableado entre el ESP32 y el botón montado en el PCB
This image is created using Fritzing. Click to enlarge image
Si no sabe c\u00f3mo alimentar ESP32 y otros componentes, encuentre instrucciones en el siguiente tutorial: C\u00f3mo alimentar ESP32.
- Diagrama de cableado entre ESP32 y botón de montaje en panel
This image is created using Fritzing. Click to enlarge image
Este tutorial utilizará la resistencia pull-up interna. El estado del botón es ALTO cuando está en reposo y BAJO cuando se pulsa.
Cómo detectar una pulsación corta
- Medir el tiempo entre los eventos de pulsación y liberación.
- Si la duración es menor que un tiempo predefinido, se detecta el evento de pulsación corta.
Veamos paso a paso:
- Define cuánto dura la pulsación corta máxima
#define SHORT_PRESS_TIME 500 // 500 milliseconds
- Detectar cuando se presiona el botón y guardar la hora de la pulsación
if(lastState == HIGH && currentState == LOW)
pressedTime = millis();
- Detectar cuándo se suelta el botón y guardar el tiempo de liberación
if(lastState == LOW && currentState == HIGH)
releasedTime = millis();
- Calcular la duración de la pulsación y
long pressDuration = releasedTime - pressedTime;
- Determina la pulsación corta comparando la duración de la pulsación con el tiempo de pulsación corto definido.
if( pressDuration < SHORT_PRESS_TIME )
Serial.println("A short press is detected");
Código ESP32 para detectar la pulsación corta
/*
* Este código de ESP32 fue desarrollado por es.newbiely.com
* Este código de ESP32 se proporciona al público sin ninguna restricción.
* Para tutoriales completos y diagramas de cableado, visite:
* https://es.newbiely.com/tutorials/esp32/esp32-button-long-press-short-press
*/
#define BUTTON_PIN 21 // GPIO21 pin connected to button
#define SHORT_PRESS_TIME 500 // 500 milliseconds
// Variables will change:
int lastState = LOW; // the previous state from the input pin
int currentState; // the current reading from the input pin
unsigned long pressedTime = 0;
unsigned long releasedTime = 0;
void setup() {
Serial.begin(9600);
pinMode(BUTTON_PIN, INPUT_PULLUP);
}
void loop() {
// read the state of the switch/button:
currentState = digitalRead(BUTTON_PIN);
if (lastState == HIGH && currentState == LOW) // button is pressed
pressedTime = millis();
else if (lastState == LOW && currentState == HIGH) { // button is released
releasedTime = millis();
long pressDuration = releasedTime - pressedTime;
if ( pressDuration < SHORT_PRESS_TIME )
Serial.println("A short press is detected");
}
// save the the last state
lastState = currentState;
}
Pasos R\u00e1pidos
- Si es la primera vez que usas ESP32, consulta cómo configurar el entorno para ESP32 en Arduino IDE.
- Carga el código anterior al ESP32 mediante Arduino IDE
- Presiona el botón varias veces de forma breve.
- Mira el resultado en el Monitor Serial. Se ve como lo siguiente:
COM6
A short press is detected
Autoscroll
Clear output
9600 baud
Newline
※ Nota:
El Monitor Serial puede imprimir varias pulsaciones cortas para una sola pulsación. Este es un comportamiento normal del botón. Este comportamiento se llama el “fenómeno de rebote”. Más adelante en este tutorial aprenderemos cómo eliminar este problema.
Cómo detectar una pulsación prolongada
Hay dos casos de uso para detectar la pulsación prolongada.
- El evento de pulsación larga se detecta justo después de que se suelte el botón.
- El evento de pulsación larga se detecta mientras se mantiene pulsado el botón.
En el primer caso:
- Mide la duración entre el evento presionado y el evento liberado.
- Si la duración es mayor que un tiempo predefinido, se detecta el evento de pulsación larga.
En el segundo caso: durante el tiempo en que se mantiene pulsado el botón, realice a continuación el proceso siguiente repetidamente.
- Mide el tiempo de pulsación.
- Si la duración es mayor que el tiempo predefinido, se detecta el evento de pulsación larga.
- De lo contrario, repite el proceso hasta que se suelte el botón.
Código ESP32 para detectar pulsación larga al soltar
/*
* Este código de ESP32 fue desarrollado por es.newbiely.com
* Este código de ESP32 se proporciona al público sin ninguna restricción.
* Para tutoriales completos y diagramas de cableado, visite:
* https://es.newbiely.com/tutorials/esp32/esp32-button-long-press-short-press
*/
#define BUTTON_PIN 21 // GPIO21 pin connected to button
#define LONG_PRESS_TIME 1000 // 1000 milliseconds
// Variables will change:
int lastState = LOW; // the previous state from the input pin
int currentState; // the current reading from the input pin
unsigned long pressedTime = 0;
unsigned long releasedTime = 0;
void setup() {
Serial.begin(9600);
pinMode(BUTTON_PIN, INPUT_PULLUP);
}
void loop() {
// read the state of the switch/button:
currentState = digitalRead(BUTTON_PIN);
if(lastState == HIGH && currentState == LOW) // button is pressed
pressedTime = millis();
else if(lastState == LOW && currentState == HIGH) { // button is released
releasedTime = millis();
long pressDuration = releasedTime - pressedTime;
if( pressDuration > LONG_PRESS_TIME )
Serial.println("A long press is detected");
}
// save the the last state
lastState = currentState;
}
Pasos R\u00e1pidos
- Si es la primera vez que usas ESP32, consulta cómo configurar el entorno para ESP32 en Arduino IDE.
- Carga el código anterior al ESP32 mediante Arduino IDE.
- Presiona y suelta el botón después de un segundo.
- Ve el resultado en el Monitor Serial. Se muestra a continuación:
COM6
A long press is detected
Autoscroll
Clear output
9600 baud
Newline
Código ESP32 para detectar pulsación prolongada
/*
* Este código de ESP32 fue desarrollado por es.newbiely.com
* Este código de ESP32 se proporciona al público sin ninguna restricción.
* Para tutoriales completos y diagramas de cableado, visite:
* https://es.newbiely.com/tutorials/esp32/esp32-button-long-press-short-press
*/
#define BUTTON_PIN 21 // GPIO21 pin connected to button
#define LONG_PRESS_TIME 1000 // 1000 milliseconds
// Variables will change:
int lastState = LOW; // the previous state from the input pin
int currentState; // the current reading from the input pin
unsigned long pressedTime = 0;
bool isPressing = false;
bool isLongDetected = false;
void setup() {
Serial.begin(9600);
pinMode(BUTTON_PIN, INPUT_PULLUP);
}
void loop() {
// read the state of the switch/button:
currentState = digitalRead(BUTTON_PIN);
if(lastState == HIGH && currentState == LOW) { // button is pressed
pressedTime = millis();
isPressing = true;
isLongDetected = false;
} else if(lastState == LOW && currentState == HIGH) { // button is released
isPressing = false;
}
if(isPressing == true && isLongDetected == false) {
long pressDuration = millis() - pressedTime;
if( pressDuration > LONG_PRESS_TIME ) {
Serial.println("A long press is detected");
isLongDetected = true;
}
}
// save the the last state
lastState = currentState;
}
Pasos R\u00e1pidos
- Si es la primera vez que usas ESP32, consulta cómo configurar el entorno para ESP32 en Arduino IDE.
- Sube el código anterior al ESP32 mediante Arduino IDE
- Presiona y suelta el botón después de varios segundos.
- Ve el resultado en Monitor Serial. Es lo siguiente:
COM6
A long press is detected
Autoscroll
Clear output
9600 baud
Newline
Cómo detectar tanto la pulsación larga como la pulsación corta
Pulsación corta y pulsación larga tras soltar
/*
* Este código de ESP32 fue desarrollado por es.newbiely.com
* Este código de ESP32 se proporciona al público sin ninguna restricción.
* Para tutoriales completos y diagramas de cableado, visite:
* https://es.newbiely.com/tutorials/esp32/esp32-button-long-press-short-press
*/
#define BUTTON_PIN 21 // GPIO21 pin connected to button
#define SHORT_PRESS_TIME 1000 // 1000 milliseconds
#define LONG_PRESS_TIME 1000 // 1000 milliseconds
// Variables will change:
int lastState = LOW; // the previous state from the input pin
int currentState; // the current reading from the input pin
unsigned long pressedTime = 0;
unsigned long releasedTime = 0;
void setup() {
Serial.begin(9600);
pinMode(BUTTON_PIN, INPUT_PULLUP);
}
void loop() {
// read the state of the switch/button:
currentState = digitalRead(BUTTON_PIN);
if (lastState == HIGH && currentState == LOW) // button is pressed
pressedTime = millis();
else if (lastState == LOW && currentState == HIGH) { // button is released
releasedTime = millis();
long pressDuration = releasedTime - pressedTime;
if ( pressDuration < SHORT_PRESS_TIME )
Serial.println("A short press is detected");
if ( pressDuration > LONG_PRESS_TIME )
Serial.println("A long press is detected");
}
// save the the last state
lastState = currentState;
}
Pasos R\u00e1pidos
- Si esta es la primera vez que usas ESP32, consulta cómo configurar el entorno para ESP32 en el IDE de Arduino.
- Carga el código anterior en el ESP32 mediante el IDE de Arduino.
- Realiza una pulsación larga y una pulsación corta del botón.
- Consulta el resultado en el Monitor serie. Se muestra a continuación:
※ Nota:
El Monitor Serial puede mostrar varias detecciones de pulsación corta al realizar una pulsación larga. Este es el comportamiento normal del botón. Este comportamiento se llama “fenómeno de rebote”. El problema se resolverá en la última parte de este tutorial.
Pulsación corta y pulsación larga durante la pulsación
/*
* Este código de ESP32 fue desarrollado por es.newbiely.com
* Este código de ESP32 se proporciona al público sin ninguna restricción.
* Para tutoriales completos y diagramas de cableado, visite:
* https://es.newbiely.com/tutorials/esp32/esp32-button-long-press-short-press
*/
#define BUTTON_PIN 21 // GPIO21 pin connected to button
#define SHORT_PRESS_TIME 1000 // 1000 milliseconds
#define LONG_PRESS_TIME 1000 // 1000 milliseconds
// Variables will change:
int lastState = LOW; // the previous state from the input pin
int currentState; // the current reading from the input pin
unsigned long pressedTime = 0;
unsigned long releasedTime = 0;
bool isPressing = false;
bool isLongDetected = false;
void setup() {
Serial.begin(9600);
pinMode(BUTTON_PIN, INPUT_PULLUP);
}
void loop() {
// read the state of the switch/button:
currentState = digitalRead(BUTTON_PIN);
if (lastState == HIGH && currentState == LOW) { // button is pressed
pressedTime = millis();
isPressing = true;
isLongDetected = false;
} else if (lastState == LOW && currentState == HIGH) { // button is released
isPressing = false;
releasedTime = millis();
long pressDuration = releasedTime - pressedTime;
if ( pressDuration < SHORT_PRESS_TIME )
Serial.println("A short press is detected");
}
if (isPressing == true && isLongDetected == false) {
long pressDuration = millis() - pressedTime;
if ( pressDuration > LONG_PRESS_TIME ) {
Serial.println("A long press is detected");
isLongDetected = true;
}
}
// save the the last state
lastState = currentState;
}
Pasos R\u00e1pidos
- Si es la primera vez que usas ESP32, consulta cómo configurar el entorno para ESP32 en Arduino IDE.
- Carga el código anterior en el ESP32 mediante el IDE de Arduino
- Realiza una pulsación larga y una pulsación corta del botón.
- Observa el resultado en el Monitor Serial. Se muestra a continuación:
Pulsación prolongada y pulsación corta con rebote
Es muy importante eliminar el rebote del botón en muchas aplicaciones.
El rebote de los contactos es un poco complicado, especialmente cuando se usan varios botones. Para hacerlo más sencillo para los principiantes, hemos creado una biblioteca, llamada ezButton.
Utilizaremos esta biblioteca en los códigos que se muestran a continuación.
Pulsación corta y pulsación larga con anti-rebote tras soltar
/*
* Este código de ESP32 fue desarrollado por es.newbiely.com
* Este código de ESP32 se proporciona al público sin ninguna restricción.
* Para tutoriales completos y diagramas de cableado, visite:
* https://es.newbiely.com/tutorials/esp32/esp32-button-long-press-short-press
*/
#include <ezButton.h>
#define SHORT_PRESS_TIME 1000 // 1000 milliseconds
#define LONG_PRESS_TIME 1000 // 1000 milliseconds
ezButton button(21); // create ezButton object that attach to pin GPIO21
unsigned long pressedTime = 0;
unsigned long releasedTime = 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())
pressedTime = millis();
if (button.isReleased()) {
releasedTime = millis();
long pressDuration = releasedTime - pressedTime;
if ( pressDuration < SHORT_PRESS_TIME )
Serial.println("A short press is detected");
if ( pressDuration > LONG_PRESS_TIME )
Serial.println("A long press is detected");
}
}
Pasos R\u00e1pidos
- Si es la primera vez que usas ESP32, consulta cómo configurar el entorno para ESP32 en Arduino IDE.
- Instala la biblioteca ezButton. Consulta Cómo hacerlo
- Sube el código anterior al ESP32 mediante el IDE de Arduino
- Pulsa el botón de forma larga y corta.
- Consulta el resultado en el Monitor Serial. Se ve como a continuación:
Pulsación corta y pulsación larga con antirrebote durante la pulsación
/*
* Este código de ESP32 fue desarrollado por es.newbiely.com
* Este código de ESP32 se proporciona al público sin ninguna restricción.
* Para tutoriales completos y diagramas de cableado, visite:
* https://es.newbiely.com/tutorials/esp32/esp32-button-long-press-short-press
*/
#include <ezButton.h>
#define SHORT_PRESS_TIME 1000 // 1000 milliseconds
#define LONG_PRESS_TIME 1000 // 1000 milliseconds
ezButton button(21); // create ezButton object that attach to pin GPIO21
unsigned long pressedTime = 0;
unsigned long releasedTime = 0;
bool isPressing = false;
bool isLongDetected = 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()) {
pressedTime = millis();
isPressing = true;
isLongDetected = false;
}
if (button.isReleased()) {
isPressing = false;
releasedTime = millis();
long pressDuration = releasedTime - pressedTime;
if ( pressDuration < SHORT_PRESS_TIME )
Serial.println("A short press is detected");
}
if (isPressing == true && isLongDetected == false) {
long pressDuration = millis() - pressedTime;
if ( pressDuration > LONG_PRESS_TIME ) {
Serial.println("A long press is detected");
isLongDetected = true;
}
}
}
Pasos R\u00e1pidos
- Si es la primera vez que usas ESP32, consulta cómo configurar el entorno para ESP32 en Arduino IDE.
- Instala la biblioteca ezButton. Consulta Cómo hacerlo
- Sube el código anterior al ESP32 mediante Arduino IDE
- Realiza una pulsación larga y una pulsación corta del botón.
- Consulta el resultado en el Monitor Serial. Se ve como se muestra a continuación:
Video Tutorial
Estamos considerando crear tutoriales en video. Si considera que los tutoriales en video son importantes, suscríbase a nuestro canal de YouTube para motivarnos a crear los videos.
Por qué son necesarias la pulsación larga y la pulsación corta
- Para reducir la cantidad de botones y pines de entrada digital.
- Un solo botón puede albergar dos o más funciones. Por ejemplo, una pulsación corta para encender la luz y una pulsación larga para encender el ventilador.
- Utilice la pulsación larga en lugar de la pulsación corta para evitar pulsaciones accidentales. Por ejemplo, algunos dispositivos utilizan el botón para el restablecimiento de fábrica. Si se pulsa el botón por accidente, es peligroso.