{"id":67483,"date":"2019-02-01T09:34:07","date_gmt":"2019-02-01T09:34:07","guid":{"rendered":"http:\/\/randomnerdtutorials.com\/?p=67483"},"modified":"2024-08-22T09:54:46","modified_gmt":"2024-08-22T09:54:46","slug":"esp32-esp8266-i2c-lcd-arduino-ide","status":"publish","type":"post","link":"https:\/\/randomnerdtutorials.com\/esp32-esp8266-i2c-lcd-arduino-ide\/","title":{"rendered":"How to Use I2C LCD with ESP32 on Arduino IDE (ESP8266 compatible)"},"content":{"rendered":"<p>This tutorial shows how to use the I2C LCD (Liquid Crystal Display) with the ESP32 using Arduino IDE. We&#8217;ll show you how to wire the display, install the library and try sample code to write text on the LCD: static text, and scroll long messages. You can also use this guide with the ESP8266.<!--more--><\/p>\n<p><img data-recalc-dims=\"1\" fetchpriority=\"high\" decoding=\"async\" class=\"aligncenter wp-image-67547 size-full\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/LCD-display-featured-image.jpg?resize=1200%2C675&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"1200\" height=\"675\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/LCD-display-featured-image.jpg?w=1280&amp;quality=100&amp;strip=all&amp;ssl=1 1280w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/LCD-display-featured-image.jpg?resize=300%2C169&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/LCD-display-featured-image.jpg?resize=768%2C432&amp;quality=100&amp;strip=all&amp;ssl=1 768w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/LCD-display-featured-image.jpg?resize=1024%2C576&amp;quality=100&amp;strip=all&amp;ssl=1 1024w\" sizes=\"(max-width: 1200px) 100vw, 1200px\" \/><\/p>\n<h2>16&#215;2 I2C Liquid Crystal Display<\/h2>\n<p>For this tutorial we&#8217;ll be using a 16&#215;2 I2C LCD display, but LCDs with other sizes should also work.<\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"aligncenter size-full wp-image-67540\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/i2c_LCD.jpg?resize=750%2C500&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"750\" height=\"500\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/i2c_LCD.jpg?w=750&amp;quality=100&amp;strip=all&amp;ssl=1 750w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/i2c_LCD.jpg?resize=300%2C200&amp;quality=100&amp;strip=all&amp;ssl=1 300w\" sizes=\"(max-width: 750px) 100vw, 750px\" \/><\/p>\n<p>The advantage of using an I2C LCD is that the wiring is really simple. You just need to wire the SDA and SCL pins.<\/p>\n<p>Additionally, it comes with a built-in potentiometer you can use to adjust the contrast between the background and the characters on the LCD. On a &#8220;regular&#8221; LCD you need to add a potentiometer to the circuit to adjust the contrast.<\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"aligncenter size-full wp-image-67542\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/lcd_adjust_pot.jpg?resize=750%2C500&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"750\" height=\"500\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/lcd_adjust_pot.jpg?w=750&amp;quality=100&amp;strip=all&amp;ssl=1 750w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/lcd_adjust_pot.jpg?resize=300%2C200&amp;quality=100&amp;strip=all&amp;ssl=1 300w\" sizes=\"(max-width: 750px) 100vw, 750px\" \/><\/p>\n<h2>Parts Required<\/h2>\n<p>To follow this tutorial you need these parts:<\/p>\n<ul>\n<li><a href=\"https:\/\/makeradvisor.com\/tools\/esp32-dev-board-wi-fi-bluetooth\/\" target=\"_blank\" rel=\"noopener noreferrer\">ESP32 DOIT DEVKIT V1 Board<\/a>\u00a0\u2013\u00a0<a href=\"https:\/\/makeradvisor.com\/esp32-development-boards-review-comparison\/\" target=\"_blank\" rel=\"noopener noreferrer\">read ESP32 Development Boards Review and Comparison<\/a><\/li>\n<li>Optional &#8211;\u00a0<a href=\"https:\/\/makeradvisor.com\/tools\/esp8266-esp-12e-nodemcu-wi-fi-development-board\/\" target=\"_blank\" rel=\"noopener noreferrer\">ESP8266 12-E<\/a>\u00a0\u2013 read\u00a0<a href=\"https:\/\/makeradvisor.com\/best-esp8266-wi-fi-development-board\/\" target=\"_blank\" rel=\"noopener noreferrer\">Best ESP8266 Wi-Fi Development Boards<\/a><\/li>\n<li><a href=\"https:\/\/makeradvisor.com\/i2c-lcd-16x2\/\">16&#215;2 I2C Liquid Crystal Display (LCD)<\/a><\/li>\n<li><a href=\"https:\/\/makeradvisor.com\/tools\/jumper-wires-kit-120-pieces\/\">Female to female jumper wires<\/a><\/li>\n<\/ul>\n<p>You can use the preceding links or go directly to <a href=\"https:\/\/makeradvisor.com\/tools\/?utm_source=rnt&utm_medium=post&utm_campaign=post\" target=\"_blank\">MakerAdvisor.com\/tools<\/a> to find all the parts for your projects at the best price!<\/p><p style=\"text-align:center;\"><a href=\"https:\/\/makeradvisor.com\/tools\/?utm_source=rnt&utm_medium=post&utm_campaign=post\" target=\"_blank\"><img data-recalc-dims=\"1\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2017\/10\/header-200.png?w=1200&#038;quality=100&#038;strip=all&#038;ssl=1\"><\/a><\/p>\n<h2>Wiring the LCD to the ESP32<\/h2>\n<p>This display uses I2C communication, which makes wiring really simple.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-67541\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/I2C_LCD2.jpg?resize=750%2C500&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"750\" height=\"500\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/I2C_LCD2.jpg?w=750&amp;quality=100&amp;strip=all&amp;ssl=1 750w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/I2C_LCD2.jpg?resize=300%2C200&amp;quality=100&amp;strip=all&amp;ssl=1 300w\" sizes=\"(max-width: 750px) 100vw, 750px\" \/><\/p>\n<p>Wire your LCD to the ESP32 by following the next schematic diagram.\u00a0We&#8217;re using the ESP32 default I2C pins (<span class=\"rnthl rntcgreen\">GPIO 21<\/span> and <span class=\"rnthl rntcblue\">GPIO 22<\/span>).<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-67508\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp32_LCD_bb.png?resize=751%2C374&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"751\" height=\"374\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp32_LCD_bb.png?w=1518&amp;quality=100&amp;strip=all&amp;ssl=1 1518w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp32_LCD_bb.png?resize=300%2C149&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp32_LCD_bb.png?resize=768%2C382&amp;quality=100&amp;strip=all&amp;ssl=1 768w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp32_LCD_bb.png?resize=1024%2C510&amp;quality=100&amp;strip=all&amp;ssl=1 1024w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp32_LCD_bb.png?resize=975%2C487&amp;quality=100&amp;strip=all&amp;ssl=1 975w\" sizes=\"(max-width: 751px) 100vw, 751px\" \/><\/p>\n<p>You can also use the following table as a reference.<\/p>\n<table>\n<tbody>\n<tr>\n<td><strong>I2C LCD<\/strong><\/td>\n<td><strong>ESP32<\/strong><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">GND<\/span><\/td>\n<td><span class=\"rnthl rntcblack\" style=\"font-weight: 400;\">GND<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">VCC<\/span><\/td>\n<td><span class=\"rnthl rntcred\" style=\"font-weight: 400;\">VIN<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">SDA<\/span><\/td>\n<td><span class=\"rnthl rntcgreen\" style=\"font-weight: 400;\">GPIO 21<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">SCL<\/span><\/td>\n<td><span class=\"rnthl rntcblue\" style=\"font-weight: 400;\">GPIO 22<\/span><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h2>Wiring the LCD to the ESP8266<\/h2>\n<p>You can also wire your LCD to the ESP8266 by following the next schematic diagram.\u00a0We&#8217;re using the ESP8266 default I2C pins (<span class=\"rnthl rntcgreen\">GPIO 4<\/span> and <span class=\"rnthl rntcblue\">GPIO 5<\/span>).<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-large wp-image-67633\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp8266_LCD.png?resize=1024%2C370&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"1024\" height=\"370\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp8266_LCD.png?resize=1024%2C370&amp;quality=100&amp;strip=all&amp;ssl=1 1024w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp8266_LCD.png?resize=300%2C108&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp8266_LCD.png?resize=768%2C278&amp;quality=100&amp;strip=all&amp;ssl=1 768w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/esp8266_LCD.png?w=1599&amp;quality=100&amp;strip=all&amp;ssl=1 1599w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\n<p>You can also use the following table as a reference.<\/p>\n<table>\n<tbody>\n<tr>\n<td><strong>I2C LCD<\/strong><\/td>\n<td><strong>ESP8266<\/strong><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">GND<\/span><\/td>\n<td><span class=\"rnthl rntcblack\" style=\"font-weight: 400;\">GND<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">VCC<\/span><\/td>\n<td><span class=\"rnthl rntcred\" style=\"font-weight: 400;\">VIN<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">SDA<\/span><\/td>\n<td><span class=\"rnthl rntcgreen\" style=\"font-weight: 400;\">GPIO 4<\/span> <span style=\"font-weight: 400;\">(D2)<\/span><\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400;\">SCL<\/span><\/td>\n<td><span class=\"rnthl rntcblue\" style=\"font-weight: 400;\">GPIO 5<\/span> <span style=\"font-weight: 400;\">(D1)<\/span><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h2>Preparing the Arduino IDE<\/h2>\n<p>Before proceeding with the project, you need to install the ESP32 or ESP8266 add-on in the Arduino IDE.<\/p>\n<h3>Arduino IDE with ESP32<\/h3>\n<p>Follow one of the next guides to prepare your Arduino IDE to work with the ESP32:<\/p>\n<ul>\n<li><a href=\"https:\/\/randomnerdtutorials.com\/installing-the-esp32-board-in-arduino-ide-windows-instructions\/\"><strong>Windows<\/strong>\u00a0instructions \u2013 ESP32 Board in Arduino IDE<\/a><\/li>\n<li><a href=\"https:\/\/randomnerdtutorials.com\/installing-the-esp32-board-in-arduino-ide-mac-and-linux-instructions\/\"><strong>Mac and Linux<\/strong>\u00a0instructions \u2013 ESP32 Board in Arduino IDE<\/a><\/li>\n<\/ul>\n<h3>Arduino IDE with ESP8266<\/h3>\n<p>To install the ESP8266 add-on in your Arduino IDE, read the following tutorial: <a href=\"https:\/\/randomnerdtutorials.com\/how-to-install-esp8266-board-arduino-ide\/\">How to Install the ESP8266 Board in Arduino IDE<\/a>.<\/p>\n<h2>Installing the\u00a0LiquidCrystal_I2C Library<\/h2>\n<p>There are several libraries that work with the I2C LCD. We&#8217;re using <a href=\"https:\/\/github.com\/marcoschwartz\/LiquidCrystal_I2C\" target=\"_blank\" rel=\"noopener noreferrer\">this library by Marco Schwartz<\/a>. Follow the next steps to install the library:<\/p>\n<ol>\n<li><a href=\"https:\/\/github.com\/marcoschwartz\/LiquidCrystal_I2C\/archive\/master.zip\" target=\"_blank\" rel=\"noopener noreferrer\">Click here to download the LiquidCrystal_I2C library<\/a>. You should have a .zip folder in your Downloads<\/li>\n<li>Unzip the\u00a0<em>.zip<\/em>\u00a0folder and you should get\u00a0<strong>LiquidCrystal_I2C-master\u00a0<\/strong>folder<\/li>\n<li>Rename your folder from <del><strong>LiquidCrystal_I2C-master<\/strong><\/del>\u00a0to<strong>\u00a0LiquidCrystal_I2C<\/strong><\/li>\n<li>Move the <strong>LiquidCrystal_I2C\u00a0<\/strong>folder to your Arduino IDE installation\u00a0<strong>libraries\u00a0<\/strong>folder<\/li>\n<li>Finally, re-open your Arduino IDE<\/li>\n<\/ol>\n<h2>Getting the LCD Address<\/h2>\n<p>Before displaying text on the LCD, you need to find the LCD I2C address. With the LCD properly wired to the ESP32, upload the following I2C Scanner sketch.<\/p>\n<pre style=\"max-height: 40em; margin-bottom: 20px;\"><code class=\"language-c\">\/*********\n  Rui Santos\n  Complete project details at https:\/\/randomnerdtutorials.com  \n*********\/\n\n#include &lt;Wire.h&gt;\n \nvoid setup() {\n  Wire.begin();\n  Serial.begin(115200);\n  Serial.println(&quot;\\nI2C Scanner&quot;);\n}\n \nvoid loop() {\n  byte error, address;\n  int nDevices;\n  Serial.println(&quot;Scanning...&quot;);\n  nDevices = 0;\n  for(address = 1; address &lt; 127; address++ ) {\n    Wire.beginTransmission(address);\n    error = Wire.endTransmission();\n    if (error == 0) {\n      Serial.print(&quot;I2C device found at address 0x&quot;);\n      if (address&lt;16) {\n        Serial.print(&quot;0&quot;);\n      }\n      Serial.println(address,HEX);\n      nDevices++;\n    }\n    else if (error==4) {\n      Serial.print(&quot;Unknow error at address 0x&quot;);\n      if (address&lt;16) {\n        Serial.print(&quot;0&quot;);\n      }\n      Serial.println(address,HEX);\n    }    \n  }\n  if (nDevices == 0) {\n    Serial.println(&quot;No I2C devices found\\n&quot;);\n  }\n  else {\n    Serial.println(&quot;done\\n&quot;);\n  }\n  delay(5000);          \n}\n<\/code><\/pre>\n\t<p style=\"text-align:center\"><a class=\"rntwhite\" href=\"https:\/\/github.com\/RuiSantosdotme\/Random-Nerd-Tutorials\/raw\/master\/Projects\/LCD_I2C\/I2C_Scanner.ino\" target=\"_blank\">View raw code<\/a><\/p>\n<p>After uploading the code, open the Serial Monitor at a baud rate of 115200. Press the ESP32 EN button. The I2C address should be displayed in the Serial Monitor.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-67487\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/scan_i2c.png?resize=624%2C248&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"624\" height=\"248\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/scan_i2c.png?w=624&amp;quality=100&amp;strip=all&amp;ssl=1 624w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/scan_i2c.png?resize=300%2C119&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/scan_i2c.png?resize=250%2C100&amp;quality=100&amp;strip=all&amp;ssl=1 250w\" sizes=\"(max-width: 624px) 100vw, 624px\" \/><\/p>\n<p>In this case the address is <strong>0x27<\/strong>. If you&#8217;re using a similar 16&#215;2 display, you&#8217;ll probably get the same address.<\/p>\n<h2>Display Static Text on the LCD<\/h2>\n<p>Displaying static text on the LCD is very simple. All you have to do is select where you want the characters to be displayed on the screen, and then send the message to the display.<\/p>\n<p>Here&#8217;s a very simple sketch example that displays &#8220;<strong>Hello, World!<\/strong>&#8220;.<\/p>\n<pre style=\"max-height: 40em; margin-bottom: 20px;\"><code class=\"language-c\">\/*********\n  Rui Santos\n  Complete project details at https:\/\/randomnerdtutorials.com  \n*********\/\n\n#include &lt;LiquidCrystal_I2C.h&gt;\n\n\/\/ set the LCD number of columns and rows\nint lcdColumns = 16;\nint lcdRows = 2;\n\n\/\/ set LCD address, number of columns and rows\n\/\/ if you don't know your display address, run an I2C scanner sketch\nLiquidCrystal_I2C lcd(0x27, lcdColumns, lcdRows);  \n\nvoid setup(){\n  \/\/ initialize LCD\n  lcd.init();\n  \/\/ turn on LCD backlight                      \n  lcd.backlight();\n}\n\nvoid loop(){\n  \/\/ set cursor to first column, first row\n  lcd.setCursor(0, 0);\n  \/\/ print message\n  lcd.print(&quot;Hello, World!&quot;);\n  delay(1000);\n  \/\/ clears the display to print new message\n  lcd.clear();\n  \/\/ set cursor to first column, second row\n  lcd.setCursor(0,1);\n  lcd.print(&quot;Hello, World!&quot;);\n  delay(1000);\n  lcd.clear(); \n}\n<\/code><\/pre>\n\t<p style=\"text-align:center\"><a class=\"rntwhite\" href=\"https:\/\/github.com\/RuiSantosdotme\/Random-Nerd-Tutorials\/raw\/master\/Projects\/LCD_I2C\/I2C_LCD_Display_Text.ino\" target=\"_blank\">View raw code<\/a><\/p>\n<p>It displays the message in the first row, and then in the second row.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-67544\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/static-text.gif?resize=480%2C270&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"480\" height=\"270\" \/><\/p>\n<p>In this simple sketch we show you the most useful and important functions from the <span class=\"rnthl rntliteral\">LiquidCrystal_I2C<\/span> library. So, let&#8217;s take a quick look at how the code works.<\/p>\n<h3>How the code works<\/h3>\n<p>First, you need to include the<span class=\"rnthl rntliteral\">LiquidCrystal_I2C<\/span> library.<\/p>\n<pre class=\"language-python\"><code>#include &lt;LiquidCrystal_I2C.h&gt;<\/code><\/pre>\n<p>The next two lines set the number of columns and rows of your LCD display. If you&#8217;re using a display with another size, you should modify those variables.<\/p>\n<pre class=\"language-python\"><code class=\"language-c\">int lcdColumns = 16;\nint lcdRows = 2;<\/code><\/pre>\n<p>Then, you need to set the display address, the number of columns and number of rows. You should use the display address you&#8217;ve found in the previous step.<\/p>\n<pre class=\"language-python\"><code>LiquidCrystal_I2C lcd(0x27, lcdColumns, lcdRows);<\/code><\/pre>\n<p>In the <span class=\"rnthl rntliteral\">setup()<\/span>, first initialize the display with the <span class=\"rnthl rntliteral\">init()<\/span> method.<\/p>\n<pre class=\"language-python\"><code>lcd.init();<\/code><\/pre>\n<p>Then, turn on the LCD backlight, so that you&#8217;re able to read the characters on the display.<\/p>\n<pre class=\"language-python\"><code>lcd.backlight();<\/code><\/pre>\n<p>To display a message on the screen, first you need to set the cursor to where you want your message to be written. The following line sets the cursor to the first column, first row.<\/p>\n<pre class=\"language-python\"><code>lcd.setCursor(0, 0);<\/code><\/pre>\n<p><strong>Note<\/strong>: 0 corresponds to the first column, 1 to the second column, and so on&#8230;<\/p>\n<p>Then, you can finally print your message on the display using the <span class=\"rnthl rntliteral\">print()<\/span> method.<\/p>\n<pre class=\"language-python\"><code>lcd.print(\"Hello, World!\");<\/code><\/pre>\n<p>Wait one second, and then clean the display with the <span class=\"rnthl rntliteral\">clear()<\/span> method.<\/p>\n<pre class=\"language-python\"><code>lcd.clear();<\/code><\/pre>\n<p>After that, set the cursor to a new position: first column, second row.<\/p>\n<pre class=\"language-python\"><code>lcd.setCursor(0,1);<\/code><\/pre>\n<p>Then, the process is repeated.<\/p>\n<p>So, here&#8217;s a summary of the functions to manipulate and write on the display:<\/p>\n<ul>\n<li><span class=\"rnthl rntliteral\">lcd.init()<\/span>: initializes the display<\/li>\n<li><span class=\"rnthl rntliteral\">lcd.backlight()<\/span>: turns the LCD backlight on<\/li>\n<li><span class=\"rnthl rntliteral\">lcd.setCursor(int column, int row)<\/span>: sets the cursor to the specified column and row<\/li>\n<li><span class=\"rnthl rntliteral\">lcd.print(String message)<\/span>: displays the message on the display<\/li>\n<li><span class=\"rnthl rntliteral\">lcd.clear()<\/span>: clears the display<\/li>\n<\/ul>\n<p>This example works well to display static text no longer than 16 characters.<\/p>\n<h2>Display Scrolling Text on the LCD<\/h2>\n<p>Scrolling text on the LCD is specially useful when you want to display messages longer than 16 characters. The library comes with built-in functions that allows you to scroll text.\u00a0However, many people experience problems with those functions because:<\/p>\n<ul>\n<li>The function scrolls text on both rows. So, you can&#8217;t have a fixed row and a scrolling row;<\/li>\n<li>It doesn&#8217;t work properly if you try to display messages longer than 16 characters.<\/li>\n<\/ul>\n<p>So, we&#8217;ve created a sample sketch with a function you can use in your projects to scroll longer messages.<\/p>\n<p>The following sketch displays a static message in the first row and a scrolling message longer than 16 characters in the second row.<\/p>\n<pre style=\"max-height: 40em; margin-bottom: 20px;\"><code class=\"language-c\">\/*********\n  Rui Santos\n  Complete project details at https:\/\/randomnerdtutorials.com  \n*********\/\n\n#include &lt;LiquidCrystal_I2C.h&gt;\n\n\/\/ set the LCD number of columns and rows\nint lcdColumns = 16;\nint lcdRows = 2;\n\n\/\/ set LCD address, number of columns and rows\n\/\/ if you don't know your display address, run an I2C scanner sketch\nLiquidCrystal_I2C lcd(0x27, lcdColumns, lcdRows);  \n\nString messageStatic = &quot;Static message&quot;;\nString messageToScroll = &quot;This is a scrolling message with more than 16 characters&quot;;\n\n\/\/ Function to scroll text\n\/\/ The function acepts the following arguments:\n\/\/ row: row number where the text will be displayed\n\/\/ message: message to scroll\n\/\/ delayTime: delay between each character shifting\n\/\/ lcdColumns: number of columns of your LCD\nvoid scrollText(int row, String message, int delayTime, int lcdColumns) {\n  for (int i=0; i &lt; lcdColumns; i++) {\n    message = &quot; &quot; + message;  \n  } \n  message = message + &quot; &quot;; \n  for (int pos = 0; pos &lt; message.length(); pos++) {\n    lcd.setCursor(0, row);\n    lcd.print(message.substring(pos, pos + lcdColumns));\n    delay(delayTime);\n  }\n}\n\nvoid setup(){\n  \/\/ initialize LCD\n  lcd.init();\n  \/\/ turn on LCD backlight                      \n  lcd.backlight();\n}\n\nvoid loop(){\n  \/\/ set cursor to first column, first row\n  lcd.setCursor(0, 0);\n  \/\/ print static message\n  lcd.print(messageStatic);\n  \/\/ print scrolling message\n  scrollText(1, messageToScroll, 250, lcdColumns);\n}\n<\/code><\/pre>\n\t<p style=\"text-align:center\"><a class=\"rntwhite\" href=\"https:\/\/github.com\/RuiSantosdotme\/Random-Nerd-Tutorials\/raw\/master\/Projects\/LCD_I2C\/I2C_LCD_Example.ino\" target=\"_blank\">View raw code<\/a><\/p>\n<p>After reading the previous section, you should be familiar on how this sketch works, so we&#8217;ll just take a look at the newly created function: <span class=\"rnthl rntliteral\">scrollText()<\/span><\/p>\n<pre class=\"language-python\"><code class=\"language-c\">void scrollText(int row, String message, int delayTime, int lcdColumns) {\n  for (int i=0; i &lt; lcdColumns; i++) {\n    message = \" \" + message; \n  } \n  message = message + \" \"; \n  for (int pos = 0; pos &lt; message.length(); pos++) {\n    lcd.setCursor(0, row);\n    lcd.print(message.substring(pos, pos + lcdColumns));\n    delay(delayTime);\n  }\n}<\/code><\/pre>\n<p>To use this function you should pass four arguments:<\/p>\n<ul>\n<li><span class=\"rnthl rntliteral\">row<\/span>: row number where the text will be display<\/li>\n<li><span class=\"rnthl rntliteral\">message<\/span>: message to scroll<\/li>\n<li><span class=\"rnthl rntliteral\">delayTime<\/span>: delay between each character shifting. Higher delay times will result in slower text shifting, and lower delay times will result in faster text shifting.<\/li>\n<li><span class=\"rnthl rntliteral\">lcdColumns<\/span>: number of columns of your LCD<\/li>\n<\/ul>\n<p>In our code, here&#8217;s how we use the <span class=\"rnthl rntliteral\">scrollText()<\/span> function:<\/p>\n<pre class=\"language-python\"><code>scrollText(1, messageToScroll, 250, lcdColumns);<\/code><\/pre>\n<p>The <span class=\"rnthl rntliteral\">messageToScroll<\/span> variable is displayed in the second row (1 corresponds to the second row), with a delay time of 250 ms (the GIF image is speed up 1.5x).<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-67545\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/scrolling-text.gif?resize=480%2C270&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"480\" height=\"270\" \/><\/p>\n<h2>Display Custom Characters<\/h2>\n<p>In a 16&#215;2 LCD there are 32 blocks where you can display characters. Each block is made out of 5&#215;8 tiny pixels. You can display custom characters by defining the state of each tiny pixel. For that, you can create a byte variable to hold\u00a0 the state of each pixel.<\/p>\n<p>To create your custom character, you can go <a href=\"https:\/\/maxpromer.github.io\/LCD-Character-Creator\/\">here<\/a>\u00a0to generate the byte variable for your character. For example, a heart:<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-80974\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/heart_custom_character_LCD.png?resize=538%2C434&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"538\" height=\"434\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/heart_custom_character_LCD.png?w=538&amp;quality=100&amp;strip=all&amp;ssl=1 538w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/heart_custom_character_LCD.png?resize=300%2C242&amp;quality=100&amp;strip=all&amp;ssl=1 300w\" sizes=\"(max-width: 538px) 100vw, 538px\" \/><\/p>\n<p>Copy the byte variable to your code (before the <span class=\"rnthl rntliteral\">setup()<\/span>). You can call it <span class=\"rnthl rntliteral\">heart<\/span>:<\/p>\n<pre class=\"language-python\"><code class=\"language-c\">byte heart[8] = {\n  0b00000,\n  0b01010,\n  0b11111,\n  0b11111,\n  0b11111,\n  0b01110,\n  0b00100,\n  0b00000\n};<\/code><\/pre>\n<p>Then, in the <span class=\"rnthl rntliteral\">setup()<\/span>, create a custom character using the <span class=\"rnthl rntliteral\">createChar()<\/span> function. This function accepts as arguments a location to allocate the char and the char variable as follows:<\/p>\n<pre class=\"language-python\"><code>lcd.createChar(0, heart);<\/code><\/pre>\n<p>Then, in the <span class=\"rnthl rntliteral\">loop()<\/span>, set the cursor to where you want the character to be displayed:<\/p>\n<pre class=\"language-python\"><code>lcd.setCursor(0, 0);<\/code><\/pre>\n<p>Use the <span class=\"rnthl rntliteral\">write()<\/span> method to display the character. Pass the location where the character is allocated, as follows:<\/p>\n<pre class=\"language-python\"><code>lcd.write(0);<\/code><\/pre>\n<h2>Wrapping Up<\/h2>\n<p>In summary, in this tutorial we&#8217;ve shown you how to use an I2C LCD display with the ESP32\/ESP8266 with Arduino IDE: how to display static text, scrolling text and custom characters. This tutorial also works with the Arduino board, you just need to change the pin assignment to use the Arduino I2C pins.<\/p>\n<p>We have other tutorials with ESP32 that you may find useful:<\/p>\n<ul>\n<li><a href=\"https:\/\/randomnerdtutorials.com\/esp32-with-multiple-ds18b20-temperature-sensors\/\">ESP32 with Multiple DS18B20 Temperature Sensors<\/a><\/li>\n<li><a href=\"https:\/\/randomnerdtutorials.com\/esp32-data-logging-temperature-to-microsd-card\/\">ESP32 Data Logging Temperature to MicroSD Card<\/a><\/li>\n<li><a href=\"https:\/\/randomnerdtutorials.com\/esp32-dc-motor-l298n-motor-driver-control-speed-direction\/\">ESP32 with DC Motor and L298N Motor Driver \u2013 Control Speed and Direction<\/a><\/li>\n<li><a href=\"https:\/\/randomnerdtutorials.com\/category\/esp32\/\">More ESP32 tutorials<\/a><\/li>\n<\/ul>\n<p>We hope you\u2019ve found this tutorial useful.\u00a0If you like ESP32 and you want to learn more, we recommend enrolling in\u00a0<a href=\"https:\/\/randomnerdtutorials.com\/learn-esp32-with-arduino-ide\/\"><strong>Learn ESP32 with Arduino IDE<\/strong>\u00a0course<\/a>.<\/p>\n<p>Thanks for reading.<\/p>\n<p><em><span style=\"color: #808080;\">February 1, 2019<\/span><\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>This tutorial shows how to use the I2C LCD (Liquid Crystal Display) with the ESP32 using Arduino IDE. We&#8217;ll show you how to wire the display, install the library and &#8230; <\/p>\n<p class=\"read-more-container\"><a title=\"How to Use I2C LCD with ESP32 on Arduino IDE (ESP8266 compatible)\" class=\"read-more button\" href=\"https:\/\/randomnerdtutorials.com\/esp32-esp8266-i2c-lcd-arduino-ide\/#more-67483\" aria-label=\"Read more about How to Use I2C LCD with ESP32 on Arduino IDE (ESP8266 compatible)\">CONTINUE READING \u00bb<\/a><\/p>\n","protected":false},"author":5,"featured_media":67547,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[276,281,277,299,265,214,246,240,264],"tags":[],"class_list":["post-67483","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-esp32","category-esp32-project","category-esp32-arduino-ide","category-0-esp32","category-esp8266-project","category-esp8266","category-esp8266-arduino-ide","category-esp8266-projects","category-project"],"aioseo_notices":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2018\/07\/LCD-display-featured-image.jpg?fit=1280%2C720&quality=100&strip=all&ssl=1","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/posts\/67483","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/comments?post=67483"}],"version-history":[{"count":2,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/posts\/67483\/revisions"}],"predecessor-version":[{"id":161803,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/posts\/67483\/revisions\/161803"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/media\/67547"}],"wp:attachment":[{"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/media?parent=67483"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/categories?post=67483"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/tags?post=67483"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}