I2C LCD interfacing with ESP32 and ESP8266 in Arduino IDE




This is the tenth tutorial in a series of ESP32 tutorials. In this tutorial, I’m going to look at hooking up the I2C LCD to the ESP32 board. This I2C LCD is a sixteen by two device which means it can display 16 columns by two rows of characters.  The characters are alphanumeric, but you can create custom characters for basic graphics, bar graphs that kind of thing.  The LCD has the usual type of hd44780 controller, and it also has an I2C circuit connected with it which makes it easy to connect to the ESP32 board. 16X2 LCD without I2C circuit has sixteen pins. you can find more information about the pins by going to this article:




But if we want to connect this board directly with ESP32 board, we have to use at least eight general purpose input output pins of ESP32 which will be a waste of GPIO pins of ESP32. So the better solution is to use an I2C LCD instead of typical 16×2 LCD. In this tutorial, we are using 16×2 I2C LCD, but LCD of any size will also work the same way as we will learn in this tutorial.  The advantage of using an I2C LCD is that we only need to use two pins of ESP32 to connect with this display. I2C LCD interfacing with ESP32

I2C LCD pinout

So now let’s start with the pinout of this display. This display has four pins:




  • Ground pin
  • Vcc pin
  • SDA 
  • SCL

Now let’s see how to connect this LCD with the ESP32 development board. At the back side of this liquid crystal display, you can also see a variable resistor. This variable resistor is used to modify the brightness of LCD. This potentiometer is very handy when you are using this display module in the different light conditions.

Interfacing I2C LCD with ESP32

Now we will see the wiring diagram of I2C LCD with the ESP32 development board.  The wiring diagram is straightforward. We only need to use two GPIO pins of ESP32 Devkit with this display as you can see in the picture shown here.I2C LCD interfacing with ESP3 wiring diagram

In this circuit, we are using the default I2C communication pins of ESP32 board. In this board, GPIO22 is default SCL pin, and GPIO21 is default SDA pin for I2C communication.  So you need to connect GPIO22 with SCL pin of LCD and GPIO21 with SDA pin of liquid crystal display. You can also check to this table for wiring connections.

ESP32 Development Board I2C LCD
GPIO22 SCL
GPIO21 SDA
GROUND GND
3.3 VOLT / VCC PIN VIN

Code for I2C interfacing with ESP32

So we will move to the coding part. Before writing code, we need to prepare the Arduino IDE to write code. Followings are the essentials for this tutorial:

After installing ESP32 in Arduino IDE, We will introduce the library of  I2C LCD in Arduino IDE. This library is not available in the compiler. So we need to install an external library. There are many I2C  LCD libraries available. You can use different libraries if you want. But in this tutorial, we are using the library developed by johnrickman. Now add this library by following these steps:

  • Go to this link and download the I2C LCD library.
  • The file which you download in the last step will be a compressed or zip file. Now unzip this file.
  • After unzipping the file, you will get a folder with the name of LiquidCrystal_I2C-master. 
  • Rename this folder LiquidCrystal_I2C-master to  LiquidCrystal_I2C.
  • Now close the Arduino software, if you have already opened it.
  • Now copy this folder inside the library folder of your Arduino IDE.
  • Now open your Arduino software. Your library will be included successfully.

Till now you have successfully installed the library and made the circuit diagram.

Getting I2C LCD Address

When you connect your I2C display with ESP32 board, you need to check its address. Because every I2C device has an address associated with it. For many devices of I2C LCD, the default address is 0x27 where 0x shows hex format of the numbers. But address can be different for some cases. This address depends on the position of pads A0, A1 and A2 on I2C controller on this device. As you can see in this picture, we have three soldering pads, so we can have 8 different values of address depending on the connections of the pads.

Pad A0

Pad A1

Pad A2

HEX Address

1

1

1

0x27

0

1

1

0x26

1

0

1

0x25

0

0

1

0x24

1

1

0

0x23

0

1

0

0x22

1

0

0

0x21

0

0

0

0x20

But you don’t need to worry about the internal connections of this device; we will use the code given below to check the address of the controller. Now copy this code and upload it your board.

#include <Wire.h> // This library includes I2C communication functions 

void setup() {
Wire.begin();
Serial.begin(115200);
Serial.println("ESP32 scanning for I2C devices");
}

void loop() {
byte error_i2c, address_i2c;
int I2C_Devices;
Serial.println("Scanning started");
I2C_Devices = 0;
for(address_i2c = 1; address_i2c < 127; address_i2c++ )
{
Wire.beginTransmission(address_i2c);
error_i2c = Wire.endTransmission();
if (error_i2c == 0) {
Serial.print("I2C device found at address_i2c 0x");
if (address_i2c<16) 
{
Serial.print("0");
}
Serial.println(address_i2c,HEX);
I2C_Devices++;
}
else if (error_i2c==4) 
{
Serial.print("Unknow error_i2c at address_i2c 0x");
if (address_i2c<16) 
{
Serial.print("0");
}
Serial.println(address_i2c,HEX);
} 
}
if (I2C_Devices == 0) 
{
Serial.println("No I2C device connected \n");
}
else {
Serial.println("done I2C device searching\n");
}
delay(2000); 
}

This code will search for devices connected with GPIO pins 22 and 21 and display its result on the serial monitor.  After connecting the device with ESP32 board properly, you will get this message on the serial monitor. This message shows the address of liquid crystal display which is 0x27. You will most likely get the same address for LCD with 16 columns and 2 rows.I2C LCD address with ESP32

displaying the message on I2C LCD

Now we will come to the main part of this tutorial. In this section, we will show a static message on the screen.

#include <LiquidCrystal_I2C.h>

int totalColumns = 16;
int totalRows = 2;

LiquidCrystal_I2C lcd(0x27, totalColumns, totalRows);

void setup(){
lcd.init(); 
lcd.backlight(); // use to turn on and turn off LCD back light
}

void loop()
{
lcd.setCursor(0, 0);
lcd.print("Microcontrollerslab");
lcd.setCursor(0,1);
lcd.print("I2C LCD tutorial");
delay(1000);
lcd.clear(); 
lcd.setCursor(0, 0);
lcd.print("Static text");
delay(1000);
lcd.setCursor(0,1);
lcd.print("I2C LCD tutorial");
delay(1000);
lcd.clear(); 
}

This code will display the message “Microcontrollerslab” in the first row and “I2C LCD tutorial” in the second row for one second. After that, it will clear the LCD and displays “Static text” in the first row and “I2C LCD tutorial” in the second row as shown below.

Now we will see the working of code.  This line will add the library in the code.

#include <LiquidCrystal_I2C.h>

These two variables define the name of the total number of rows and columns of the display which in our case is 16×2. If you want to use the screen of any other size, you need to need to change the number here accordingly, for example, 20×4 display.

int totalColumns = 16;
int totalRows = 2;

This line is used to initialize the library with the address of LCD, the total number of columns and rows. The first argument to this function is an address which we have found in the last example. Second and thirds arguments are the size in terms of the number of columns and number of rows.

LiquidCrystal_I2C lcd(0x27, totalColumns, totalRows);

Inside the step(), we first initialized the LCD with above-mentioned parameters.

lcd.init();

This backlight() function is used to turn on or turn off the backlight. Every LCD has a backlight built-in inside it, so you can control it through this function.

lcd.backlight();

In loop() part, code is used to display messages and also to clear the message for LCD. To display anything text on LCD, first, you need to set the cursor position. Cursor position defines where you want to display the text. The setCursor() function is used to set the position. For example, if you want to set the cursor to the first row and first column, you will use this function like this:

lcd.setCursor(0,0);

If you want to set the cursor to the first column and second row, you will use this function like this:

lcd.setCursor(0,1);

First values inside this function define column number and second value defines row number.  So inside the loop(), first we set the cursor to the first row and second column. After that lcd.print() will display the message “microcontrollerslab” in the first row.

lcd.setCursor(0, 0);
lcd.print("Microcontrollerslab");

Similarly, these two lines will set the cursor to the second row and display the text  “I2C LCD tutorial” on the second row. For one second same text will be displayed in the first and second row. The delay() is used to add the delay of one second.

lcd.setCursor(0,1);
lcd.print("I2C LCD tutorial");
delay(1000);

After waiting for one second, clear() will erase the text.

 lcd.clear();

Now the other section of the code also works the same way.

lcd.setCursor(0, 0);    // move cursor to starting position 
lcd.print("Static text");  // display text " Static text"
lcd.setCursor(0,1);       // move the curos to second row
lcd.print("I2C LCD tutorial");   //display a string 
delay(1000);               //  add delay of 1 second
lcd.clear();                 // clear the screen

So this is how we can use I2C LCD with ESP32 and you use the same instructions for the ESP8266 development board.

you may also like to check other ESP32 projects :



Leave a Comment