이 튜토리얼에서는 OLED 디스플레이를 NodeMCU ESP8266과 인터페이스 할 것 입니다. NodeMCU는 Espressif Systems의 저가 Wi-Fi 지원 ESP8266 Wi-Fi SoC에서 실행되는 펌웨어를 포함하는 오픈 소스 IoT 플랫폼입니다. 다른 주변 장치를 연결하기위한 GPIO 핀이 있으며 SPI, I2C 및 UART 핀을 사용한 직렬 통신을 지원합니다. 또한 ADC 및 PWM 용 핀도 있습니다. 이전에 OLED는 ESP 제품군 컨트롤러 (ESP32)를 포함한 다른 마이크로 컨트롤러와 인터페이스했습니다.
- 라즈베리 파이와 SSD1306 OLED 디스플레이 인터페이스
- Arduino와 SSD1306 OLED 디스플레이 인터페이스
- Arduino를 사용하여 Android Phone과 OLED 디스플레이를 인터페이싱하여 Smart Watch 구축
- ESP32 및 OLED 디스플레이를 사용하는 인터넷 시계
이 튜토리얼에서는 SPI 프로토콜을 사용 하여 NodeMCU 와 흑백 7 핀 SSD1306 0.96 OLED 디스플레이를 인터페이스 하고 NodeMCU ESP8266을 사용하여 OLED 화면에 이미지를 표시하는 방법을 배웁니다.
OLED 디스플레이
유기 발광 다이오드 (OLED)는 유기 화합물로 이루어진 발광층이 전류를 공급하면 빛을내는 발광 다이오드 (Light Emitting Diode)의 일종입니다. 이 층은 두 전극 사이에 위치합니다. 이 기술은 컴퓨터, 텔레비전, 스마트 폰 등과 같은 디스플레이 화면에 사용됩니다. OLED 디스플레이는 자체 조명이 있고 LCD와 같은 백라이트가 필요하지 않으므로 전력 효율적이고 많은 마이크로 컨트롤러와 함께 사용됩니다. LCD보다 OLED 디스플레이를 사용할 때의 또 다른 이점은 OLED에 크고 우수한 그래픽 품질을 표시한다는 것입니다. 여기에서 OLED 디스플레이 기술에 대해 자세히 알아보십시오.
시장에는 다양한 종류의 OLED 디스플레이가 있습니다. 이러한 디스플레이는 색상, 핀 수, 컨트롤러 IC 및 화면 크기를 기준으로 특성화됩니다. 색상 기준으로 OLED는 단색 파랑, 단색 흰색 및 노랑 / 파랑 색상으로 제공됩니다. 그리고 통신을 기반으로 주로 3 핀과 7 핀의 두 가지 유형의 OLED를 사용할 수 있습니다. 3 핀 OLED는 I2C 통신 모드에서 사용할 수 있으며 7 핀 OLED는 SPI 모드 또는 I2C 모드에서 사용할 수 있습니다.
이 튜토리얼에서는 너비가 128 픽셀이고 길이가 64 픽셀 인 “ 흑백 7 핀 SSD1306 0.96 ”OLED 디스플레이를 사용합니다. 이 디스플레이는 SPI 및 I2C 통신 프로토콜 모두에서 작동 할 수 있습니다. 이 튜토리얼에서는 SPI 프로토콜을 사용합니다. 이 OLED에는 SSD1306 IC 가있어 화면에 픽셀을 표시하는 데 도움이됩니다.
필요한 구성 요소
- 흑백 7 핀 SSD1306 0.96 인치 OLED 디스플레이
- NodeMCU ESP8266
- 마이크로 USB 케이블
- 브레드 보드
- 수-수 점퍼 와이어
NodeMCU와 OLED 디스플레이 간의 SPI 핀 연결
아래는 7 핀 OLED 디스플레이를 NodeMCU 와 연결하여 SPI 시리얼 통신 프로토콜을 사용하여 통신하는 회로도 입니다.
아래 표는 OLED 디스플레이와 NodeMCU ESP8266 간의 연결을 보여줍니다. GND 핀은 NodeMCU GND로, VDD 핀은 3.3V 또는 5V에 연결할 수 있으며, SCK는 SPI 클럭을 위해 NodeMCU의 D5에 연결된 OLED 디스플레이의 클럭 핀입니다. SPI 인터페이스의 OLED상의 MOSI 핀인 SDA 핀은 NodeMCU의 D7로갑니다. RESET 핀은 D3로갑니다. DC, 데이터 명령 핀은 NodeMCU의 D2에 연결됩니다. 마지막 핀은 CS가 D8, NodeMCU의 칩 선택입니다.
아니. |
Oled 디스플레이 |
NodeMCU |
1 |
GND |
GND |
2 |
VDD |
3.3V |
삼 |
SCK |
D5 |
4 |
MOSI (SPI) 또는 SDA (I2C) |
D7 |
5 |
초기화 |
D3 |
6 |
DC |
D2 |
7 |
CS |
D8 |
여기에서는 OLED와 NodeMCU 를 인터페이스 하기 위해“ Adafruit _SSD1306.h” 및“ Adafruit_GFX.h ”라이브러리를 사용합니다. Arduino IDE를 열고 Arduino IDE에서 최신 버전을 설치합니다 ( Sketch> Include Library> Manage Libraries 또는 Ctrl + Shift_I ).
때문에 우리의 OLED 디스플레이 ID 128X64의 픽셀 크기 때문에 우리는 Adafruit_SSD1306의 헤더 파일의 변경을해야한다. Arduino 라이브러리를 열고 Adafruit_SSD1306으로 이동하여 헤더 파일 ( Adafruit _SSD1306.h )을 엽니 다. 라인 "주석 #DEFINE의 SSD1306_128_32 "및 주석 라인 "#DEFINE SSD1306_128_64 이미지 아래 다음 파일 저장과 같이". 기본적으로이 라이브러리는 "# define SSD1306_128_32 " 와 함께 제공됩니다.
마지막으로 abve에 표시된 표에 따라 “ ssd1306_128x64_spi ”Adafruit SSD1306 예제 의 핀 번호를 변경합니다. 이제 NodeMCU와 OLED 디스플레이를 올바르게 연결 한 후 스케치를 실행하면 기본적으로 라이브러리에 저장된 OLED 디스플레이에 Adafruit의 로고가 표시됩니다. Adafruit 로고 뒤에는 선, 직사각형, 삼각형, 원, 문자열, 숫자, 애니메이션 및 비트 맵과 같은 다른 많은 그래픽이 표시됩니다. 이 튜토리얼에서는 NodeMCU ESP8266을 사용하여 OLED에 이미지를 표시하는 방법을 배웁니다.
OLED 인터페이스를위한 NodeMCU 프로그래밍
항상 완전한 코드가 마지막에 제공되므로 여기에서 코드를 자세히 설명했습니다.
필요한 라이브러리를 가져 와서 코드 를 시작합니다. SPI 프로토콜을 사용하고 있으므로 "SPI.h"라이브러리를 가져오고 OLED 디스플레이 용으로 "Adafruit_GFX.h"및 "Adafruit_SSD1306.h"도 가져옵니다.
#포함
우리의 OLED 크기는 128x64이므로 화면 너비와 높이를 각각 128과 64로 설정합니다. 따라서 SPI 통신을 위해 NodeMCU에 연결된 OLED 핀에 대한 변수를 정의하십시오.
#define SCREEN_WIDTH 128 // OLED 디스플레이 너비, 픽셀 단위 #define SCREEN_HEIGHT 64 // OLED 디스플레이 높이, 픽셀 단위 // 소프트웨어 SPI를 사용하여 연결된 SSD1306 디스플레이 선언 (기본 케이스): #define OLED_MOSI D7 #define OLED_CLK D5 #define OLED_DC D2 #define OLED_CS D8 #define OLED_RESET D3 Adafruit_SSD1306 디스플레이 (SCREEN_WIDTH, SCREEN_HEIGHT, OLED_MOSI, OLED_CLK, OLED_DC, OLED_RESET, OLED_CS);
SSD1306_SWITCHCAPVCC를 사용하여 OLED 디스플레이 를 초기화하여 내부적으로 3.3V를 생성하여 디스플레이를 초기화합니다.
if (! display.begin (SSD1306_SWITCHCAPVCC)) { Serial.println (F ("SSD1306 할당 실패")); 에 대한(;;); // 계속하지 말고 영원히 반복 }
display.clearDisplay () 함수를 호출하여 아무것도 표시하기 전에 OLED 화면의 표시를 지 웁니다. 우리는 2 글꼴 크기를 설정 함수를 호출하여 setTextSize (글꼴 크기), 및 텍스트 색상 및 커서의 위치를 설정 하여 setTextColor 및 setCursor ()에의 기능을 . Display.display () 명령은 SSD1306 컨트롤러의 내부 메모리로 데이터를 전송하는 데 사용됩니다. 전송 후 픽셀이 화면에 표시됩니다. 이제 display.startscrollright (x-pos, y-pos) 및 display.startscrollleft (x-pos, y-pos) 를 호출 하여 다양한 방법 으로 텍스트 스크롤 을 시작할 수 있습니다. 지연 기능에 주어진 시간 동안. display.stopscroll () 함수를 사용하여 텍스트 스크롤을 중지 할 수 있습니다.
void testscrolltext (void) {display.clearDisplay (); // OLED 디스플레이 화면을 지 웁니다. display.setTextSize (2); // 2X 스케일 텍스트 그리기 display.setTextColor (WHITE); display.setCursor (0, 0); display.println (F ("CIRCUIT")); display.println (F ("DIGEST")); display.display (); // 초기 텍스트 표시 delay (100); // 여러 방향으로 스크롤하여 중간에 일시 중지합니다. display.startscrollright (0x00, 0x0F); 지연 (2000); display.stopscroll (); 지연 (1000); display.startscrollleft (0x00, 0x0F); 지연 (2000); display.stopscroll (); 지연 (1000); display.startscrolldiagright (0x00, 0x07); 지연 (2000); display.startscrolldiagleft (0x00, 0x07); 지연 (2000); display.stopscroll (); 지연 (1000); }
OLED에 이미지 를 그리기 위해 6 개의 매개 변수 (x 좌표, y 좌표, 비트 맵 배열, 너비, 높이 및 색상)를 사용하는 display.drawBitmap () 함수를 호출 합니다. 디스플레이 크기가 128x64이므로 너비와 높이를 각각 128과 64로 설정합니다. 여기서 비트 맵 배열에는 이미지를 만들기 위해 화면에 픽셀을 그리는 픽셀 정보가 포함되어 있습니다. 이 비트 맵 배열은 아래 설명 된대로 온라인으로 생성 될 수 있거나 이미지를 비트 맵 배열로 변환하는 데 사용할 수있는 많은 소프트웨어가 있습니다.
const unsigned char myBitmap PROGMEM = { 0xff, 0xff, 0xff, 0xe0, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff , 0x00, 0x7ff, 0xff, 0xc0, 0xff, 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, 0xff, 0xc7, 0x80, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x0f, 0x01, 0xc0, 0x00, 0xc0, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x0f, 0x03, 0xff, 0xc0, 0x7f, 0xff, 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, 0x07f, 0xfe, 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 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, 0xf0 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, 0x3f, 0x80, 0xff, 0x80, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x7f, 0xf9, 0x80, 0x0f, 0xff, 0xff, 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, 0xff, 0xff, 0xff, 0x01, 0xf0, 0x1f, 0x80, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff , 0xe0, 0xc0, 0x00, 0x03 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, 0x00, 0x00, 0x03 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x07, 0x80, 0x00, 0x00, 0x00, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff , 0x00, 0x80, 0xff 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, 0xff, 0xff, 0x80, 0x00, 0x1e, 0x01, 0xe0, 0x00, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x00, 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, 0xff, 0xff, 0xff, 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, 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, 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, 0xff, 0x00, 0xff 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0x00, 0x01, 0xf0, 0x00, 0x00, 0x00, 0x01, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0x80, 0xff, 0x80, 0xff 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, 0xff, 0xff, 0xff, 0x80, 0x00, 0x03, 0xbc, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x00, 0x01, 0xff , 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 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, 0x80, 0x03, 0xf0, 0x00, 0x00, 0x07, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xe0, 0x01, 0xc0, 0x00, 0x00, 0x0f, 0xff, 0x0f 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x00, 0x00, 0x00, 0x00, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff , 0xff, 0xc0, 0xf8, 0x03, 0xff, 0x03 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, 0x1f 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfe, 0x00, 0x0e, 0x30, 0x00, 0x7f, 0xff, 0xff, 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, 0xc0, 0x01, 0xc0, 0x7f, 0xf0, 0x03, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff, 0xff , 0x00, 0x00, 0xff, 0xe0, 0xff 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 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 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, 0xff, 0xff, 0xf0, 0x00, 0x00, 0x1f, 0xff, 0xff, 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 ();
이미지를 비트 맵 값으로 변환
온라인 비트 맵은 http://javl.github.io/image2cpp/에서 생성 할 수 있습니다. OLED에 표시 할 이미지 파일을 업로드하고 크기를 128x64로 설정합니다. 미리보기 이미지가 표시되고 비트 맵 배열이 생성됩니다.
아래 스크린 샷은 이미지의 비트 맵 값을 생성하는 프로세스를 보여줍니다.
마지막으로 전체 코드를 NodeMCU ESP8266에 업로드하면 OLED 화면에 이미지가 표시됩니다. 여기서는 OLED 디스플레이에 CircuitDigest 로고를 표시하고 있습니다.