ESP32 - Pantalla de 4 dígitos de 7 segmentos con 74HC595
Este tutorial le guía sobre cómo usar un ESP32 para controlar un módulo de 4 dígitos de 7 segmentos con el 74HC595. Cubre los siguientes temas:
- Conectando ESP32 al módulo de visualización de 7 segmentos de 4 dígitos 74HC595
- Programando el ESP32 para mostrar números enteros en el módulo
- Programando el ESP32 para mostrar números de punto flotante en el módulo
- Programando el ESP32 para mostrar números y caracteres en el módulo
Este tutorial utilizará un módulo de pantalla de 7 segmentos de 4 dígitos con 4 puntos, capaz de mostrar valores flotantes. Si necesita mostrar un separador de dos puntos, consulte el Módulo de pantalla de 7 segmentos TM1637 de 4 dígitos.
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 de la pantalla de 4 dígitos de 7 segmentos 74HC595
Un módulo ideal para mostrar la temperatura o cualquier valor de punto flotante es el display de 4 dígitos de 7 segmentos basado en el 74HC595. Este módulo normalmente incluye cuatro LEDs de 7 segmentos, cuatro LEDs en forma de punto y dos controladores 74HC595 para cada dígito.
Esquema de pines
El módulo de visualización de 7 segmentos de 4 dígitos 74HC595 incluye 5 pines:
- Pin SCLK: es un pin de entrada de reloj. Conéctalo a cualquier pin digital del ESP32.
- Pin RCLK: es un pin de entrada de reloj. Conéctalo a cualquier pin digital del ESP32.
- Pin DIO: es un pin de datos de entrada/salida. Conéctalo a cualquier pin digital del ESP32.
- Pin VCC: alimenta al módulo. Conéctalo a una fuente de alimentación de 3.3V a 5V.
- Pin GND: es un pin de tierra.
Diagrama de Cableado
La tabla a continuación muestra el cableado entre los pines del ESP32 y los pines de un display de 4 dígitos de 7 segmentos controlado por 74HC595.
| ESP32 | 74HC595 7-segment display |
|---|---|
| Vin | 5V |
| 27 | SCLK |
| 26 | RCLK |
| 25 | DIO |
Si estás usando pines diferentes, asegúrate de modificar los números de pines en el código en consecuencia.
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.
Instalación de la biblioteca
Para programar fácilmente la pantalla de 4 dígitos de 7 segmentos 74HC595, necesitamos instalar la biblioteca DIYables_4Digit7Segment_74HC595 de DIYables.io. Siga los siguientes pasos para instalar la biblioteca:
- Haz clic en el icono de Bibliotecas en la barra izquierda del IDE de Arduino.
- Busca “DIYables_4Digit7Segment_74HC595”, luego encuentra la biblioteca DIYables_4Digit7Segment_74HC595 de DIYables.io.
- Haz clic en el botón Instalar.
También puedes ver esta librería en GitHub
Cómo programar para el 74HC595 con un display de 7 segmentos de 4 dígitos usando ESP32
- Incluir la biblioteca
#include <DIYables_4Digit7Segment_74HC595.h>
- Define los pines del ESP32 que se conectan al SCLK, RCLK y DIO del módulo de visualización. Por ejemplo, los pines D7, D6 y D5
#define SCLK 27 // The ESP32 pin GPIO27 connected to SCLK
#define RCLK 26 // The ESP32 pin GPIO26 connected to RCLK
#define DIO 25 // The ESP32 pin GPIO25 connected to DIO
- Crear un objeto de visualización del tipo DIYables_4Digit7Segment_74HC595
DIYables_4Digit7Segment_74HC595 display = DIYables_4Digit7Segment_74HC595(CLK, DIO);
- Entonces puedes mostrar los números enteros con la opción de rellenar con ceros a la izquierda, admitiendo el número negativo:
display.printInt(-13, false); // you can display a value from -999 to 9999
- Puedes mostrar números de punto flotante con la cantidad de decimales, opciones de relleno con ceros, soportando el número negativo:
display.printFloat(-9.2, 1, false);
- También puedes mostrar el número, el punto decimal y el carácter dígito por dígito utilizando funciones de bajo nivel:
// display 9.3°C
display.clear();
display.setNumber(1, 9); // set 9 at the 1st digit
display.setDot(1); // set . at the 1st digit
display.setNumber(2, 3); // set 3 at the 2nd digit
display.setChar(3, SegChars::DEGREE); // set ° at the 3rd digit
display.setChar(4, SegChars::C); // set C at the 3rd digit
display.show(); // show on the display
- Como el módulo de 4 dígitos de 7 segmentos 74HC595 utiliza la técnica de multiplexación para controlar segmentos y LEDs, el código ESP32 DEBE:
- Llamar a la función display.show() en el bucle principal
- No usar la función delay() en el bucle principal
Puede ver más detalles en la referencia de la biblioteca
Código ESP32 - Mostrar entero
/*
* 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-74hc595-4-digit-7-segment-display
*/
#include <DIYables_4Digit7Segment_74HC595.h> // DIYables_4Digit7Segment_74HC595 library
#define SCLK 27 // The ESP32 pin GPIO27 connected to SCLK
#define RCLK 26 // The ESP32 pin GPIO26 connected to RCLK
#define DIO 25 // The ESP32 pin GPIO25 connected to DIO
DIYables_4Digit7Segment_74HC595 display(SCLK, RCLK, DIO);
void setup() {
Serial.begin(9600);
display.printInt(-13, false); // you can display a value from -999 to 9999
//display.printInt(-132, false);
//display.printInt(9132, false);
//display.printInt(132, false);
//display.printInt(32, false);
//display.printInt(2, false);
//display.printInt(2, true);
}
void loop() {
display.loop(); // MUST call the display.loop() function in loop()
// DO SOMETHING HERE
// NOTE: do NOT use the delay() function in loop because it affects to the multiplexing
}
Pasos R\u00e1pidos
- Si es la primera vez que usas ESP32, consulta cómo configurar el entorno para ESP32 en Arduino IDE.
- Haz el cableado como en la imagen de arriba.
- Conecta la placa ESP32 a tu PC mediante un cable micro USB.
- Abre el IDE de Arduino en tu PC.
- Selecciona la placa ESP32 correcta (p. ej. ESP32 Dev Module) y el puerto COM.
- Copia el código anterior y ábrelo con el IDE de ESP32.
- Haz clic en el botón Upload del IDE de ESP32 para cargar el código en el ESP32.
- Observa los estados de la pantalla de 7 segmentos.
Código ESP32 - Mostrar flotante
/*
* 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-74hc595-4-digit-7-segment-display
*/
#include <DIYables_4Digit7Segment_74HC595.h> // DIYables_4Digit7Segment_74HC595 library
#define SCLK 27 // The ESP32 pin GPIO27 connected to SCLK
#define RCLK 26 // The ESP32 pin GPIO26 connected to RCLK
#define DIO 25 // The ESP32 pin GPIO25 connected to DIO
DIYables_4Digit7Segment_74HC595 display(SCLK, RCLK, DIO);
void setup() {
Serial.begin(9600);
display.printFloat(-9.2, 1, false);
//display.printFloat(-92.4, 1, false);
//display.printFloat(-9.24, 2, false);
//display.printFloat(192.4, 1, false);
//display.printFloat(19.24, 2, false);
//display.printFloat(1.924, 3, false);
}
void loop() {
display.loop(); // MUST call the display.loop() function in loop()
// DO SOMETHING HERE
// NOTE: do NOT use the delay() function in loop because it affects to the multiplexing
}
Código ESP32 - Mostrar temperatura
/*
* 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-74hc595-4-digit-7-segment-display
*/
#include <DIYables_4Digit7Segment_74HC595.h> // DIYables_4Digit7Segment_74HC595 library
#define SCLK 27 // The ESP32 pin GPIO27 connected to SCLK
#define RCLK 26 // The ESP32 pin GPIO26 connected to RCLK
#define DIO 25 // The ESP32 pin GPIO25 connected to DIO
DIYables_4Digit7Segment_74HC595 display(SCLK, RCLK, DIO);
void setup() {
Serial.begin(9600);
// display 9.3°C by controlling digit by digit
display.clear();
display.setNumber(1, 9); // set 9 at the 1st digit
display.setDot(1); // set . at the 1st digit
display.setNumber(2, 3); // set 3 at the 2nd digit
display.setChar(3, SegChars::DEGREE); // set ° at the 3rd digit
display.setChar(4, SegChars::C); // set C at the 3rd digit
display.show(); // show on the display
}
void loop() {
display.loop(); // MUST call the display.loop() function in loop()
// DO SOMETHING HERE
// NOTE: do NOT use the delay() function in loop because it affects to the multiplexing
}
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.