"Electronic DIY" Uses a 16×2I2C LCD Display With ESP32

A few weeks ago, I studied the ESP32 module and built a simple hello world program to get familiar with the board. Today we'll continue exploring the ESP32 at a higher level and we'll look at how to connect a 16×2 LCD display to it.

This is probably one of the most popular LCD monitor manufacturers and one of the most popular LCD monitor manufacturers. In today's tutorial we will be using an I2C based 16×2 LCD monitor as it requires easy wiring. It uses only four pins, whereas other versions of the display require at least 7 pins to connect to the microcontroller board.

The ESP32 comes in module form, like its predecessor the ESP-12e, as using the module typically requires a breakout board. Therefore, when it is to be used in an application without a custom PCB, it will be easier to use a development board based on it. In today's tutorial we will be using the must have ESP32 DevKit V1 which is one of the most popular ESP32 development boards.

To demonstrate the use of I2C driven LCD and NodeMCU, we will look at how to display static and scrolling messages on the LCD.

Supplies

Thanks to Techlion LCD providing these components.

Step 1:

The following components are required to construct this project:;

Must be an ESP32 DevKit V1 board

breadboard

16×2i2c LCD display

jumper wires

The breadboard requirement is optional as you can choose to use female jumpers to connect the LCD directly to the DOIT devkit board.

Schematic diagram

The schematic for this project is relatively simple as we are only connecting the LCD to the doitdevkitv1. Since we are using I2C for communication, we will connect the LCD's pins to the DevKit's I2C pins. Connect the parts as shown below.

A pinout diagram showing how the components are connected is shown below.

LCD–ESP32

GND - GNDVCC - 3.3v/VinSDA - D2(GPIO4)SCL - D1 (GPIO 5)

Due to the LCD's power requirements, it may not be bright enough when connected to the ESP32's 3.3v pin. If this is the case, connect the LCD's VCC pin to the ESP32's Vin pin so it can draw power directly from the connected power supply.

Detect the I2C address of the LCD

At this point, it's important to note that a special setup is required to enable you to program ESP32-based boards using the Arduino IDE. Our introduction to the ESP32 tutorial was published a few weeks ago. So, be sure to check it out.

To easily program an LCD with I2C, we will use the I2C LCD library. This library has functions and commands that make LCD addressing easier. Download the I2C LCD library from the attached link to install on the Arduino IDE, just unzip it into the Arduino's libraries folder.

Before writing code for your project, know the I2C address because without it we will not be able to talk to the display.

While some LCDs have an address displayed on them or an address provided by the seller, in the absence of an address you can determine the address using a simple sketch i.e. an I2C line to detect the one connected next to its address equipment. This sketch is also a good way to test the correctness of the wiring or determine if the LCD is working properly.

Step 2:

Copy the code below and paste it into the Arduino IDE.

#include <Wire.h>

void setup() {

Wire.begin();

Serial.begin(115200);

Serial.println("nI2C Scanner");

}

void loop() {

byte error, address;

int nDevices;

Serial.println("Scanning...");

nDevices = 0;

for(address = 1; address < 127; address++ )

{

// The i2c_scanner uses the return value of

// the Write.endTransmisstion to see if

// a device did acknowledge to the address.

Wire.beginTransmission(address);

error = Wire.endTransmission();

if (error == 0) {

Serial.print("I2C device found at address 0x");

if (address<16) {

Serial.print("0");

}

Serial.println(address,HEX);

nDevices++;

}

else if (error==4) {

Serial.print("Unknow error at address 0x");

if (address<16) {

Serial.print("0");

}

Serial.println(address,HEX);

}

if (nDevices == 0) {

Serial.println("No I2C devices foundn");

}

else {

Serial.println("donen");

}

delay(5000);

}

This sketch basically uses a "for" loop to generate a list of addresses and then sends a begin transmission request to the addresses. The return value of the Write.endTransmission() function shows whether a device exists at that address. The address that receives the response is the address we are looking for.

Verify and upload the code to the ESP32 board and open the serial monitor. You should see an address like the image below:

Device address

If you keep getting "no device found" then take a look at these connections to make sure you're not confusing things, you can also go ahead and try 0x27 as the I2C address. This is common to most I2C LCD modules from China address.

With the address in hand, we can now write the code for this project.

code

Our task in today's tutorial is to display static and scrolling text on an LCD, and in order to achieve this we will use the I2C LCD library to reduce the amount of code that needs to be written. We will write two separate sketches; one showing static text and another showing both static and scrolling text.

static text

To start with a sketch of a static text display, we start the code by including the library we want to use for it (in this case the i2clcd library).

#include <LiquidCrystal_I2C.h>

Next, we create an instance of the I2CLCD library class with as parameters the address of the display, the number of columns of the display (16 columns in this case), and the number of rows (2 rows in this case).

LiquidCrystal_I2C lcd(0x27, 16, 2);

Once completed, we enter the void settings() function. Here we initialize the display and issue a command to turn on the backlight, since depending on the LCD the backlight may be off by default.

void setup(){

// initialize LCD

lcd.init();

// turn on LCD backlight

lcd.backlight();

}

Next is the void loop() function. The idea behind the loop code is simple, we first set the cursor to the displayed column and row and then use the lcd.print() function. To allow the text to stay on the screen for a while before the reload loop (so it is visible), we delay it by 1000 milliseconds.

void loop(){

// set cursor to first column, first row

lcd.setCursor(0, 0);

// print message

lcd.print("Hello, World!");

delay(1000);

// clears the display to print new message

}

The complete code for the project can be found below or attached under the downloads section.

#include <LiquidCrystal_I2C.h>

// set LCD address, number of columns and rows

// if you don't know your display address, run an I2C scanner sketch

LiquidCrystal_I2C lcd(0x27, 16, 2);

void setup(){

// initialize LCD

lcd.init();

// turn on LCD backlight

lcd.backlight();

}

void loop(){

// set cursor to first column, first row

lcd.setCursor(0, 0);

// print message

lcd.print("Hello, World!");

delay(1000);

// clears the display to print new message

}

scroll text

For the scrolling text we will be using Bad Santos of RandomNerdTutorials.com. This code allows to display static text on the first line while displaying scrolling text on the second line.

As usual, we start by including the library we will use for the sketch, in this case the same I2C LCD library.

/*****

Rui Santos

*********/

#include <LiquidCrystal_I2C.h>

LiquidCrystal_I2C lcd(0x27, 16, 2);

Next, we create variables to hold the message to be displayed.

String messageStatic = "Static message";

String messageToScroll = "This is a scrolling message with more than 16 characters";

Next, we create the function to display the scrolling text. This function accepts four parameters: the line to display the scrolling text, the text to be displayed, the delay between character movements, and the number of columns of the LCD.

void scrollText(int row, String message, int delayTime, int lcdColumns) {

for (int i=0; i < lcdColumns; i++) {

message = " " + message;

}

message = message + " ";

for (int pos = 0; pos < message.length(); pos++) {

lcd.setCursor(0, row);

lcd.print(message.substring(pos, pos + lcdColumns));

delay(delayTime);

}

Next is the void setup() function. This functionality is the same as a static text display when we initialize the display and turn on the backlight.

void setup(){

// initialize LCD

lcd.init();

// turn on LCD backlight

lcd.backlight();

}

Once that's done, we go to the void loop() function. We first set the cursor and then use the print function to display the static text and the scrolltext() function to display the scrolling text

void loop(){

// set cursor to first column, first row

lcd.setCursor(0, 0);

// print static message

lcd.print(messageStatic);

// print scrolling message

scrollText(1, messageToScroll, 250, lcdColumns);

}

The complete code for this sketch is provided below and can also be found in the download section of this tutorial.

// Adapted from the code by

// Rui Santos

// https://randomnerdtutorials.com

#include <LiquidCrystal_I2C.h>

// if you don't know your display address, run an I2C scanner sketch

LiquidCrystal_I2C lcd(0x27, 16, 2);

String messageStatic = "Static message";

String messageToScroll = "This is a scrolling message with more than 16 characters";

// Function to scroll text

// The function accepts the following arguments:

// row: row number where the text will be displayed

// message: message to scroll

// delayTime: delay between each character shifting

// lcdColumns: number of columns of your LCD

void scrollText(int row, String message, int delayTime, int lcdColumns) {

for (int i=0; i < lcdColumns; i++) {

message = " " + message;

}

message = message + " ";

for (int pos = 0; pos < message.length(); pos++) {

lcd.setCursor(0, row);

lcd.print(message.substring(pos, pos + lcdColumns));

delay(delayTime);

}

void setup(){

// initialize LCD

lcd.init();

// turn on LCD backlight

lcd.backlight();

}

void loop(){

// set cursor to first column, first row

lcd.setCursor(0, 0);

// print static message

lcd.print(messageStatic);

// print scrolling message

scrollText(1, messageToScroll, 250, 16);

}

Demo

Make sure the connection is correct, the connection must be either of the two sketches uploaded by devkit. You should see this display appear with the text shown in the image below.