ESP32 - 다중 버튼 | ESP32 - Multiple Button
이 튜토리얼은 delay() 함수에 의존하지 않고 여러 버튼을 동시에 사용하도록 ESP32를 프로그래밍하는 방법을 안내합니다. 이 튜토리얼은 두 가지 방법으로 코드를 제공합니다:
- ESP32 다중 버튼 디바운스 처리
- 배열을 사용한 ESP32 다중 버튼 디바운스 처리
우리는 네 개의 버튼으로 시연할 것입니다. 그러나 코드를 두 개의 버튼, 세 개의 버튼, 다섯 개의 버튼 또는 그 이상의 버튼에 쉽게 조정할 수 있습니다.
준비물
| 1 | × | ESP-WROOM-32 Dev Module | 쿠팡 | Amazon | |
| 1 | × | USB Cable Type-C | 쿠팡 | Amazon | |
| 1 | × | PCB-mount Button | Amazon | |
| 1 | × | Panel-mount Button | Amazon | |
| 1 | × | Breadboard | 쿠팡 | Amazon | |
| 1 | × | Jumper Wires | Amazon | |
| 1 | × | (Recommended) ESP32 Screw Terminal Adapter | 쿠팡 | Amazon |
공개: 이 섹션에서 제공된 링크 중 일부는 제휴 링크입니다. 이 링크를 통해 구매한 경우 추가 비용없이 수수료를 받을 수 있습니다. 지원해 주셔서 감사합니다.
버튼에 대하여
버튼에 관한 구체적인 튜토리얼이 있습니다. 각 튜토리얼에는 하드웨어 핀아웃, 작동 원리, ESP32에 대한 배선 연결, ESP32 코드에 관한 자세한 정보와 단계별 지침이 포함되어 있습니다. 다음 링크에서 자세한 내용을 알아보세요:
- ESP32 - Button tutorial
- ESP32 - Button Debounce tutorial
선연결
이 이미지는 Fritzing을 사용하여 만들어졌습니다. 이미지를 확대하려면 클릭하세요.
ESP32 및 다른 구성 요소에 전원을 공급하는 방법에 대해 잘 알지 못하는 경우, 다음 튜토리얼에서 안내를 찾을 수 있습니다: ESP32 전원 공급 방법.
ESP32 코드 - 디바운스가 있는 여러 버튼
여러 개의 버튼을 다룰 때 특정 상홍에서 복잡성이 생길 수 있습니다:
- 버튼 디바운싱이 필요한 애플리케이션 (버튼에 디바운스가 필요한 이유에 대해서는 여기를 참조하세요)
- 상태 변경 (눌림/해제)을 감지해야 하는 애플리케이션
다행히도, ezButton library는 디바운스와 버튼 이벤트를 내부적으로 처리함으로써 이 과정을 단순화합니다. 이는 라이브러리를 사용할 때 타임스탬프와 변수 관리로부터 사용자를 해방시킵니다. 게다가 버튼 배열을 사용하면 코드의 명확성과 간결성이 향상될 수 있습니다.
/*
* 이 ESP32 코드는 newbiely.kr 에서 개발되었습니다
* 이 ESP32 코드는 어떠한 제한 없이 공개 사용을 위해 제공됩니다.
* 상세한 지침 및 연결도에 대해서는 다음을 방문하세요:
* https://newbiely.kr/tutorials/esp32/esp32-multiple-button
*/
#include <ezButton.h>
#define BUTTON_PIN_1 25 // ESP32 핀 GPIO25가 버튼 1에 연결됨
#define BUTTON_PIN_2 26 // ESP32 핀 GPIO26가 버튼 2에 연결됨
#define BUTTON_PIN_3 27 // ESP32 핀 GPIO27가 버튼 3에 연결됨
#define BUTTON_PIN_4 14 // ESP32 핀 GPIO14가 버튼 4에 연결됨
ezButton button1(BUTTON_PIN_1); // 버튼 1을 위한 ezButton 객체 생성
ezButton button2(BUTTON_PIN_2); // 버튼 2을 위한 ezButton 객체 생성
ezButton button3(BUTTON_PIN_3); // 버튼 3을 위한 ezButton 객체 생성
ezButton button4(BUTTON_PIN_4); // 버튼 4을 위한 ezButton 객체 생성
void setup() {
Serial.begin(9600);
button1.setDebounceTime(100); // 디바운스 시간을 100 밀리초로 설정
button2.setDebounceTime(100); // 디바운스 시간을 100 밀리초로 설정
button3.setDebounceTime(100); // 디바운스 시간을 100 밀리초로 설정
button4.setDebounceTime(100); // 디바운스 시간을 100 밀리초로 설정
}
void loop() {
button1.loop(); // 반드시 loop() 함수를 먼저 호출해야 함
button2.loop(); // 반드시 loop() 함수를 먼저 호출해야 함
button3.loop(); // 반드시 loop() 함수를 먼저 호출해야 함
button4.loop(); // 반드시 loop() 함수를 먼저 호출해야 함
// 디바운스 이후의 버튼 상태 가져오기
int button1_state = button1.getState(); // 디바운스 후의 상태
int button2_state = button2.getState(); // 디바운스 후의 상태
int button3_state = button3.getState(); // 디바운스 후의 상태
int button4_state = button4.getState(); // 디바운스 후의 상태
/*
Serial.print("The button 1 state: ");
Serial.println(button1_state);
Serial.print("The button 2 state: ");
Serial.println(button2_state);
Serial.print("The button 3 state: ");
Serial.println(button3_state);
Serial.print("The button 4 state: ");
Serial.println(button4_state);
*/
if (button1.isPressed())
Serial.println("The button 1 is pressed");
if (button1.isReleased())
Serial.println("The button 1 is released");
if (button2.isPressed())
Serial.println("The button 2 is pressed");
if (button2.isReleased())
Serial.println("The button 2 is released");
if (button3.isPressed())
Serial.println("The button 3 is pressed");
if (button3.isReleased())
Serial.println("The button 3 is released");
if (button4.isPressed())
Serial.println("The button 4 is pressed");
if (button4.isReleased())
Serial.println("The button 4 is released");
}
사용 방법
- ESP32를 처음 사용한다면, Arduino IDE에서 ESP32 개발 환경 설정 방법을 참조하세요.
- 위 이미지와 같이 배선하세요.
- ESP32 보드를 PC에 마이크로 USB 케이블을 사용해 연결하세요.
- PC에서 Arduino IDE를 열어주세요.
- 올바른 ESP32 보드(예: ESP32 Dev 모듈)와 COM 포트를 선택하세요.
- 위 이미지와 같이 배선하세요.
- ESP32 보드를 PC에 USB 케이블을 사용해 연결하세요.
- PC에서 Arduino IDE를 열어주세요.
- 올바른 ESP32 보드(예: ESP32)와 COM 포트를 선택하세요.
- Arduino IDE의 왼쪽 바에 있는 Libraries 아이콘을 클릭하세요.
- “ezButton”을 검색하고, ESP32GetStarted에 의한 버튼 라이브러리를 찾으세요.
- EzButton 라이브러리를 설치하기 위해 Install 버튼을 클릭하세요.
- 위의 코드를 복사하여 아두이노 IDE에 붙여넣으세요.
- 아두이노 IDE에서 Upload 버튼을 클릭하여 코드를 ESP32 보드에 컴파일하고 업로드하세요.
- Arduino IDE에서 시리얼 모니터 열기
- 버튼을 하나씩 눌렀다 놓기
COM6
The button 1 is pressed
The button 1 is released
The button 2 is pressed
The button 2 is released
The button 3 is pressed
The button 3 is released
The button 4 is pressed
The button 4 is released
Autoscroll
Clear output
9600 baud
Newline
ESP32 코드 - 배열을 사용한 다양한 버튼들
제공된 코드를 버튼 배열을 사용하여 개선할 수 있습니다. 다음 코드는 이 배열이 버튼 객체를 어떻게 관리하는지를 보여줍니다.
/*
* 이 ESP32 코드는 newbiely.kr 에서 개발되었습니다
* 이 ESP32 코드는 어떠한 제한 없이 공개 사용을 위해 제공됩니다.
* 상세한 지침 및 연결도에 대해서는 다음을 방문하세요:
* https://newbiely.kr/tutorials/esp32/esp32-multiple-button
*/
#include <ezButton.h>
#define BUTTON_NUM 4 // 버튼의 수
#define BUTTON_PIN_1 25 // 버튼 1에 연결된 ESP32 핀 GPIO25
#define BUTTON_PIN_2 26 // 버튼 2에 연결된 ESP32 핀 GPIO26
#define BUTTON_PIN_3 27 // 버튼 3에 연결된 ESP32 핀 GPIO27
#define BUTTON_PIN_4 14 // 버튼 4에 연결된 ESP32 핀 GPIO14
ezButton buttonArray[] = {
ezButton(BUTTON_PIN_1),
ezButton(BUTTON_PIN_2),
ezButton(BUTTON_PIN_3),
ezButton(BUTTON_PIN_4)
};
void setup() {
Serial.begin(9600);
for (byte i = 0; i < BUTTON_NUM; i++) {
buttonArray[i].setDebounceTime(100); // 100밀리초로 디바운스 시간 설정
}
}
void loop() {
for (byte i = 0; i < BUTTON_NUM; i++)
buttonArray[i].loop(); // loop() 함수를 먼저 호출해야 함
for (byte i = 0; i < BUTTON_NUM; i++) {
// 디바운스 후 버튼 상태 가져오기
int button_state = buttonArray[i].getState(); // 디바운스 후의 상태
/*
Serial.print("The button ");
Serial.print(i + 1);
Serial.print(": ");
Serial.println(button_state);
*/
if (buttonArray[i].isPressed()) {
Serial.print("The button ");
Serial.print(i + 1);
Serial.println(" is pressed");
}
if (buttonArray[i].isReleased()) {
Serial.print("The button ");
Serial.print(i + 1);
Serial.println(" is released");
}
}
}
동영상
비디오 제작은 시간이 많이 걸리는 작업입니다. 비디오 튜토리얼이 학습에 도움이 되었다면, YouTube 채널 을 구독하여 알려 주시기 바랍니다. 비디오에 대한 높은 수요가 있다면, 비디오를 만들기 위해 노력하겠습니다.