Arduino Nano ESP32 - Keypad - LCD

This tutorial instructs you how to use Arduino Nano ESP32 with the keypad and LCD display. In detail, We will learn how to program the Arduino Nano ESP32 to display the pressed key on LCD.

Hardware Preparation

1×Arduino Nano ESP32
1×USB Cable Type-C
1×LCD I2C
1×Keypad
1×Breadboard
1×Jumper Wires
1×(Optional) DC Power Jack
1×(Recommended) Screw Terminal Expansion Board for Arduino Nano
1×(Recommended) Breakout Expansion Board for Arduino Nano

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 the links provided in this section are Amazon affiliate links. We may receive a commission for any purchases made through these links at no additional cost to you.
Additionally, some of these links are for products from our own brand, DIYables.

Overview of Keypad and LCD

We have specific tutorials about keypad and LCD. Each tutorial contains detailed information and step-by-step instructions about hardware pinout, working principle, wiring connection to Arduino Nano ESP32, Arduino Nano ESP32 code... Learn more about them at the following links:

Wiring Diagram

The wiring diagram between Arduino Nano ESP32 and Keypad LCD

This image is created using Fritzing. Click to enlarge image

Arduino Nano ESP32 Code - Keyoad 3x4 - LCD I2C

/* * This Arduino Nano ESP32 code was developed by newbiely.com * * This Arduino Nano ESP32 code is made available for public use without any restriction * * For comprehensive instructions and wiring diagrams, please visit: * https://newbiely.com/tutorials/arduino-nano-esp32/arduino-nano-esp32-keypad-lcd */ #include <Keypad.h> #include <LiquidCrystal_I2C.h> #define ROW_NUM 4 // four rows #define COLUMN_NUM 3 // four columns const byte pin_rows[ROW_NUM] = {10, 9, 8, 7}; // The Arduino Nano ESP32 pin connected to the row pins of the keypad const byte pin_column[COLUMN_NUM] = {6, 5, 4}; // The Arduino Nano ESP32 pin connected to the column pins of the keypad char key_layout[ROW_NUM][COLUMN_NUM] = { {'1', '2', '3'}, {'4', '5', '6'}, {'7', '8', '9'}, {'*', '0', '#'} }; Keypad keypad = Keypad( makeKeymap(key_layout), pin_rows, pin_column, ROW_NUM, COLUMN_NUM); LiquidCrystal_I2C lcd(0x27, 16, 2); // I2C address 0x27 (from DIYables LCD), 16 column and 2 rows int cursor = 0; void setup() { lcd.init(); // Initialize the LCD I2C display lcd.backlight(); } void loop() { char key = keypad.getKey(); if (key) { lcd.setCursor(cursor, 0); // move cursor to (cursor, 0) lcd.print(key); // print key at (cursor, 0) cursor++; // move cursor to next position if (cursor == 16) { // if reaching limit, clear LCD lcd.clear(); cursor = 0; } } }

※ NOTE THAT:

The LCD I2C address can be different from each manufacturer. In the code, we used address of 0x27 that is specified by DIYables manufacturer

Detailed Instructions

  • If this is the first time you use Arduino Nano ESP32, see how to setup environment for Arduino Nano ESP32 on Arduino IDE.
  • Do the wiring as above image.
  • Connect the Arduino Nano ESP32 board to your PC via a USB cable
  • Open Arduino IDE on your PC.
  • Select the right Arduino Nano ESP32 board (e.g. Arduino Nano ESP32 and COM port.
  • Click to the Libraries icon on the left bar of the Arduino IDE.
  • Type “keypad” on the search box, then look for the keypad library by Mark Stanley, Alexander Brevig
  • Click Install button to install keypad library.
Arduino Nano ESP32 keypad library
  • Type “LiquidCrystal I2C” on the search box, then look for the LiquidCrystal_I2C library by Frank de Brabander
  • Click Install button to install LiquidCrystal_I2C library.
Arduino Nano ESP32 LiquidCrystal I2C library
  • Copy the above code and paste it to Arduino IDE.
  • Compile and upload code to Arduino Nano ESP32 board by clicking Upload button on Arduino IDE
Arduino IDE Upload Code
  • Press some keys on keypad
  • See the result in LCD

If the LCD does not display anything, see Troubleshooting on LCD I2C

Line-by-line Code Explanation

The above Arduino Nano ESP32 code contains line-by-line explanation. Please read the comments in the code!

Video Tutorial

※ OUR MESSAGES

  • As freelancers, We are AVAILABLE for HIRE. See how to outsource your project to us
  • Please feel free to share the link of this tutorial. However, Please do not use our content on any other websites. We invested a lot of effort and time to create the content, please respect our work!