이 프로젝트 정보
디스플레이가 많이 있습니다. Arduino에 그래픽 사용자 인터페이스를 추가하기 위한 옵션 무대. 그러나 대부분은 상당한 양의 메모리와 처리 시간이 필요하며 Arduino에는 적합하지 않습니다. 메모리가 제한되고 Arduino UNO와 같은 처리 능력이 있는 보드 또는 Arduino Nano . 메모리가 제한되어 고급 사용자 인터페이스가 필요한 경우 Smart Programmable Serial Nextion 디스플레이 인기있는 선택입니다. 이테드 무료 Graphical Nextion Editor 제공 디스플레이의 사용자 인터페이스를 디자인하기 위한 것입니다.
BME280 매우 정확한 결합 온도입니다. , 습도 및 기압 감지기. I2C와 연결할 수 있습니다. 또는 SPI 인터페이스,
비수이노 전체 넥스트 디스플레이 있음 지원하며 Nextion에 대한 자습서를 계획하고 있습니다. 잠시 지원합니다. BME280용 튜토리얼도 만들고 싶었습니다. 감지기. 마침내 나는 그것들을 결합하고 온도를 표시하는 단일 튜토리얼을 만들기로 결정했습니다. , 습도 및 기압 BME280에서 범위의 3개 채널에서 (파형 ) 다음 디스플레이 구성요소 .
1단계:구성요소 
<울> 하나의 Arduino 호환 가능한 보드(저는 Arduino Nano를 사용합니다. 왜냐하면 저는 하나가 있지만 다른 것도 괜찮을 것입니다)
<울> 1개의 BME280 센서 모듈
<울> 하나의 Nextion 직렬 인터페이스 스마트 디스플레이 (저는 NX4024K032_11을 사용했습니다. 그러나 다른 모든 것도 작동해야 함)
<울> 4 여성-여성 점퍼 와이어
<울> 디스플레이를 프로그래밍하려면 5V 도 필요합니다. USB-TTL 직렬 변환기 모듈
2단계:Nextion 디스플레이를 USB 직렬 통신 모듈에 연결 
다음 디스플레이를 프로그래밍하려면 다음 편집기 사용 USB to TTL 직렬 변환기로 연결해야 합니다. 컴퓨터로:
<울> Nextion Wires 커넥터 연결 디스플레이 (그림 1 )
<울> USB 대 직렬 모듈인 경우 구성 가능합니다. 5V 전원을 제공하도록 설정되어 있는지 확인하세요. (그림 2 ) (제 경우에는 전원 선택 점퍼로 구성해야 했습니다)
<울> 접지선 연결 (검은색 와이어 ) 다음 디스플레이에서 접지 핀에 USB to TTL 직렬 변환기 모듈 (그림 2 )
<울> 전원(+5V) 전선 연결 (빨간선 ) 다음 디스플레이에서 전원(VCC/+5V) 핀에 USB to TTL 직렬 변환기 모듈 (그림 2 )
<울> RX 와이어 연결 (노란선 ) 다음 디스플레이에서 TX 핀에 USB to TTL 직렬 변환기 모듈 (그림 2 )
<울> TX 와이어 연결 (파란색 와이어 ) 다음 디스플레이에서 RX 핀에 USB to TTL 직렬 변환기 모듈 (그림 2 )
<울> USB-TTL 직렬 변환기 모듈 연결 USB 케이블을 사용하여 컴퓨터에 (그림 3 )
3단계:Nextion 편집기를 시작하고 디스플레이 유형 및 방향 선택 
다음 디스플레이를 프로그래밍하려면 , Nextion Editor를 다운로드 및 설치해야 합니다. .
<울> Nextion Editor 시작 (그림 1 )
<울> 메뉴에서 |파일새로 만들기 선택 | (그림 1 )
<울> "다른 이름으로 저장 " 대화 상자에서 프로젝트 파일 이름을 입력하고 프로젝트를 저장할 위치를 선택합니다(그림 2 )
<울> '저장 " 버튼(그림 2 )
<울> '설정 " 대화상자에서 디스플레이 유형을 선택합니다. (제 경우에는 NX4024K032_11 ) (그림 3 )
<울> '디스플레이 디스플레이 설정을 표시하려면 왼쪽의 " 탭 (그림 4 )
<울> 가로 선택 디스플레이 방향(그림 4 )
<울> '확인 " 버튼을 눌러 대화상자를 닫습니다(그림 4 )
4단계:Nextion Editor에서:Waveform(Scope) 구성 요소 추가 및 구성 
Scope 구성 요소를 추가하고 Temperature에 대해 3개의 채널을 갖도록 구성해야 합니다. , 압력 , 및 습도 :
<울> "도구 상자 " 왼쪽에서 "파형 " 구성요소(그림 1 ) 디자인 영역에 추가합니다(그림 2). )
<울> 디스플레이를 채우도록 구성요소 크기 조정(그림 3 )
<울> "속성 " 도구 상자에서 "ch " 속성 "3 " (그림 3 )
<울> "속성 " 도구 상자에서 "dir 값을 설정합니다. " 속성을 "오른쪽에서 왼쪽으로 " (그림 4 )
5단계:Nextion 편집기에서:Nextion 디스플레이에 프로젝트 업로드 
<울> '업로드 " 버튼(그림 1 )
<울> "Nextion 기기에 업로드 " 대화상자에서 "이동 " 버튼(그림 2 ) 업로드를 시작합니다(그림 3). )
<울> 업로드가 완료되면(그림 4 ), "종료 " 버튼을 눌러 대화 상자를 닫습니다.
6단계:Visuino를 시작하고 Arduino 보드 유형 선택 
Arduino Nano 이후 직렬 포트는 하나만 있습니다. , Arduino를 프로그래밍하는 데 필요합니다. , Arduino Nano를 프로그래밍해야 합니다. 다음 디스플레이 전 연결됩니다.
Arduino 프로그래밍을 시작하려면 Arduino IDE가 있어야 합니다. 여기에서 설치:http://www.arduino.cc/ .
Arduino IDE 1.6.6에는 몇 가지 중요한 버그가 있습니다.
1.6.7 이상을 설치해야 합니다. 그렇지 않으면 이 튜토리얼이 작동하지 않습니다!
비수이노 :https://www.visuino.com도 설치해야 합니다.
<울> Visuino 시작 첫 번째 사진과 같이
<울> '도구 Arduino의 " 버튼 구성요소(그림 1 ) Visuino
<울> 대화상자가 나타나면 Arduino Nano를 선택합니다. 그림 2와 같이
7단계:Visuino에서:Nextion Display 구성 요소 및 Scope 요소 추가 
Nextion Display를 제어하려면 Visuino에 Nextion Display 구성 요소를 추가한 다음 Scope를 제어하는 요소를 추가해야 합니다.
<울> "다음 입력 " 구성요소 도구 상자의 필터 상자에서 "다음 표시 " 구성요소(그림 1 ), 디자인 영역에 드롭하세요.
<울> '도구 DisplayNextion1의 " 버튼 구성요소(그림 2 )
<울> "요소 " 편집기는 "범위(웨이브)를 선택합니다. " 요소를 클릭한 다음 왼쪽의 "" 버튼을 클릭합니다(그림 2 ) 범위 추가 요소(그림 3 )
8단계:Visuino에서:Scope 요소에 3개의 채널을 추가하고 Nextion Display 연결 
다음으로 Scope에 채널을 추가해야 합니다.
<울> Object Inspector에서 "... "채널 값 옆에 있는 " 버튼 Scope1의 " 하위 속성 요소(그림 1 )
<울> 채널 편집기에서 '채널 ” 요소를 클릭한 다음 3번을 클릭합니다. 왼쪽의 "" 버튼(그림 2 ) 3개의 채널 추가(그림 3 )
<울> '채널 닫기 " 및 디스플레이 "요소 " 대화 상자
<울> 연결 "출력 DisplayNextion1의 " 출력 핀 "In에 대한 구성요소 "직렬[ 0 ]의 " 입력 핀 Arduino 의 " 채널 구성요소(그림 4 )
9단계:Visuino에서:3개의 지도 범위 구성 요소 추가 및 구성 
Nextion 디스플레이 범위 채널은 0.0 사이의 값을 표시하도록 설계되었습니다. 및 1.0 . 온도, 습도 및 압력을 표시하려면 값을 0.0으로 변환해야 합니다. 1.0으로 범위. 이를 위해 Map Range 구성 요소를 사용할 수 있습니다.
<울> '지도 입력 " 구성요소 도구 상자의 필터 상자에서 "지도 범위 " 구성요소(그림 1 ), 3개 삭제 디자인 영역
<울> MapRange1 선택 구성요소(그림 2 )
<울> Object Inspector에서 "입력 범위 " 속성(그림 2 )
<울> Object Inspector에서 "Max "입력 범위의 " 하위 속성 " 속성을 "101000으로 " (그림 2 ) (위치를 잡아먹는 기압이 많이 다른 경우 다른 값을 설정해야 할 수도 있습니다.)
<울> Object Inspector에서 "Min "입력 범위의 " 하위 속성 " 속성을 "99000으로 " (그림 2 ) (위치를 잡아먹는 기압이 많이 다른 경우 다른 값을 설정해야 할 수도 있습니다.)
<울> MapRange2 선택 구성요소(그림 3 )
<울> Object Inspector에서 "입력 범위 " 속성(그림 3 )
<울> Object Inspector에서 "Max "입력 범위의 " 하위 속성 " 속성을 "100으로 " (그림 3 )
<울> Object Inspector에서 "Min "입력 범위의 " 하위 속성 " 속성을 "-20으로 " (그림 3 )
<울> MapRange3 선택 구성요소(그림 4 )
<울> Object Inspector에서 "입력 범위 " 속성(그림 4 )
<울> Object Inspector에서 "Max "입력 범위의 " 하위 속성 " 속성을 "100으로 " (그림 4 )
10단계:Visuino에서:Map Range 구성 요소를 Nextion 디스플레이 채널에 연결 
<울> 연결 "출력 " MapRange1의 출력 핀 "In에 대한 구성요소 "Elements.Scope1.Channels.Channel1의 " 입력 핀 DisplayNextion1의 " 요소 구성요소(그림 1 )
<울> 연결 "출력 " MapRange2 출력 핀 "In에 대한 구성요소 "Elements.Scope1.Channels.Channel2의 " 입력 핀 DisplayNextion1의 " 요소 구성요소(그림 2 )
<울> 연결 "출력 " MapRange3의 출력 핀 "In에 대한 구성요소 "Elements.Scope1.Channels.Channel3의 " 입력 핀 DisplayNextion1의 " 요소 구성요소(그림 3 )
11단계:Visuino에서:BME280 구성 요소 추가 및 연결 
BME280 모듈에서 데이터를 읽으려면 구성 요소를 추가해야 합니다.
<울> '280 입력 Component Toolbox의 Filter 상자에서 "를 선택한 다음 "Pressure Temperature Humidity BME280 I2C " 구성요소(그림 1 ), 디자인 영역에 드롭하세요.
<울> 내 BME280 모듈 I2C 주소가 있음 118개 중 (0x76 ). 모듈에 다른 주소가 있는 경우 "Address " 속성(그림 2 )
<울> "압력(Pa) 연결 PressureTemperatureHumidity1의 " 출력 핀 "In에 대한 구성요소 MapRange1의 " 핀 구성요소(그림 2 )
<울> "온도 연결 PressureTemperatureHumidity1의 " 출력 핀 "In에 대한 구성요소 MapRange2의 " 핀 구성요소(그림 3 )
<울> "습도(%) 연결 PressureTemperatureHumidity1의 " 출력 핀 "In에 대한 구성요소 MapRange3의 " 핀 구성요소(그림 4 )
<울> 연결 "출력 PressureTemperatureHumidity1의 " 출력 핀 "In에 대한 구성요소 I2C의 " 핀 Arduino 채널 구성요소(그림 5 )
12단계:Visuino에서:클럭 생성기 구성 요소 추가, 구성 및 연결 
프로젝트를 있는 그대로 사용할 수 있지만 항상 범위를 매우 빠르게 새로 고칩니다. Scope가 1초에 10번 예제처럼 업데이트되면 더 좋습니다. 이를 위해 센서의 판독값과 스코프 업데이트를 클럭하는 클럭 구성 요소를 추가합니다.
<울> '시계 입력 " 구성요소 도구 상자의 필터 상자에서 "시계 생성기 " 구성요소(그림 1 ), 디자인 영역에 드롭하세요.
<울> Object Inspector에서 "Frequency ClockGenerator1의 " 속성 "10으로 " (그림 2 )
<울> 연결 "출력 " ClockGenerator1 의 출력 핀 "시계 구성요소 PressureTemperatureHumidity1의 " 입력 핀 구성요소(그림 3 )
13단계:Arduino 코드 생성, 컴파일 및 업로드 
<울> Visuino에서 , F9 키를 누릅니다. 또는 그림 1에 표시된 버튼을 클릭하세요. Arduino 코드를 생성하고 Arduino IDE를 엽니다.
<울> Arduino IDE에서 , 업로드를 클릭합니다. 버튼을 사용하여 코드를 컴파일하고 업로드합니다(그림 2 )
14단계:BME280 온도, 습도 및 압력 센서를 Arduino에 연결 
<울> 3V3 VCC 전원 연결 (빨간선 ), 접지 (검은색 와이어 ),SDA (녹색 와이어 ) 및 SCL (노란선 ), BME280 모듈(그림 1 )
<울> 접지선의 다른 쪽 끝을 연결합니다. (검은색 와이어 )에서 접지 Arduino Nano 핀 보드(그림 2 )
<울> 3V3 VCC 전원선의 다른 쪽 끝을 연결합니다. (빨간선 ) 3V3 Arduino Nano의 전원 핀 보드(그림 2 )
<울> SDA 와이어의 다른 쪽 끝을 연결합니다. (녹색 와이어 ) - SDA/아날로그 핀 4 Arduino Nano 보드(그림 2 )
<울> SCL 와이어의 다른 쪽 끝을 연결합니다. (노란선 ) - SCL/아날로그 핀 5 Arduino Nano 보드(그림 2 )
<울> 그림 3 그라운드가 어디에 있는지 보여줍니다. , 3V3 전원, SDA/아날로그 핀 4 및 SCL/아날로그 핀 5 , Arduino Nano 핀
15단계:Nextion 디스플레이를 Arduino에 연결 
<울> 다음 디스플레이 연결 해제 USB to TTL 직렬 변환기 모듈의 전선
<울> 그라운드 연결
<울> 다음 디스플레이 연결 해제 USB to TTL 직렬 변환기 모듈의 전선
<울> 접지선 연결 (검은색 와이어 ) 다음 디스플레이에서 접지 핀에 Arduino Nano (그림 2 )
<울> TX 와이어 연결 (파란색 와이어 ) 다음 디스플레이에서 RX(D0) 핀에 Arduino Nano (그림 2 )
<울> RX 와이어 연결 (노란선 ) 다음 디스플레이에서 TX(D1) 핀에 Arduino Nano (그림 2 )
<울> 그림 4 그라운드가 어디에 있는지 보여줍니다. , 5V 전원, RX/디지털 핀 0 및 TX/디지털 핀 1 , Arduino Nano 핀
<울> +5V 전원선 연결 (빨간선 ) 다음 디스플레이에서 5V 전원 핀에 Arduino Nano (그림 3 )
<울> 그림 4 빨간색으로 표시 그라운드는 어디에 있습니까? , 5V 전원, RX/디지털 핀 0 및 TX/디지털 핀 1 , Arduino Nano의 핀(파란색은 이전 단계에서 연결된 핀으로 표시됨)
16단계:그리고 재생... 
축하합니다! 프로젝트를 완료했습니다.
그림 1 연결되고 전원이 켜진 프로젝트를 보여줍니다. 사진과 동영상에서 볼 수 있듯이 범위 넥스트 디스플레이에서 압력을 플로팅합니다. , 온도 및 습도 BME280 모듈에서 .
그림 2에서 완전한 Visuino를 볼 수 있습니다. 도표.
첨부된 것은 Visuino입니다. 이 튜토리얼을 위해 만든 프로젝트입니다. Visuino에서 다운로드하여 열 수 있습니다. :https://www.visuino.com
Nextion Editor도 동일한 zip에 첨부되어 있습니다. 넥스트 디스플레이 프로젝트 .
FJE6Y04IWE4O3H6.zip
