BME280 온도·습도·기압을 넥시온 터치스크린에 표시하기

부품 및 소모품

부품	수량
Arduino Nano R3	1
SparkFun BME280 대기 센서 브레이크아웃	1
Itead Nextion NX8048T070 - 7.0" HMI TFT LCD 터치 디스플레이	1
SparkFun USB-시리얼 브레이크아웃 - FT232RL	1

앱 및 온라인 서비스

Visuino - 아두이노용 그래픽 개발 환경
Arduino IDE

프로젝트 소개

아두이노 보드에 GUI를 추가할 디스플레이 옵션은 많습니다. 하지만 대부분 상당한 메모리와 처리 시간을 요구해, 메모리와 처리 능력이 제한된 아두이노 우노나 나노에는 부적합합니다. 메모리가 제한된 상황에서 고급 사용자 인터페이스가 필요할 때, 스마트 프로그래머블 시리얼 넥시온 디스플레이가 인기 있는 선택지입니다. Itead는 디스플레이 UI 설계를 위한 무료 그래픽 넥시온 에디터를 제공합니다.

BME280은 매우 정확한 온도, 습도, 기압 통합 센서로, I2C나 SPI 인터페이스로 연결 가능합니다.

Visuino는 완전한 넥시온 디스플레이 지원을 제공하며, 넥시온 지원 튜토리얼과 BME280 센서 튜토리얼을 계획하다 둘을 합쳐 BME280의 온도, 습도, 기압을 넥시온 디스플레이의 3채널 스코프(파형) 컴포넌트에 표시하는 단일 튜토리얼로 만들었습니다.

1단계: 부품

아두이노 호환 보드 (아두이노 나노 사용, 다른 보드도 무방)
BME280 센서 모듈
넥시온 시리얼 인터페이스 스마트 디스플레이 (NX4024K032_11 사용, 다른 모델도 작동)
암-암 점퍼 와이어 4개
디스플레이 프로그래밍용 5V USB-TTL 시리얼 컨버터 모듈

2단계: 넥시온 디스플레이를 USB-시리얼 통신 모듈에 연결

넥시온 와이어 커넥터를 디스플레이에 연결 (사진 1)
USB-시리얼 모듈이 설정 가능하면 5V 전원 공급으로 설정 (사진 2) (제 경우 파워 셀렉션 점퍼로 설정)
넥시온 디스플레이 그라운드 와이어(검정)를 USB-TTL 모듈 그라운드 핀에 연결 (사진 2)
넥시온 디스플레이 파워(+5V) 와이어(빨강)를 USB-TTL 모듈 VCC/+5V 핀에 연결 (사진 2)
넥시온 디스플레이 RX 와이어(노랑)를 USB-TTL 모듈 TX 핀에 연결 (사진 2)
넥시온 디스플레이 TX 와이어(파랑)를 USB-TTL 모듈 RX 핀에 연결 (사진 2)
USB-TTL 시리얼 컨버터 모듈을 USB 케이블로 컴퓨터에 연결 (사진 3)

3단계: 넥시온 에디터 시작 & 디스플레이 타입/방향 선택

넥시온 에디터 다운로드 및 설치
넥시온 에디터 실행 (사진 1)
메뉴에서 File → New 선택 (사진 1)
"Save As" 대화상자에서 프로젝트 파일명과 저장 위치 지정 (사진 2)
"Save" 버튼 클릭 (사진 2)
"Settings" 대화상자에서 디스플레이 타입 선택 (제 경우 NX4024K032_11) (사진 3)
왼쪽 "DISPLAY" 탭 클릭해 디스플레이 설정 표시 (사진 4)
디스플레이 방향을 "Horizontal"로 선택 (사진 4)
"OK" 버튼으로 대화상자 닫기 (사진 4)

4단계: 넥시온 에디터에서 웨이브폼(스코프) 컴포넌트 추가 및 설정

왼쪽 "Toolbox"에서 "Waveform" 컴포넌트 클릭해 디자인 영역에 추가 (사진 1-2)
컴포넌트 크기를 디스플레이 채우게 조절 (사진 3)
"Attribute" 툴박스에서 "ch" 속성 값을 "3"으로 설정 (사진 3) - 온도, 기압, 습도 3채널용
"Attribute" 툴박스에서 "dir" 속성 값을 "right to left"로 설정 (사진 4)

5단계: 넥시온 에디터에서 프로젝트를 넥시온 디스플레이에 업로드

"Upload" 버튼 클릭 (사진 1)
"Upload to Nextion Device" 대화상자에서 "Go" 버튼 클릭해 업로드 시작 (사진 2-3)
업로드 완료 시 (사진 4) "Exit" 버튼으로 대화상자 닫기

6단계: Visuino 시작 & 아두이노 보드 타입 선택

아두이노 나노는 시리얼 포트가 1개뿐이고 아두이노 프로그래밍에 필요하므로, 넥시온 디스플레이 연결 전에 아두이노 나노를 먼저 프로그래밍해야 합니다.

아두이노 IDE는 https://www.arduino.cc/ 에서 설치하세요. 아두이노 IDE 1.6.6엔 치명적 버그가 있으니 1.6.7 이상 설치 필수!

Visuino: https://www.visuino.com 도 설치 필요.

Visuino 실행 (사진 1)
아두이노 컴포넌트의 "Tools" 버튼 클릭 (사진 1)
대화상자에서 "Arduino Nano" 선택 (사진 2)

7단계: Visuino에서 넥시온 디스플레이 컴포넌트 및 스코프 엘리먼트 추가

컴포넌트 툴박스 필터에 "next" 입력 후 "Nextion Display" 컴포넌트 선택해 디자인 영역에 드롭 (사진 1)
DisplayNextion1 컴포넌트의 "Tools" 버튼 클릭 (사진 2)
"Elements" 에디터에서 "Scope(Wave)" 엘리먼트 선택 후 왼쪽 "+" 버튼 클릭해 스코프 엘리먼트 추가 (사진 2-3)

8단계: Visuino에서 스코프 엘리먼트에 3채널 추가 & 넥시온 디스플레이 연결

오브젝트 인스펙터에서 Scope1 엘리먼트의 "Channels" 서브 속성 옆 "..." 버튼 클릭 (사진 1)
채널 에디터에서 "Channel" 엘리먼트 선택 후 왼쪽 "+" 버튼을 3번 클릭해 3채널 추가 (사진 2-3)
"Channels"와 "Elements" 대화상자 닫기
DisplayNextion1 컴포넌트의 "Out" 출력 핀을 아두이노 컴포넌트의 "Serial[0]" 채널 "In" 입력 핀에 연결 (사진 4)

9단계: Visuino에서 3개 맵 레인지 컴포넌트 추가 및 설정

넥시온 디스플레이 스코프 채널은 0.0~1.0 범위 값 표시용으로 설계됨. 온도, 습도, 기압 값을 이 범위로 변환 필요. 맵 레인지 컴포넌트 사용.

필터에 "map" 입력 후 "Map Range" 컴포넌트 선택해 3개 드롭 (사진 1)
MapRange1 선택 (사진 2) - 기압용
- "Input Range" 속성 확장
- "Max" 서브 속성 값을 "101000"으로 설정 (위치별 기압 차이에 따라 조정 필요)
- "Min" 서브 속성 값을 "99000"으로 설정 (위치별 기압 차이에 따라 조정 필요)
MapRange2 선택 (사진 3) - 온도용
- "Input Range" 확장
- "Max" = "100", "Min" = "-20"
MapRange3 선택 (사진 4) - 습도용
- "Input Range" 확장
- "Max" = "100", "Min" = "0"

10단계: Visuino에서 맵 레인지 컴포넌트를 넥시온 디스플레이 채널에 연결

MapRange1 "Out" → DisplayNextion1 "Elements.Scope1.Channels.Channel1" "In" (사진 1)
MapRange2 "Out" → DisplayNextion1 "Elements.Scope1.Channels.Channel2" "In" (사진 2)
MapRange3 "Out" → DisplayNextion1 "Elements.Scope1.Channels.Channel3" "In" (사진 3)