Uso de pantalla LCD I2C con ESP32 de forma sencilla

¡Hola equipo! Bienvenidos a Ingtelecto Pro. Hoy vamos a dar un paso gigante en la usabilidad de nuestros proyectos. Seamos honestos: depender del Monitor Serie para ver qué está pasando dentro de tu ESP32 es... aburrido y poco práctico si quieres hacer un dispositivo portátil.

La solución clásica es la pantalla LCD 16x2, pero la versión antigua requería conectar casi 12 cables, ocupando todos los pines de tu microcontrolador. ¡Una pesadilla!

Por suerte, hoy utilizaremos la versión moderna con adaptador I2C. Aprenderemos no solo a encenderla, sino a entender cómo funciona su memoria interna (CGRAM) para crear nuestros propios iconos (corazones, aliens, baterías). ¿Listos para iluminar ese display? ¡Vamos a darle! 📟✨

Materiales Necesarios

Para este tutorial, usaremos componentes muy comunes.

Fundamentos Técnicos: ¿Qué estamos conectando?

Antes de los cables, entendamos la "magia" detrás del módulo negro que está detrás de tu pantalla.

El Misterio de la Dirección I2C (0x27 vs 0x3F)

Aquí es donde muchos fallan. Aunque todos los módulos se ven iguales, el chip PCF8574 puede venir de dos fabricantes distintos, y eso cambia su "nombre" (dirección) en la red:

• Texas Instruments (PCF8574A): Suelen tener la dirección por defecto 0x3F.
• NXP Semiconductors (PCF8574): Suelen tener la dirección por defecto 0x27.

Además, si miras bien la placa, verás tres pads de soldadura llamados A0, A1 y A2. Si sueldas estos puentes, puedes cambiar la dirección manualmente. Esto es genial si quieres conectar dos pantallas iguales al mismo ESP32. ¡Pero no te preocupes por adivinar! Más abajo usaremos un escáner para saber la dirección exacta.

Conexiones y Diagramas ⚙️

El ESP32 usa por defecto los pines GPIO 21 y GPIO 22 para la comunicación I2C.

Tabla de Conexiones

Paso Crucial: Ajuste de Contraste

Muchos estudiantes conectan todo, suben el código y... ¡la pantalla está azul/verde pero vacía! 😱
No entres en pánico.
Detrás de la pantalla hay un pequeño cuadro azul con un tornillo (potenciómetro). Gíralo suavemente con un destornillador mientras la pantalla está encendida hasta que veas aparecer unos rectángulos blancos o las letras. Ese es el ajuste de contraste.

Paso 1: El Escáner I2C (¡Haz esto primero!)

Antes de intentar escribir texto, necesitamos confirmar que el ESP32 "ve" la pantalla y saber su dirección exacta. Carga este código:

// ESCÁNER I2C PARA ESP32

// Encuentra la dirección hexadecimal de tu dispositivo
#include
void setup() {

Wire.begin();

Serial.begin(115200);

while (!Serial); // Esperar al monitor serie

Serial.println("\nEscáner I2C iniciado...");

}
void loop() {

byte error, address;

int nDevices = 0;
Serial.println("Escaneando...");
for(address = 1; address < 127; address++ ) {

// Intentamos iniciar transmisión con cada dirección posible

Wire.beginTransmission(address);

error = Wire.endTransmission();
if (error == 0) {

Serial.print("¡Dispositivo I2C encontrado en la dirección: 0x");

if (address < 16)

Serial.print("0");

Serial.print(address, HEX);

Serial.println(" !");

nDevices++;

}

}
if (nDevices == 0)

Serial.println("No se encontraron dispositivos I2C\n");

else

Serial.println("Escaneo completado\n");
delay(5000); // Esperar 5 segundos antes de escanear de nuevo

}

Abre el Monitor Serie (115200 baudios). Deberías ver algo como: ¡Dispositivo I2C encontrado en la dirección: 0x27! (o 0x3F). ¡Anota ese número!

Paso 2: Instalación de la Librería

Usaremos la librería estándar y más robusta para esto.

1. Ve a Programa > Incluir Librería > Administrar Bibliotecas.
2. Escribe "liquidcrystal i2c" en el buscador.
3. Busca la versión de Frank de Brabander (o a veces aparece como Marco Schwartz).
4. Dale a Instalar.

Paso 3: Código "Hola Mundo" 👋

Ahora sí, vamos a escribir algo. Asegúrate de cambiar la dirección 0x27 por la que encontraste en el escáner.

#include
// CONFIGURACIÓN

// LiquidCrystal_I2C lcd(dirección, columnas, filas);

LiquidCrystal_I2C lcd(0x27, 16, 2);
void setup() {

// Inicializar el LCD

lcd.init();
// Encender la luz de fondo (Backlight)

lcd.backlight();
// --- Escribir en la primera línea ---

lcd.setCursor(0, 0); // (Columna 0, Fila 0)

lcd.print("Hola Ingtelecto!");
// --- Escribir en la segunda línea ---

lcd.setCursor(2, 1); // (Columna 2, Fila 1) -> Un poco centrado

lcd.print("ESP32 LCD");

}
void loop() {

// Nada por aquí todavía

}

Funciones Clave que debes conocer:

• lcd.init(): Prepara la pantalla.
• lcd.backlight(): Enciende la luz trasera. Usa lcd.noBacklight() para apagarla y ahorrar energía.
• lcd.setCursor(columna, fila): Mueve el puntero. Recuerda que empezamos a contar desde 0. La fila de arriba es la 0, la de abajo es la 1.
• lcd.clear(): Borra todo el texto de la pantalla.

Nivel Avanzado: Caracteres Personalizados y CGRAM 👾

¿Quieres mostrar un icono de batería, un corazón o un alien? El LCD estándar no los tiene... ¡pero podemos crearlos!

Aquí tienes un código divertido que carga iconos personalizados en la memoria del LCD y los muestra.

#include
LiquidCrystal_I2C lcd(0x27, 16, 2);
// --- DISEÑO DE ICONOS (Mapas de bits) ---

// Cada byte representa una fila horizontal del icono
byte Corazon[8] = {

0b00000,

0b01010, // * *

0b11111, // *****

0b11111, // *****

0b01110, // ***

0b00100, // *

0b00000,

0b00000

};
byte Alien[8] = {

0b11111, // *****

0b10101, // * * *

0b11111, // *****

0b11111, // *****

0b01110, // ***

0b01010, // * *

0b11011, // ** **

0b00000

};
void setup() {

lcd.init();

lcd.backlight();
// 1. Guardar los iconos en la memoria CGRAM (espacios 0 al 7)

lcd.createChar(0, Corazon);

lcd.createChar(1, Alien);
lcd.setCursor(0, 0);

lcd.print("I Love ESP32");
// 2. Mostrar el icono guardado en la dirección 0

lcd.setCursor(2, 0); // Ponemos el cursor sobre la palabra "Love"

lcd.write(0); // Escribimos el carácter 0 (Corazón)
lcd.setCursor(0, 1);

lcd.print("Invasion: ");

lcd.write(1); // Escribimos el carácter 1 (Alien)

lcd.write(1);

lcd.write(1);

}
void loop() {

// Animación simple: Parpadear el alien

lcd.setCursor(10, 1);

lcd.write(1); // Mostrar alien

delay(500);
lcd.setCursor(10, 1);

lcd.print(" "); // Borrar alien (espacio en blanco)

delay(500);

}

Truco Pro: Texto en Desplazamiento (Scroll)

Si tu mensaje es muy largo ("Bienvenidos al sistema de monitoreo de temperatura..."), no cabe en 16 caracteres. Puedes hacer que se mueva como una marquesina usando:

• lcd.scrollDisplayLeft(): Mueve todo el contenido una casilla a la izquierda.
• lcd.scrollDisplayRight(): Mueve todo a la derecha.

Simplemente pon ese comando dentro del loop() con un delay(300) y verás el efecto.

Conclusión