ESP32 Đếm Số Lần Nhấn Nút OLED
Trong hướng dẫn này, chúng ta sẽ khám phá ESP32 để đạt được những mục tiêu sau:
- Đếm số lần một nút được nhấn.
- Hiển thị số đếm trên màn hình OLED.
- Thực hiện tự động căn giữa theo chiều dọc và chiều ngang cho số đếm trên màn hình OLED.
Ngoài ra, hướng dẫn này sẽ giải quyết vấn đề debouncing của nút nhấn mà không sử dụng hàm delay(). Để hiểu tại sao debouncing là cần thiết, hãy tham khảo giải thích được cung cấp trong Tại sao chúng ta cần debouncing?.
Hướng dẫn toàn diện này sẽ giúp bạn tích hợp liền mạch chức năng đếm lần nhấn nút, hiển thị OLED, và kỹ thuật debouncing với dự án ESP32 của bạn.
Linh Kiện Cần Thiết
| 1 | × | mô-đun phát triển ESP-WROOM-32 | ||
| 1 | × | Alternatively, ESP32 Uno-form board | ||
| 1 | × | Alternatively, ESP32 S3 Uno-form board | ||
| 1 | × | USB Cable Type-A to Type-C (for USB-A PC) | ||
| 1 | × | USB Cable Type-C to Type-C (for USB-C PC) | ||
| 1 | × | breadboard-mount Button with Cap | ||
| 1 | × | breadboard-mount Button Kit | ||
| 1 | × | Panel-mount Push Button | ||
| 1 | × | mô-đun nút nhấn | ||
| 1 | × | SSD1306 I2C OLED Display 128x64 | ||
| 1 | × | SSD1306 I2C OLED Display 128x32 | ||
| 1 | × | breadboard | ||
| 1 | × | dây jumper | ||
| 1 | × | (Khuyến nghị) Screw Terminal Expansion Board for ESP32 | ||
| 1 | × | (Khuyến nghị) Breakout Expansion Board for ESP32 | ||
| 1 | × | (Khuyến nghị) Power Splitter for ESP32 |
Or you can buy the following kits:
| 1 | × | DIYables ESP32 Starter Kit (ESP32 included) | ||
| 1 | × | DIYables Sensor Kit (30 sensors/displays) | ||
| 1 | × | DIYables Sensor Kit (18 sensors/displays) |
Sơ Đồ Đấu Nối
This image is created using Fritzing. Click to enlarge image
Nếu bạn chưa rõ cách cấp nguồn cho ESP32 và các linh kiện khác, xem: Cách Cung Cấp Nguồn Điện Cho ESP32.
Code ESP32 - hiển thị số đếm button trên OLED
/*
* Mã ESP32 này được phát triển bởi newbiely.vn
* Mã ESP32 này được cung cấp để sử dụng công khai, không có ràng buộc.
* Để xem hướng dẫn chi tiết và sơ đồ kết nối, vui lòng truy cập:
* https://newbiely.vn/tutorials/esp32/esp32-button-count-oled
*/
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#include <ezButton.h>
#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels
Adafruit_SSD1306 oled(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, -1); // create SSD1306 display object connected to I2C
ezButton button(27); // create ezButton object that attach to the ESP32 pin GPIO27
unsigned long lastCount = 0;
void setup() {
Serial.begin(9600);
// initialize OLED display with address 0x3C for 128x64
if (!oled.begin(SSD1306_SWITCHCAPVCC, 0x3C)) {
Serial.println(F("SSD1306 allocation failed"));
while (true);
}
delay(2000); // wait for initializing
oled.clearDisplay(); // clear display
oled.setTextSize(2); // text size
oled.setTextColor(WHITE); // text color
oled.setCursor(0, 10); // position to display
button.setDebounceTime(50); // set debounce time to 50 milliseconds
button.setCountMode(COUNT_FALLING);
}
void loop() {
button.loop(); // MUST call the loop() function first
unsigned long count = button.getCount();
if (lastCount != count) {
Serial.println(count); // print count to Serial Monitor
oled.clearDisplay(); // clear display
oled.println(count); // display count
oled.display(); // show on OLED
lastCount != count;
}
}
Các Bước Nhanh
- Nếu đây là lần đầu tiên bạn sử dụng ESP32, hãy xem ESP32 - Cài Đặt Phần Mềm.
- Thực hiện đấu nối như hình ảnh trên.
- Kết nối bo mạch ESP32 với PC của bạn qua cáp micro USB
- Mở Arduino IDE trên PC của bạn.
- Chọn bo mạch ESP32 phù hợp (ví dụ: ESP32 Dev Module) và cổng COM.
- Nhấp vào biểu tượng Libraries trên thanh bên trái của Arduino IDE.
- Tìm kiếm "ezButton", sau đó tìm thư viện button của ArduinoGetStarted
- Nhấp nút Install để cài đặt thư viện ezButton.
- Tìm kiếm "SSD1306", sau đó tìm thư viện SSD1306 của Adafruit
- Nhấp nút Install để cài đặt thư viện.
- Bạn sẽ được hỏi về việc cài đặt một số thư viện phụ thuộc khác
- Nhấp nút Install All để cài đặt tất cả các thư viện phụ thuộc.
- Copy code trên và mở bằng Arduino IDE
- Nhấp nút Upload trên Arduino IDE để upload code lên ESP32
- Nhấn nút nhiều lần
- Xem số đếm thay đổi trên OLED
Code trên chỉ hiển thị số đếm lần nhấn nút ở góc trên bên trái. Hãy sửa đổi code để căn giữa nó!
Code ESP32 - Căn Giữa Theo Chiều Dọc và Ngang trên OLED
/*
* Mã ESP32 này được phát triển bởi newbiely.vn
* Mã ESP32 này được cung cấp để sử dụng công khai, không có ràng buộc.
* Để xem hướng dẫn chi tiết và sơ đồ kết nối, vui lòng truy cập:
* https://newbiely.vn/tutorials/esp32/esp32-button-count-oled
*/
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#include <ezButton.h>
#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels
Adafruit_SSD1306 oled(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, -1); // create SSD1306 display object connected to I2C
ezButton button(27); // create ezButton object that attach to the ESP32 pin GPIO27
unsigned long lastCount = 0;
void setup() {
Serial.begin(9600);
// initialize OLED display with address 0x3C for 128x64
if (!oled.begin(SSD1306_SWITCHCAPVCC, 0x3C)) {
Serial.println(F("SSD1306 allocation failed"));
while (true);
}
delay(2000); // wait for initializing
oled.clearDisplay(); // clear display
oled.setTextSize(2); // text size
oled.setTextColor(WHITE); // text color
oled.setCursor(0, 10); // position to display
button.setDebounceTime(50); // set debounce time to 50 milliseconds
button.setCountMode(COUNT_FALLING);
}
void loop() {
button.loop(); // MUST call the loop() function first
unsigned long count = button.getCount();
if (lastCount != count) {
Serial.println(count); // print count to Serial Monitor
String text = String(count);
oledDisplayCenter(text);
lastCount != count;
}
}
void oledDisplayCenter(String text) {
int16_t x1;
int16_t y1;
uint16_t width;
uint16_t height;
oled.getTextBounds(text, 0, 0, &x1, &y1, &width, &height);
// display on horizontal and vertical center
oled.clearDisplay(); // clear display
oled.setCursor((SCREEN_WIDTH - width) / 2, (SCREEN_HEIGHT - height) / 2);
oled.println(text); // text to display
oled.display();
}
※ Lưu ý:
Code trên tự động căn giữa theo chiều ngang và chiều dọc cho văn bản trên màn hình OLED. Xem Cách căn giữa theo chiều dọc/ngang trên OLED để biết thêm chi tiết.
Video Tutorial
Việc sản xuất video tốn rất nhiều thời gian. Nếu video hướng dẫn hữu ích cho việc học của bạn, hãy đăng ký kênh YouTube để ủng hộ. Nếu nhu cầu đủ cao, chúng tôi sẽ cố gắng làm thêm nhiều video.