메뉴 전체보기

회원메뉴

HOME

DIY ESP32 터치스크린 홈 자동화 제어 패널 - ESPHome > 게시판

본문 바로가기

쇼핑몰 검색

#ESP32 #홈자동화 #DIY #스마트홈 #터치스크린
NO. 3322
제목 : DIY ESP32 터치스크린 홈 자동화 제어 패널 - ESPHome
2026-09-23 13:50

소개: DIY ESP32 터치스크린 홈 자동화 제어 패널 - ESPHome


소개: DIY ESP32 터치스크린 홈 자동화 제어 패널 - ESPHome


소개: DIY ESP32 터치스크린 홈 자동화 제어 패널 - ESPHome


소개: DIY ESP32 터치스크린 홈 자동화 제어 패널 - ESPHome


이 튜토리얼에서는 두 개의 ESP32 보드를 사용해 벽에 장착하는 Smart Home 대시보드를 만드는 방법을 알아봅니다. 첫 번째 보드는 VIEWE ESP32-S3 보드로, 7인치 800x480 터치스크린이 내장되어 있으며 사용자 인터페이스를 실행합니다.

두 번째 보드는 4채널 릴레이가 장착된 완제품 ESP32 보드로, 네 개의 릴레이를 전환하고 DHT22 온도 및 습도 센서의 값을 읽습니다. 두 보드는 ESP-NOW 프로토콜을 사용해 무선으로 통신합니다.

이 대시보드는 또한 OpenWeather API에서 실시간 날씨 데이터를 가져오고, Open-Meteo API에서 UV 지수를 가져오며, NTP 서버에서 시간을 가져옵니다.

Home, Weather, History, Settings의 네 페이지로 구성되어 있으며, 모든 사용자 설정은 ESP32 플래시 메모리에 저장되므로 전원이 끊겨도 설정이 사라지지 않습니다.



STEP 1. 준비물


준비물


준비물


준비물


준비물


준비물


준비물


이 프로젝트를 만들려면 다음 부품이 필요합니다:

  1. VIEWE ESP32-S3 Display Board - 7인치 (Viewe_Display)
  2. ESP32 4채널 릴레이 보드
  3. DHT22 온도 및 습도 센서
  4. 점퍼 와이어
  5. USB 케이블

VIEWE ESP32 S3 디스플레이 보드

대시보드에 사용되는 메인 컨트롤러이자 터치스크린입니다. 다음을 하나로 결합합니다: ESP32-S3, 7인치 800×480 TFT 디스플레이, 그리고 멀티 터치 정전식 터치스크린 을 viewedisplay의 단일 보드에 탑재했습니다.

주요 사양:

  1. ESP32-S3-N16R8, 최대 240 MHz
  2. 7인치 800×480 TFT 디스플레이
  3. 8 MB PSRAM
  4. 16 MB Flash
  5. 2.4 GHz Wi-Fi 및 Bluetooth 5
  6. 멀티 포인트 정전식 터치
  7. Arduino, ESP-IDF 및 LVGL 지원
  8. USB/UART 연결

이 8 MB PSRAM 은 이 프로젝트에 특히 유용합니다. 대형 800×480 LVGL 인터페이스에는 기본 ESP32 디스플레이보다 훨씬 많은 메모리가 필요하기 때문입니다.

이 프로젝트에서 보드는 전체 터치스크린 대시보드, 날씨 인터페이스, 릴레이 제어, ESP-NOW 통신, 기록 및 설정 페이지를 실행합니다.



STEP 2. 작동 원리


작동 원리


작동 원리


두 ESP32 보드는 동일한 2.4 GHz WiFi 라우터에 연결됩니다. 디스플레이 보드는 OpenWeather에서 날씨와 예보를 가져오고, 자외선 지수는 Open-Meteo에서 가져오며, 시간은 NTP 서버에서 가져옵니다.

릴레이 버튼을 탭하면 디스플레이가 ESP-NOW 명령을 릴레이 보드로 전송합니다. 릴레이 보드는

송신자의 MAC 주소를 확인하고 요청된 릴레이를 전환한 다음,

실제 릴레이 상태와 DHT22 측정값을 디스플레이로 다시 전송합니다. 그러면 디스플레이가 릴레이 버튼을 ON 또는 OFF로 업데이트하고 변경 사항을 기록

페이지에 추가합니다.

릴레이 보드는 2초마다 상태를 전송하며, 디스플레이도 5초마다

상태를 요청합니다. 15초 동안 상태가 수신되지 않으면 릴레이 보드는

오프라인으로 표시됩니다.



STEP 3. 회로도


회로도


LCD, 터치 컨트롤러 및 백라이트가 이미 내부적으로 연결되어 있으므로 디스플레이 보드에는 외부 배선이 필요하지 않습니다. 따라서 회로도에는 릴레이 노드만 포함됩니다.

연결은 다음과 같습니다:

DHT22 센서와 ESP32 연결

VCC --- 3.3V
OUT --- GPIO 13
GND --- GND

4채널 릴레이 모듈과 ESP32 연결

IN1 --- GPIO 26
IN2 --- GPIO 25
IN3 --- GPIO 33
IN4 --- GPIO 32
GND --- GND
VCC --- as per your module datasheet



STEP 4. NextPCB를 통한 PCB 제조


NextPCB를 통한 PCB 제조


NextPCB를 통한 PCB 제조


ESP32 4채널 릴레이 보드의 회로도와 Gerber 파일도 첨부했습니다. 직접 버전을 제작하려면 Gerber 파일을 NextPCB 로 보내 PCB를 제조할 수 있습니다.

NextPCB는 프로토타입뿐만 아니라 소량 생산을 위한 PCB 제작 및 조립 서비스를 제공합니다.

주문하기 전에 HQDFM도 사용할 수 있습니다. HQDFM은 NextPCB의 무료 Gerber 뷰어이자 DFM 분석 도구입니다. PCB를 생산에 보내기 전에 PCB 레이어를 확인하고 제조 과정에서 발생할 수 있는 문제를 찾는 데 도움이 됩니다.

직접 PCB를 제조할 계획이라면 NextPCB 웹사이트에서 최신 PCB 및 PCBA 프로모션을 직접 확인할 수 있습니다.



STEP 5. 3D 프린팅 인클로저 및 조립


3D 프린팅 인클로저 및 조립


3D 프린팅 인클로저 및 조립


3D 프린팅 인클로저 및 조립


3D 프린팅 인클로저 및 조립


3D 프린팅 인클로저 및 조립


디스플레이 장치용으로 간단한 2파트 3D 프린팅 인클로저를 제작했으며, 전면 프레임과 후면 커버, 후면의 작은 벽면 후크/장착 지지대로 구성되어 있습니다. 따라서 대시보드가 깔끔해 보이고 벽에 쉽게 장착될 수 있습니다.

인클로저는 다음 세 가지 부품으로 구성됩니다:

  1. 다음과 같은 전면 프레임 디스플레이용
  2. 2파트 3D 프린팅 인클로저로, 전면 프레임과 후면 커버,
  3. 작은 벽면 후크/장착 지지대가 후면에 포함됩니다.

디스플레이 보드는 전면 프레임 안에 들어가며, 후면 커버를 뒤에서 나사로 고정해 닫습니다.

또한 USB 포트 와 기타 필요한 개구부를 위한 절개부도 남겨 두었으므로, 보드를 다시 분리하지 않고도 쉽게 전원을 공급하고 프로그래밍할 수 있습니다.

먼저 디스플레이 보드를 전면 프레임 안에 넣고, 화면이 개구부에 제대로 맞는지 확인합니다.

그런 다음 후면 커버를 정렬하여 제자리에 고정합니다.

조립하고 나면 이 2파트 3D 프린팅 인클로저가 디스플레이의 마감을 훨씬 향상해 주며, 벽면에 장착하는 스마트 패널로도 쉽게 사용할 수 있습니다.

원한다면 인클로저를 검은색 PLA 로 저처럼 출력할 수 있지만, 어떤 재료를 사용해도 됩니다.

또한 이 단계에서 STL 파일 을 첨부하면 누구나 케이스를 바로 출력할 수 있습니다.



STEP 6. ESP-NOW 통신 이해하기


ESP-NOW 통신 이해하기


ESP-NOW 통신 이해하기


ESP-NOW는 Espressif의 무선 프로토콜로, ESP32 보드가 라우터나 IP 주소 없이 MAC 주소를 사용해 직접 통신할 수 있도록 합니다.

이 프로젝트에서는 두 보드 모두 공유된 espnow_protocol.h 파일을 사용하며, 메시지 유형은 다음 네 가지입니다:

  1. 릴레이 명령: 릴레이 하나 전환
  2. 장면 명령: 4개의 릴레이 모두 제어
  3. 상태 요청: 현재 상태 요청
  4. 릴레이 + 센서 상태: 확인된 릴레이 상태와 DHT22 측정값을 디스플레이로 다시 전송

릴레이는 2초마다 상태를 전송하고, 디스플레이는 5초마다 상태를 요청하며, 대기 중인 명령은 2.5초후 시간 초과 처리됩니다. 또한 릴레이는 응답 없이 15초 가 지나면 오프라인으로 표시됩니다.



STEP 7. 날씨 데이터 가져오기


날씨 데이터 가져오기


날씨 데이터 가져오기


날씨 데이터 가져오기


날씨 데이터 가져오기


날씨 데이터 가져오기


날씨 데이터 가져오기


날씨 데이터 가져오기


날씨 데이터 가져오기


날씨 데이터 가져오기


날씨 데이터 가져오기


이 대시보드는 서로 다른 두 가지 무료 API에서 날씨 정보를 수집합니다.

OpenWeather API

먼저 OpenWeather 웹사이트에서 무료 계정을 만들고 API 키를 생성하세요.

무료 API 키에는 One Call 3.0 API가 포함되지 않는다는 점에 유의하세요. 무료 키로

One Call 3.0 엔드포인트를 사용하려고 하면 서버가 HTTP 401 오류를 반환합니다. 저도 개발 중에

직접 이 문제를 겪었습니다.

따라서 이 프로젝트에서는 대신 무료로 사용할 수 있는 2.5 엔드포인트 두 가지를 사용했습니다:

  1. http://api.openweathermap.org/data/2.5/weather
  2. http://api.openweathermap.org/data/2.5/forecast

첫 번째 엔드포인트는 현재 날씨 상태, 기온, 체감 온도,

습도, 기압, 가시거리, 운량, 풍속, 풍향, 강수량,

일출 및 일몰 정보를 제공합니다. 두 번째 엔드포인트는 3시간 간격의 5일 예보를 제공하며, 이 데이터를 사용해

코드가 24시간 기온 차트와 5일 예보

표시를 준비합니다.

Open-Meteo API


무료 OpenWeather 엔드포인트는 UV 지수를 제공하지 않습니다. 따라서 UV 값은

다음에서 별도로 수집합니다: Open-Mateo Air Quality API

http://air-quality-api.open-meteo.com/v1/air-quality

이 API에는 키가 전혀 필요하지 않습니다. 어떤 이유로든 이 요청이 실패하더라도 나머지 날씨 데이터는 정상적으로 표시되고 UV 필드만 표시되지 않습니다.

날씨 데이터는 10분마다 한 번씩 새로 고쳐집니다. 요청이 실패하면 60초 후에 다시 시도합니다. 첫 번째 요청은 WiFi 연결 후 약 3초 뒤에 전송됩니다.



STEP 8. Wi-Fi 및 API 구성


Wi-Fi 비밀번호나 API 키를 메인 스케치에 직접 저장하지 마세요. 코드와 함께 실수로 공개되지 않도록 별도의 헤더 파일에 보관하세요.

다음 파일을 만드세요:

  1. Display 폴더: secrets.h.example → secrets.h 복사
  2. Relay 폴더: relay_secrets.h.example → relay_secrets.h 복사

secrets.h에 자신의 정보를 입력하세요:

#define WIFI_SSID "YOUR_WIFI_NAME"
#define WIFI_PASSWORD "YOUR_WIFI_PASSWORD"
#define OPENWEATHER_KEY "YOUR_OPENWEATHER_API_KEY"
#define WEATHER_LATITUDE "YOUR_LATITUDE"
#define WEATHER_LONGITUDE "YOUR_LONGITUDE"
#define TIMEZONE_INFO "YOUR_POSIX_TIMEZONE"

위도와 경도는 Google Maps에서 확인할 수 있습니다. 따옴표 안에 입력하세요.

예를 들어, POSIX 시간대 인도의 경우 다음과 같습니다:

#define TIMEZONE_INFO "IST-5:30"

relay_secrets.h 파일에는 Wi-Fi 이름과 비밀번호만 필요합니다. Relay ESP32는 날씨 데이터를 가져오지 않기 때문입니다.

secrets.h와 relay_secrets.h는 모두 비공개로 유지하고 공개 저장소에 업로드하지 마세요.



STEP 9. 두 보드의 MAC 주소 확인


ESP-NOW는 다른 ESP32를 식별하기 위해 MAC 주소 를 사용하므로 두 보드 모두 서로의 주소를 알고 있어야 합니다.

#include <WiFi.h>

void setup() {
// Start the serial monitor
Serial.begin(115200);

// Set Wi-Fi to station mode
WiFi.mode(WIFI_STA);

// Wait a moment for stabilization
delay(1000);

// Print the MAC address
Serial.print("ESP32 MAC Address: ");
Serial.println(WiFi.macAddress());
}

void loop() {
// Nothing to do here
}

먼저 위의 스케치를 업로드하고 다음 설정으로 Serial Monitor를 여세요: 115200 baud. 각 보드는 시작할 때 자신의 STA MAC 주소를 출력합니다:

Relay STA MAC: C0:5D:89:F5:AD:FC
Display STA MAC: FC:01:2C:D4:9C:38

각 MAC 주소를 C 배열 형식으로 변환하세요. 예:

{0xC0, 0x5D, 0x89, 0xF5, 0xAD, 0xFC}

그런 다음 다음 세 값을 업데이트하세요:

  1. Display 스케치의 RELAY_ESP32_MAC → Relay 보드 MAC
  2. Relay 스케치의 DISPLAY_ESP32_MAC → Display 보드 MAC
  3. Relay 스케치의 EXPECTED_RELAY_MAC → Relay 보드 자체의 MAC

EXPECTED_RELAY_MAC은 자체 확인에만 사용되며, 펌웨어가 다른 ESP32에 업로드되면 경고를 출력합니다.

MAC 주소를 업데이트한 후 두 스케치를 다시 컴파일하고 업로드하세요.



STEP 10. 펌웨어 업로드


펌웨어 업로드


펌웨어 업로드


Relay ESP32

Relay 스케치를 업로드하고 다음 설정으로 Serial Monitor를 여세요: 115200 baud.

다음 항목이 표시되는지 확인하세요:

  1. Relay 및 DHT22 초기화
  2. ESP32 MAC 주소
  3. Wi-Fi 연결
  4. ESP-NOW 피어 등록

DHT22 read failed 메시지가 반복해서 표시되지 않는다면 센서가 정상적으로 작동하는 것입니다.

Display ESP32

그런 다음 올바른 ESP32-S3 보드 설정을 사용하여 Display 스케치를 업로드하세요.

Serial Monitor를 다음 설정으로 여세요: 115200 baud. Display가 초기화되고 LVGL이 시작되며 대시보드가 터치 기능과 함께 표시되어야 합니다.

마지막으로 두 보드가 올바르게 연결되어 있고 ESP-NOW 통신이 작동하는지 확인하세요.



STEP 11. 프로젝트 테스트


프로젝트 테스트


프로젝트 테스트


프로젝트 테스트


프로젝트 테스트


프로젝트 테스트


프로젝트 테스트


프로젝트 테스트


릴레이 출력 단자의 연결을 해제한 상태에서 이제 전체 시스템을 테스트합니다.

릴레이 테스트

홈 페이지에서 각 릴레이 카드를 탭하고 해당 릴레이 LED가 켜지고 꺼지는지 확인합니다.

카드가 ... 상태로 멈췄다가 이전 상태로 돌아가면 ESP-NOW MAC 주소와 Wi-Fi 채널을 확인합니다.

장면 테스트

다음 네 가지 장면 버튼을 확인합니다:

  1. 홈: R1 ON, R2 ON, R3 ON, R4 OFF
  2. 야간: R1 OFF, R2 OFF, R3 ON, R4 ON
  3. 외출: R1 OFF, R2 OFF, R3 OFF, R4 ON
  4. 모두 끄기: 모든 릴레이 OFF



STEP 12. 대시보드 살펴보기


대시보드 살펴보기


대시보드 살펴보기


대시보드 살펴보기


대시보드 살펴보기


대시보드 살펴보기


대시보드 살펴보기


대시보드 살펴보기


대시보드에는 네 개의 주요 페이지가 있습니다:

홈 페이지

홈 페이지에는 다음을 위한 네 개의 릴레이 제어 항목이 표시됩니다: 거실, 주방, 메인 팬, 정원. 또한 장면 버튼, 현재 날씨, DHT22에서 측정한 실내 온도와 습도도 포함됩니다.

날씨 페이지

이 페이지에는 현재 온도, 체감 온도, 습도, 기압, 풍속, UV 지수, 일출, 일몰, 24시간 온도 차트및 5일 예보가 표시됩니다.

기록 페이지

기록 페이지에는 최근 확인된 릴레이 이벤트 8개 와 각 릴레이의 세션 실행 시간이 표시됩니다.

실행 시간 데이터는 RAM에만 저장되므로 ESP32가 재시작되면 초기화됩니다.

설정 페이지

다음 항목을 변경할 수 있습니다:

  1. 밝기
  2. 디밍 및 절전 시간
  3. 테마: Slate, AMOLED 또는 Aurora
  4. 섭씨 또는 화씨
  5. 실내 환경 정보 표시/숨기기
  6. 날짜 표시/숨기기
  7. 장면 버튼 표시/숨기기

스마트 홈 대시보드가 이제 완성되었습니다. 디스플레이에서 ESP-NOW를 통해 네 개의 릴레이를 제어하고, 실내 센서 데이터를 표시하며, 날씨 정보를 가져오고, 대시보드 설정을 플래시 메모리에 저장할 수 있습니다. 이제 사용자의 홈 자동화 환경에 맞게 릴레이 이름, 장면, 색상 및 인클로저를 사용자 지정할 수 있습니다.

원문: https://www.instructables.com/DIY-ESP32-Touchscreen-Home-Automation-Control-Pane/

좋아요 0
게시판

회사명 공방유니언 주소 각 공방 주소 참조
사업자 등록번호 0000 대표 공방유니언 전화 019-60105846 팩스 0000 이메일 gongbangunion@gmail.com
통신판매업신고번호 0000 개인정보관리책임자 공방유니언
Copyright © 2017 공방유니언. All Rights Reserved.