ESP32 - LCD 20x4

In this ESP32 LCD 20x4 I2C tutorial, we will learn how to connect an LCD 20x4 (Liquid Crystal Display) to the ESP32 board via I2C Interface.

Hardware Used In This Tutorial

1×ESP-WROOM-32 Dev Module
1×USB Cable Type-C
1×LCD 20x4
1×Jumper Wires
1×(Recommended) ESP32 Screw Terminal Adapter

Or you can buy the following sensor kits:

1×DIYables Sensor Kit (30 sensors/displays)
1×DIYables Sensor Kit (18 sensors/displays)
Disclosure: some of these links are affiliate links. We may earn a commission on your purchase at no extra cost to you. We appreciate it.

Introduction to LCD I2C 20x4

Pinout

LCD 20x4 I2C uses I2C interface, so it has 4 pins:

  • GND pin: needs to be connected to GND (0V).
  • VCC pin: the power supply for the LCD, needs to be connected to VCC (5V).
  • SDA pin: I2C data signal
  • SCL pin: I2C clock signal
LCD 20x4 I2C Pinout

LCD Coordinate

LCD I2C 20x4 includes 20 columns and 4 rows. the conlums and rows are indexed from 0.

ESP32 LCD I2C Coordinate

Wiring Diagram

ESP32 LCD 20x4 I2C Wiring Diagram

This image is created using Fritzing. Click to enlarge image

If you're unfamiliar with how to supply power to the ESP32 and other components, you can find guidance in the following tutorial: How to Power ESP32.

LCD I2C ESP32, Nano ESP32 Mega
Vin 5V 5V
GND GND GND
SDA A4 20
SCL A5 21

How To Program For LCD I2C

Thanks to the LiquidCrystal_I2C library, the using LCD is a piece of cake.

  • Include the library:
#include <LiquidCrystal_I2C.h> // Library for LCD
  • Declare a LiquidCrystal_I2C object with I2C address, the number of columns, the number of rows:
LiquidCrystal_I2C lcd(0x27, 20, 4); // I2C address 0x27, 20 column and 4 rows
  • Initialize the LCD.
lcd.init(); //initialize the lcd lcd.backlight(); //open the backlight
  • Move cursor to the desired position (column_index, row_index)
lcd.setCursor(column_index, row_index);
  • Print a message to the LCD.
lcd.print("Hello World!");

※ NOTE THAT:

The I2C address of LCD can vary according to the manufacturers. In the code, we used 0x27 that is specified by DIYables manufacturer

ESP32 Code

/* * This ESP32 code is created by esp32io.com * * This ESP32 code is released in the public domain * * For more detail (instruction and wiring diagram), visit https://esp32io.com/tutorials/esp32-lcd-20x4 */ #include <LiquidCrystal_I2C.h> LiquidCrystal_I2C lcd(0x27, 20, 4); // I2C address 0x27, 20 column and 4 rows void setup() { lcd.init(); // initialize the lcd lcd.backlight(); lcd.setCursor(0, 0); // move cursor the first row lcd.print("LCD 20x4"); // print message at the first row lcd.setCursor(0, 1); // move cursor to the second row lcd.print("I2C Address: 0x27"); // print message at the second row lcd.setCursor(0, 2); // move cursor to the third row lcd.print("DIYables"); // print message at the third row lcd.setCursor(0, 3); // move cursor to the fourth row lcd.print("www.diyables.io"); // print message the fourth row } void loop() { }

Quick Instructions

  • If this is the first time you use ESP32, see how to setup environment for ESP32 on Arduino IDE.
  • Do the wiring as above image.
  • Connect the ESP32 board to your PC via a micro USB cable
  • Open Arduino IDE on your PC.
  • Select the right ESP32 board (e.g. ESP32 Dev Module) and COM port.
  • Click to the Libraries icon on the left bar of the Arduino IDE.
  • Search "LiquidCrystal I2C", then find the LiquidCrystal_I2C library by Frank de Brabander
  • Click Install button to install LiquidCrystal_I2C library.
ESP32 LiquidCrystal I2C library
  • Copy the above code and open with Arduino IDE
  • Click Upload button on Arduino IDE to upload code to ESP32
  • See the result on LCD
  • Try modifying text and position

Video Tutorial

Making video is a time-consuming work. If the video tutorial is necessary for your learning, please let us know by subscribing to our YouTube channel , If the demand for video is high, we will make the video tutorial.

※ OUR MESSAGES