ESP8266 - Keypad
This tutorial instructs you how to use ESP8266 with keypad 3x4 and 4x4. In detail, we will learn:
- How to connect ESP8266 to keypad 3x4 and keypad 4x4.
- How to program ESP8266 to read value from keypad 3x4 and keypad 4x4.
- How ESP8266 checks the password inputted from keypad 3x4 and keypad 4x4.
Hardware Preparation
| 1 | × | ESP8266 NodeMCU | |
| 1 | × | Micro USB Cable | |
| 1 | × | Keypad 3x4 and 4x4 Kit | |
| 1 | × | (Optional) 5V Power Adapter for ESP8266 | |
| 1 | × | (Optional) Screw Terminal Expansion Board for ESP8266 |
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.
Additionally, some of these links are for products from our own brand, DIYables.
Overview of Keypad
A keypad is a collection of keys that are organized in rows and columns, referred to as a matrix. Each button is known as a key. Keypads come in a variety of styles. Two of the most common for DIY projects are the 3x4 keypad (with 12 keys) and the 4x4 keypad (with 16 keys).
The Keypad Pinout
The pins are categorized into two groups: rows and columns.
- A 3x4 keypad has 7 pins: Four pins for the rows (labeled R1, R2, R3 and R4), and four pins for the columns (labeled C1, C2 and C3).
- A 4x4 keypad has 8 pins: Four pins for the rows (labeled R1, R2, R3 and R4), and four pins for the columns (labeled C1, C2, C3 and C4).
Wiring Diagram
- ESP8266 - Keypad 3x4 wiring diagram
This image is created using Fritzing. Click to enlarge image
See more in ESP8266's pinout and how to supply power to the ESP8266 and other components.
- ESP8266 - Keypad 4x4 wiring diagram
This image is created using Fritzing. Click to enlarge image
※ NOTE THAT:
You can change the ESP8266 pins connected to the keypad pins. However, you should avoid using pin D8 for the keypad. If, however, the ESP8266 pins are not enough, you can use pin D8 for the keypad but MUST follow the instructions below:
- Do NOT use the ESP8266 pin D8 for row pins.
- When using the ESP8266 pin D8 for a column pin, you MUST modify the Keypad library as follows:
- Find the Arduino\libraries\Keypad\src\Keypad.cpp file, go to line 98, where it looks like this: pin_mode(columnPins[c], INPUT);
- Comment out this line. After modification, the code at line 98 should look like this: //pin_mode(columnPins[c], INPUT);
ESP8266 Code
ESP8266 Code for Keypad 3x4
#include <Keypad.h>
const int ROW_NUM = 4; // four rows
const int COLUMN_NUM = 3; // three columns
char key_layout[ROW_NUM][COLUMN_NUM] = {
{'1','2','3'},
{'4','5','6'},
{'7','8','9'},
{'*','0','#'}
};
byte pin_rows[ROW_NUM] = {D1, D2, D3, D4}; // The ESP8266 pins connect to the row pins
byte pin_column[COLUMN_NUM] = {D5, D6, D7}; // The ESP8266 pins connect to the column pins
Keypad keypad = Keypad( makeKeymap(key_layout), pin_rows, pin_column, ROW_NUM, COLUMN_NUM );
void setup(){
Serial.begin(9600);
}
void loop(){
char key = keypad.getKey();
if (key){
Serial.println(key);
}
}
ESP8266 Code for Keypad 4x4
#include <Keypad.h>
const int ROW_NUM = 4; //four rows
const int COLUMN_NUM = 4; //four columns
char key_layout[ROW_NUM][COLUMN_NUM] = {
{'1','2','3', 'A'},
{'4','5','6', 'B'},
{'7','8','9', 'C'},
{'*','0','#', 'D'}
};
byte pin_rows[ROW_NUM] = {D0, D1, D2, D3}; // The ESP8266 pins connect to the row pins
byte pin_column[COLUMN_NUM] = {D4, D5, D6, D7}; // The ESP8266 pins connect to the column pins
Keypad keypad = Keypad( makeKeymap(key_layout), pin_rows, pin_column, ROW_NUM, COLUMN_NUM );
void setup(){
Serial.begin(9600);
}
void loop(){
char key = keypad.getKey();
if (key){
Serial.println(key);
}
}
Detailed Instructions
To get started with ESP8266 on Arduino IDE, follow these steps:
- Check out the how to setup environment for ESP8266 on Arduino IDE tutorial if this is your first time using ESP8266.
- Wire the components as shown in the diagram.
- Connect the ESP8266 board to your computer using a USB cable.
- Open Arduino IDE on your computer.
- Choose the correct ESP8266 board, such as (e.g. NodeMCU 1.0 (ESP-12E Module)), and its respective COM port.
- Click to the Libraries icon on the left bar of the Arduino IDE.
- Search for “keypad” and locate the keypad library created by Mark Stanley and Alexander Brevig.
- Then, click the Install button to complete the installation of the keypad library.
- Copy the code above and open it in the Arduino IDE.
- Once opened, click the Upload button to upload the code to the ESP8266.
- Open the Serial Monitor.
- Press some keys on the keypad.
- Check the Serial Monitor to see the result.
COM6
3
6
9
4
*
#
Autoscroll
Clear output
9600 baud
Newline
Keypad and Password
A common use of a keypad is for entering passwords. We typically designate two specific keys for this purpose:
- A key to initiate or restart the password entry. For instance, the "*" key.
- A key to end the password entry. For instance, the "#" key.
The password will comprise of a string which includes all the other keys, apart from two specific special keys.
When a key is pressed:
- If the key is not "*" or "#", add the key to the user's input password string.
- If the key is "#", compare the user's input string with the predefined passwords to decide if the input password is correct, and then erase the user's input password string.
- If the key is "*", erase the user's input password string.
Keypad - Password Code
/*
* This ESP8266 NodeMCU code was developed by newbiely.com
*
* This ESP8266 NodeMCU code is made available for public use without any restriction
*
* For comprehensive instructions and wiring diagrams, please visit:
* https://newbiely.com/tutorials/esp8266/esp8266-keypad
*/
#include <Keypad.h>
#define ROW_NUM 4 // 4 rows
#define COLUMN_NUM 3 // 3 columns
char key_layout[ROW_NUM][COLUMN_NUM] = {
{'1','2','3'},
{'4','5','6'},
{'7','8','9'},
{'*','0','#'}
};
byte pin_rows[ROW_NUM] = {D1, D2, D3, D4}; // The ESP8266 pins connect to the row pins
byte pin_column[COLUMN_NUM] = {D5, D6, D7}; // The ESP8266 pins connect to the column pins
Keypad keypad = Keypad( makeKeymap(key_layout), pin_rows, pin_column, ROW_NUM, COLUMN_NUM );
const String password = "1234"; // change your password here
String input_password;
void setup(){
Serial.begin(9600);
input_password.reserve(32); // maximum input characters is 33, change if needed
}
void loop(){
char key = keypad.getKey();
if (key){
Serial.println(key);
if(key == '*') {
input_password = ""; // clear input password
} else if(key == '#') {
if(password == input_password) {
Serial.println("password is correct");
// DO YOUR WORK HERE
} else {
Serial.println("password is incorrect, try again");
}
input_password = ""; // clear input password
} else {
input_password += key; // append new character to input password string
}
}
}
Detailed Instructions
- Run the code above.
- Open the Serial Monitor.
- Press the keys "123456" and then press "#".
- Afterwards, press the keys "1234" and then press "#".
- Check out the result on the Serial Monitor.
COM6
password is incorrect, try again
password is correct
Autoscroll
Clear output
9600 baud
Newline