- Màn hình OLED
- Thành phần bắt buộc
- Kết nối chân SPI giữa NodeMCU và Màn hình OLED
- Lập trình NodeMCU cho giao diện OLED
- Chuyển đổi hình ảnh thành Giá trị Bitmap
Trong hướng dẫn này, chúng tôi sẽ giao diện Màn hình OLED với NodeMCU ESP8266. NodeMCU là một nền tảng IoT mã nguồn mở bao gồm phần sụn chạy trên SoC Wi-Fi ESP8266 hỗ trợ Wi-Fi chi phí thấp của Espressif Systems. Nó có các chân GPIO để kết nối các thiết bị ngoại vi khác và nó hỗ trợ giao tiếp nối tiếp sử dụng các chân SPI, I2C và UART. Nó cũng có các chân cho ADC và PWM. Trước đây chúng tôi đã giao tiếp OLED với bộ vi điều khiển khác bao gồm bộ điều khiển của họ ESP (ESP32):
- Giao diện màn hình OLED SSD 1306 với Raspberry Pi
- Giao diện màn hình OLED SSD1306 với Arduino
- Xây dựng đồng hồ thông minh bằng cách kết nối màn hình OLED với điện thoại Android bằng Arduino
- Đồng hồ Internet sử dụng ESP32 và Màn hình OLED
Trong hướng dẫn này, chúng tôi sẽ sử dụng giao thức SPI để giao diện Màn hình OLED đơn sắc 7 chân SSD1306 0,96 với NodeMCU và sẽ học cách hiển thị hình ảnh trên màn hình OLED với NodeMCU ESP8266.
Màn hình OLED
Diode phát sáng hữu cơ (OLED) là một loại Diode phát sáng trong đó một lớp phát sáng được làm bằng hợp chất hữu cơ phát ra ánh sáng khi dòng điện được cung cấp. Lớp này được đặt giữa hai điện cực. Công nghệ này được sử dụng trong các màn hình hiển thị như máy tính, tivi, điện thoại thông minh… Màn hình OLED có ánh sáng riêng và không cần đèn nền như màn hình LCD, do đó chúng tiết kiệm điện và được sử dụng với nhiều vi điều khiển. Một lợi thế nữa của việc sử dụng màn hình OLED so với LCD là hiển thị chất lượng đồ họa lớn hơn và tốt hơn trên OLED. Tìm hiểu thêm về công nghệ Màn hình OLED tại đây.
Có nhiều loại Màn hình OLED khác nhau có sẵn trên thị trường. Các màn hình này được đặc trưng dựa trên màu sắc, số lượng chân cắm, IC điều khiển và kích thước của màn hình. Về cơ sở màu sắc, OLED có các màu xanh đơn sắc, trắng đơn sắc và vàng / xanh lam. Và trên cơ sở giao tiếp, chủ yếu có hai loại OLED - 3pin và 7pin. OLED 3 chân có thể được sử dụng ở chế độ giao tiếp I2C và OLED 7 chân có thể được sử dụng ở chế độ SPI hoặc ở chế độ I2C.
Trong hướng dẫn này, chúng tôi sẽ sử dụng “ Màn hình OLED 7 chân SSD1306 0,96 ” đơn sắc có chiều rộng 128 pixel và chiều dài 64 pixel. Màn hình này có thể hoạt động trên cả giao thức truyền thông SPI và I2C. Chúng tôi sẽ sử dụng giao thức SPI trong hướng dẫn này. IC SSD1306 có mặt trên OLED này giúp hiển thị các điểm ảnh trên màn hình.
Thành phần bắt buộc
- Màn hình OLED 7 chân SSD 1306 0,96 inch đơn sắc
- NodeMCU ESP8266
- Cáp micro USB
- Breadboard
- Dây nhảy nam sang nam
Kết nối chân SPI giữa NodeMCU và Màn hình OLED
Dưới đây là Sơ đồ mạch để kết nối Màn hình OLED 7 chân với NodeMCU để giao tiếp bằng giao thức truyền thông nối tiếp SPI.
Bảng dưới đây cho thấy các kết nối giữa Màn hình OLED và NodeMCU ESP8266. Chân GND đi đến NodeMCU GND, chân VDD có thể được kết nối với 3.3V hoặc 5V, SCK là chân đồng hồ trên Màn hình OLED được kết nối với D5 của NodeMCU cho đồng hồ SPI. Chân SDA là chân MOSI trên OLED của giao diện SPI đi đến D7 của NodeMCU. Chân RESET chuyển đến D3. DC, chân lệnh dữ liệu được kết nối với D2 của NodeMCU. Chân cuối cùng là CS đi đến D8, chọn chip của NodeMCU.
|
Không. |
Màn hình Oled |
NodeMCU |
|
1 |
GND |
GND |
|
2 |
VDD |
3,3V |
|
3 |
SCK |
D5 |
|
4 |
MOSI (SPI) hoặc SDA (I2C) |
D7 |
|
5 |
CÀI LẠI |
D3 |
|
6 |
DC |
D2 |
|
7 |
CS |
D8 |
Ở đây chúng tôi sẽ sử dụng thư viện “ Adafruit _SSD1306.h” và “ Adafruit_GFX.h ” để giao tiếp OLED với NodeMCU. Mở Arduino IDE và cài đặt phiên bản mới nhất từ Arduino IDE ( Phác thảo> Bao gồm Thư viện> Quản lý Thư viện hoặc Ctrl + Shift_I ).
Vì kích thước pixel của id màn hình OLED của chúng tôi là 128x64, do đó chúng tôi phải thực hiện thay đổi trong tệp tiêu đề của Adafruit_SSD1306. Mở thư viện Arduino, truy cập Adafruit_SSD1306 và mở tệp tiêu đề của nó ( Adafruit _SSD1306.h ). Nhận xét dòng “ #define SSD1306_128_32 ” và bỏ ghi chú dòng “#define SSD1306_128_64 ” như trong hình dưới đây và sau đó lưu tệp. Theo mặc định, thư viện này đi kèm với “# define SSD1306_128_32 ”.
Cuối cùng thay đổi số pin trong ví dụ “ ssd1306_128x64_spi ” Adafruit SSD1306 theo bảng hiển thị bên dưới. Bây giờ khi bạn chạy bản phác thảo sau khi kết nối đúng màn hình OLED với NodeMCU, bạn sẽ thấy logo của Adafruit trên màn hình OLED được lưu mặc định trong thư viện. Sau logo Adafruit, nó hiển thị nhiều đồ họa khác như đường thẳng, hình chữ nhật, tam giác, hình tròn, chuỗi, số, hình ảnh động và bitmap. Ở đây Trong hướng dẫn này, chúng ta sẽ học cách hiển thị bất kỳ hình ảnh nào trên OLED với NodeMCU ESP8266.
Lập trình NodeMCU cho giao diện OLED
Vì mã hoàn chỉnh luôn được cung cấp ở cuối, ở đây chúng tôi đã giải thích chi tiết về mã.
Bắt đầu mã bằng cách nhập các thư viện cần thiết. Vì chúng tôi đang sử dụng giao thức SPI nên chúng tôi sẽ nhập thư viện “SPI.h” và cũng nhập “Adafruit_GFX.h” và “Adafruit_SSD1306.h” cho Màn hình OLED.
#include
Kích thước OLED của chúng tôi là 128x64, vì vậy chúng tôi đang đặt chiều rộng và chiều cao của màn hình lần lượt là 128 và 64. Vì vậy, xác định các biến cho các chân OLED được kết nối với NodeMCU để giao tiếp SPI.
#define SCREEN_WIDTH 128 // Chiều rộng màn hình OLED, tính bằng pixel #define SCREEN_HEIGHT 64 // Chiều cao màn hình OLED, tính bằng pixel // Khai báo cho màn hình SSD1306 được kết nối bằng phần mềm SPI (trường hợp mặc định): #define OLED_MOSI D7 #define OLED_CLK D5 #define OLED_DC D2 #define OLED_CS D8 #define OLED_RESET D3 Màn hình Adafruit_SSD1306 (SCREEN_WIDTH, SCREEN_HEIGHT, OLED_MOSI, OLED_CLK, OLED_DC, OLED_RESET, OLED_CS);
Khởi tạo màn hình OLED bằng cách sử dụng SSD1306_SWITCHCAPVCC để tạo ra 3.3V bên trong để khởi tạo màn hình.
if (! display.begin (SSD1306_SWITCHCAPVCC)) { Serial.println (F ("Phân bổ SSD1306 không thành công")); cho (;;); // Không tiếp tục, lặp mãi mãi }
Màn hình OLED sẽ bị xóa trước khi hiển thị bất cứ thứ gì bằng cách gọi hàm display.clearDisplay (). Chúng tôi thiết lập kích thước phông chữ 2 bằng cách gọi hàm setTextSize (font-size), và thiết lập màu chữ và vị trí con trỏ bằng cách sử dụng setTextColor và setCursor chức năng . Lệnh Display.display () được sử dụng để truyền dữ liệu vào bộ nhớ trong của bộ điều khiển SSD1306. Sau khi chuyển, pixel sẽ hiển thị trên màn hình. Bây giờ chúng ta có thể bắt đầu cuộn văn bản theo nhiều cách khác nhau bằng cách gọi display.startscrollright (x-pos, y-pos) và display.startscrollleft (x-pos, y-pos) trong khoảng thời gian nhất định trong hàm trì hoãn. Có thể ngừng cuộn văn bản bằng cách sử dụng hàm display.stopscroll ().
void testscrolltext (void) {display.clearDisplay (); // xóa màn hình hiển thị OLED display.setTextSize (2); // Vẽ văn bản theo tỷ lệ 2X display.setTextColor (WHITE); display.setCursor (0, 0); display.println (F ("MẠCH")); display.println (F ("DIGEST")); display.display (); // Hiển thị độ trễ văn bản ban đầu (100); // Cuộn theo nhiều hướng khác nhau, tạm dừng ở giữa: display.startscrollright (0x00, 0x0F); chậm trễ (2000); display.stopscroll (); chậm trễ (1000); display.startscrollleft (0x00, 0x0F); chậm trễ (2000); display.stopscroll (); chậm trễ (1000); display.startscrolldiagright (0x00, 0x07); chậm trễ (2000); display.startscrolldiagleft (0x00, 0x07); chậm trễ (2000); display.stopscroll (); chậm trễ (1000); }
Chúng ta gọi hàm display.drawBitmap () lấy 6 tham số (tọa độ x, tọa độ y, mảng bitmap, chiều rộng, chiều cao và màu) để vẽ hình ảnh trên OLED. Vì kích thước màn hình của chúng tôi là 128x64 nên chúng tôi đặt chiều rộng và chiều cao tương ứng là 128 và 64. Ở đây mảng bitmap chứa thông tin pixel để vẽ pixel trên màn hình để tạo hình ảnh. Mảng bitmap này có thể được tạo trực tuyến được giải thích bên dưới hoặc có nhiều phần mềm có sẵn để chuyển đổi hình ảnh thành mảng bitmap.
const unsigned char myBitmap PROGMEM = { 0xff, 0xff, 0xff, 0xe0, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0xffx00, 0xc0, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf7, 0xc0, 0x00, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc7, 0x80, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x0f, 0x01, 0xc0, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x0f, 0x03, 0xff, 0xc0, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x1e, 0x03, 0x3f, 0xf8, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x3e, 0x03, 0x3f, 0xfc, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe0, 0x3c, 0x03, 0x7f, 0xfe, 0xffx07, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x7c, 0x03, 0xf0, 0x3f, 0x83, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0x78, 0x00, 0xc0, 0x0f, 0xc1, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0xf8, 0x00, 0x00, 0x07, 0xe0, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x01, 0xf0, 0x00, 0x00, 0x03, 0xf8, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x01, 0xfc, 0x01 0x00, 0x00, 0xfc, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x03, 0xe0, 0x00, 0x0f, 0x00, 0x7e, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x07, 0xc0, 0x3f, 0xff, 0xff, 0xff3 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x7f, 0xf9, 0x80, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0x80, 0xff, 0xf9, 0x80, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0xff, 0xff, 0x80, 0x03, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x01, 0xf0, 0x1f, 0x80, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0, 0x00, 0xc0, 0, 0x00 0x06, 0x00, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x03, 0xc0, 0x00, 0x00, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x07, 0xc0, 0x00, 0xff, 0x00, 0x00, 0x00 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x07, 0x80, 0x00, 0x00, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80 0x0f, 0x80, 0x00, 0x00, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x0f, 0x00, 0x80, 0x00, 0x00, 0x01, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x1e, 0x01, 0xe0, 0x00, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x1e, 0x00, 0x1e 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x3c, 0x03, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x7c, 0x03, 0x3f, 0xff, 0, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0xf8, 0x01, 0xe0, 0x00, 0x00, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x00, 0x00, 0x00, 0x00, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x00, 0x00, 0x00, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x00 0x00, 0x00, 0x00, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x01, 0xf0, 0x00, 0x00, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80 0x03, 0xb0, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x03, 0x18, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x03, 0xbc, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0xfex01 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x00, 0xff, 0xff, 0x80, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x1f, 0xff, 0x00, 0x00, 0x03, 0x00, 0x03 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x00, 0x07, 0xfc, 0x00, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0x80, 0x03, 0xf0, 0x00, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe0, 0x01, 0xc0, 0x00, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x00, 0x00, 0x00, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x03, 0xc0 0x00, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x00, 0xff, 0xe0, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfc, 0x00, 0x3f, 0xe0, 0x00, 0x1f, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x00, 0x0e, 0x30, 0x00, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0x07, 0x70, 0x00, 0xff, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x03, 0xe0, 0x1b, 0xfc, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x01, 0xc0, 0x7f, 0xf0, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe0, 0x00 0x7f, 0xc0, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x00, 0x67, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x00, 0x00, 0x66, 0x00, 0x1f, 0xff 0x 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x00, 0x00, 0x7e, 0x00, 0x7f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0x00, 0x00, 0x3c, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0x00, 0x00, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff }; display.drawBitmap (35, 0, myBitmap, 128, 64, BLACK, WHITE); display.display ();
Chuyển đổi hình ảnh thành Giá trị Bitmap
Bitmap trực tuyến có thể được tạo từ http://javl.github.io/image2cpp/. Tải lên tệp hình ảnh bạn muốn hiển thị trên OLED và đặt kích thước là 128x64. Một hình ảnh xem trước sẽ được hiển thị và sau đó mảng bitmap sẽ được tạo.
Ảnh chụp màn hình bên dưới cho thấy quá trình tạo giá trị bitmap của bất kỳ hình ảnh nào.
Cuối cùng tải mã hoàn chỉnh vào NodeMCU ESP8266 và bạn sẽ thấy hình ảnh hiển thị trên Màn hình OLED. Ở đây chúng tôi đang hiển thị logo CircuitDigest trên màn hình OLED.
