ESP32 - 조이스틱 | ESP32 - Joystick

이 튜토리얼에서는 ESP32와 조이스틱을 사용하는 방법을 배울 것입니다. 자세히 설명하자면, 우리는 다음을 배울 것입니다:

Joystick Pinout

준비물

1×ESP-WROOM-32 Dev Module 쿠팡 | Amazon
1×USB Cable Type-C 쿠팡 | Amazon
1×Joystick 쿠팡 | Amazon
1×Breadboard 쿠팡 | Amazon
1×Jumper Wires Amazon
1×(Optional) DC Power Jack 쿠팡 | Amazon
1×(Recommended) Screw Terminal Expansion Board for ESP32 쿠팡 | Amazon
공개: 이 섹션에서 제공된 링크 중 일부는 제휴 링크입니다. 이 링크를 통해 구매한 경우 추가 비용없이 수수료를 받을 수 있습니다. 지원해 주셔서 감사합니다.

조이스틱 센서에 대하여

당신은 아마 조이스틱을 게임 컨트롤러, 장난감 컨트롤러, 심지어는 굴착기 컨트롤러와 같은 큰 실제 기계에서도 보았을 것입니다.

조이스틱은 서로 직각인 두 개의 포텐쇼미터와 하나의 푸시 버튼으로 구성됩니다. 따라서, 다음과 같은 출력을 제공합니다:

  • 수평 위치(이를 X좌표라 함)에 해당하는 아날로그 값 (0부터 4095까지)
  • 수직 위치(이를 Y좌표라 함)에 해당하는 아날로그 값 (0부터 4095까지)
  • 푸시버튼의 디지털 값 (HIGH 또는 LOW)

두 개의 아날로그 값을 결합하면 조이스틱이 쉬고 있는 위치에서 중심이 되는 값인 2차원 좌표를 만들 수 있습니다. 좌표의 실제 방향은 다음 부분에서 테스트 코드를 실행할 때 간단히 식별할 수 있습니다.

어떤 응용 프로그램은 세 가지 출력을 모두 사용할 수도 있고, 어떤 응용 프로그램은 세 가지 출력 중 일부를 사용할 수도 있습니다.

핀 배치

조이스틱에는 5개의 핀이 있습니다:

  • GND 핀: GND(0V)에 연결해야 합니다.
  • VCC 핀: VCC(5V)에 연결해야 합니다.
  • VRX 핀: 수평 위치(일명 X-좌표)에 해당하는 아날로그 값을 출력합니다.
  • VRY 핀: 수직 위치(일명 Y-좌표)에 해당하는 아날로그 값을 출력합니다.
  • SW 핀: 조이스틱 내부의 푸시버튼에서 나오는 출력입니다. 일반적으로 열려 있습니다. 이 핀에 풀업 저항을 사용하면, SW 핀은 눌리지 않았을 때 HIGH가 되고 눌렸을 때는 LOW가 됩니다.
Joystick Pinout

작동 원리

조이스틱의 엄지를 좌/우로 밀었을 때 VRX 핀의 전압이 변합니다. 전압 범위는 0에서 5V까지입니다(왼쪽에서 0, 오른쪽에서 5V). 전압값은 엄지의 위치에 비례합니다 ⇒ ESP32의 아날로그 핀에서 읽는 값은 0에서 4095까지입니다.

조이스틱의 엄지를 상/하로 밀었을 때 VRY 핀의 전압이 변합니다. 전압 범위는 0에서 5V까지입니다(위에서 0, 아래에서 5V). 전압값은 엄지의 위치에 비례합니다 ⇒ ESP32의 아날로그 핀에서 읽는 값은 0에서 4095까지입니다.

조이스틱의 엄지를 어느 방향으로 밀든, VRX와 VRY 핀의 전압은 각 축에 대한 위치의 투영에 비례하여 변합니다.

조이스틱의 엄지를 위에서 아래로 밀었을 때, 조이스틱 내부의 푸시버튼이 닫힙니다. SW 핀에 풀업 저항을 사용한다면, SW 핀의 출력은 5V에서 0V로 변합니다 ⇒ ESP32의 디지털 핀에서 읽는 값이 HIGH에서 LOW로 변합니다.

선연결

ESP32 Joystick Wiring Diagram

이 이미지는 Fritzing을 사용하여 만들어졌습니다. 이미지를 확대하려면 클릭하세요.

ESP32 및 다른 구성 요소에 전원을 공급하는 방법에 대해 잘 알지 못하는 경우, 다음 튜토리얼에서 안내를 찾을 수 있습니다: ESP32 전원 공급 방법.

조이스틱 프로그래밍 방법

조이스틱은 두 부분으로 구성되어 있습니다: 아날로그(X, Y 축)와 디지털(푸시버튼)

아날로그 부분(X, Y 축)의 경우, analogRead() 함수를 사용하여 아날로그 입력 핀에서 값을 읽기만 하면 됩니다.

int valueX = analogRead(A0); int valueY = analogRead(A1);

디지털 부분(푸시 버튼)에 대하여: 이것은 버튼입니다. 가장 간단하고 편리한 방법은 ezButton 라이브러리를 사용하는 것입니다. 이 라이브러리는 버튼의 디바운스를 지원하고 내부 풀업 저항을 활성화할 수 있습니다. 버튼에 대해 더 자세히 알고 싶다면 ESP32 - 버튼 튜토리얼에서 확인할 수 있습니다. 코드는 이 튜토리얼의 다음 세션에서 제시될 것입니다.

아날로그 핀에서 값을 읽은 후 이를 제어 가능한 값으로 변환해야 할 수 있습니다. 다음 파트에서는 이를 위한 예제 코드를 제공할 것입니다.

ESP32 코드

이 섹션에서는 다음과 같은 ESP32 예제 코드를 제공합니다:

  • 예제 코드: 조이스틱에서 아날로그 값을 읽습니다
  • 예제 코드: 조이스틱에서 아날로그 값을 읽고 버튼 상태를 읽습니다
  • 예제 코드: 아날로그 값을 MOVE_LEFT, MOVE_RIGHT, MOVE_UP, MOVE_DOWN 명령으로 변환합니다
  • 예제 코드: 아날로그 값을 각도로 변환하여 두 서보 모터를 제어합니다 (예: 팬-틸트 카메라에서)

조이스틱에서 아날로그 값을 읽습니다.

/* * 이 ESP32 코드는 newbiely.kr 에서 개발되었습니다 * 이 ESP32 코드는 어떠한 제한 없이 공개 사용을 위해 제공됩니다. * 상세한 지침 및 연결도에 대해서는 다음을 방문하세요: * https://newbiely.kr/tutorials/esp32/esp32-joystick */ #define VRX_PIN 36 // ESP32 핀 GPIO36 (ADC0)가 VRX 핀에 연결됨 #define VRY_PIN 39 // ESP32 핀 GPIO39 (ADC0)가 VRY 핀에 연결됨 int valueX = 0; // X축 값 저장 int valueY = 0; // Y축 값 저장 void setup() { Serial.begin(9600) ; } void loop() { // X 및 Y 아날로그 값 읽기 valueX = analogRead(VRX_PIN); valueY = analogRead(VRY_PIN); // 아두이노 IDE의 시리얼 모니터에 데이터 출력 Serial.print("x = "); Serial.print(valueX); Serial.print(", y = "); Serial.println(valueY); delay(200); }

사용 방법

  • ESP32를 처음 사용하는 경우, Arduino IDE에서 ESP32 환경 설정 방법을 참조하세요.
  • 위 이미지처럼 배선하세요.
  • 마이크로 USB 케이블을 사용하여 ESP32 보드를 PC에 연결하세요.
  • PC에서 Arduino IDE를 엽니다.
  • 올바른 ESP32 보드(예: ESP32 Dev Module)와 COM 포트를 선택하세요.
  • 위의 코드를 복사하고 Arduino IDE로 엽니다
  • Arduino IDE에서 Upload 버튼을 클릭하여 ESP32에 코드를 업로드하세요.
  • 조이스틱의 엄지를 최대한 한계까지 밀어 넣은 다음, 시계 방향이나 반시계 방향으로 돌립니다.
  • 시리얼 모니터에서 결과를 확인하세요.
COM6
Send
Autoscroll Show timestamp
Clear output
9600 baud  
Newline  

조이스틱의 손가락을 돌리면서 시리얼 모니터를 계속 보세요.

  • X 값이 0이면, 현재 위치를 왼쪽으로 표시하거나 기억하세요 ⇒ 반대 방향은 오른쪽입니다.
  • Y 값이 0이면, 현재 위치를 위로 표시하거나 기억하세요 ⇒ 반대 방향은 아래입니다.

아날로그 값을 읽고 조이스틱에서 버튼 상태를 읽습니다.

/* * 이 ESP32 코드는 newbiely.kr 에서 개발되었습니다 * 이 ESP32 코드는 어떠한 제한 없이 공개 사용을 위해 제공됩니다. * 상세한 지침 및 연결도에 대해서는 다음을 방문하세요: * https://newbiely.kr/tutorials/esp32/esp32-joystick */ #include <ezButton.h> #define VRX_PIN 36 // ESP32 핀 GPIO36 (ADC0)이 VRX 핀에 연결됨 #define VRY_PIN 39 // ESP32 핀 GPIO39 (ADC0)이 VRY 핀에 연결됨 #define SW_PIN 17 // ESP32 핀 GPIO17이 SW 핀에 연결됨 ezButton button(SW_PIN); int valueX = 0; // X축 값 저장하기 위함 int valueY = 0; // Y축 값 저장하기 위함 int bValue = 0; // 버튼의 값을 저장하기 위함 void setup() { Serial.begin(9600) ; button.setDebounceTime(50); // 디바운스 시간을 50 밀리초로 설정 } void loop() { button.loop(); // 반드시 loop() 함수를 먼저 호출해야 함 // X와 Y 아날로그 값을 읽기 valueX = analogRead(VRX_PIN); valueY = analogRead(VRY_PIN); // 버튼 값 읽기 bValue = button.getState(); if (button.isPressed()) { Serial.println("The button is pressed"); // 할 일 } if (button.isReleased()) { Serial.println("The button is released"); // 할 일 } // 아두이노 IDE의 시리얼 모니터에 데이터 출력 Serial.print("x = "); Serial.print(valueX); Serial.print(", y = "); Serial.print(valueY); Serial.print(" : button = "); Serial.println(bValue); }

사용 방법

  • Arduino IDE의 왼쪽 바에 있는 Libraries 아이콘을 클릭하세요.
  • “ezButton”을 검색한 다음, ArduinoGetStarted.com에서 버튼 라이브러리를 찾으세요.
  • EzButton 라이브러리를 설치하려면 Install 버튼을 클릭하세요.
ESP32 button library
  • 위의 코드를 복사하여 Arduino IDE에서 열기
  • Arduino IDE에서 Upload 버튼을 클릭하여 ESP32에 코드 업로드
  • 조이스틱의 엄지를 왼쪽/오른쪽/위/아래로 밀기
  • 조이스틱의 엄지를 위에서 아래로 밀기
  • 시리얼 모니터에서 결과 확인하기
COM6
Send
Autoscroll Show timestamp
Clear output
9600 baud  
Newline  

아날로그 값을 좌/우/상/하 이동 명령으로 전환합니다.

/* * 이 ESP32 코드는 newbiely.kr 에서 개발되었습니다 * 이 ESP32 코드는 어떠한 제한 없이 공개 사용을 위해 제공됩니다. * 상세한 지침 및 연결도에 대해서는 다음을 방문하세요: * https://newbiely.kr/tutorials/esp32/esp32-joystick */ #define VRX_PIN 36 // ESP32 핀 GPIO36 (ADC0)가 VRX 핀에 연결됨 #define VRY_PIN 39 // ESP32 핀 GPIO39 (ADC0)가 VRY 핀에 연결됨 #define LEFT_THRESHOLD 1000 #define RIGHT_THRESHOLD 3000 #define UP_THRESHOLD 1000 #define DOWN_THRESHOLD 3000 #define COMMAND_NO 0x00 #define COMMAND_LEFT 0x01 #define COMMAND_RIGHT 0x02 #define COMMAND_UP 0x04 #define COMMAND_DOWN 0x08 int valueX = 0 ; // X축 값 저장 int valueY = 0 ; // Y축 값 저장 int command = COMMAND_NO; void setup() { Serial.begin(9600) ; } void loop() { // X 및 Y 아날로그 값을 읽습니다 valueX = analogRead(VRX_PIN); valueY = analogRead(VRY_PIN); // 아날로그 값을 명령어로 변환합니다 // 명령어 리셋 command = COMMAND_NO; // 왼쪽/오른쪽 명령어 확인 if (valueX < LEFT_THRESHOLD) command = command | COMMAND_LEFT; else if (valueX > RIGHT_THRESHOLD) command = command | COMMAND_RIGHT; // 위/아래 명령어 확인 if (valueY < UP_THRESHOLD) command = command | COMMAND_UP; else if (valueY > DOWN_THRESHOLD) command = command | COMMAND_DOWN; // 주의: 한 번에 명령어가 없거나, 하나 또는 두 개의 명령이 있을 수 있습니다 // 명령어를 직렬 포트로 출력하고 명령어 처리 if (command & COMMAND_LEFT) { Serial.println("COMMAND LEFT"); // TODO: 여기에 작업 추가 } if (command & COMMAND_RIGHT) { Serial.println("COMMAND RIGHT"); // TODO: 여기에 작업 추가 } if (command & COMMAND_UP) { Serial.println("COMMAND UP"); // TODO: 여기에 작업 추가 } if (command & COMMAND_DOWN) { Serial.println("COMMAND DOWN"); // TODO: 여기에 작업 추가 } }

사용 방법

  • 위의 코드를 복사하고 아두이노 IDE로 엽니다
  • 아두이노 IDE에서 Upload 버튼을 클릭하여 코드를 ESP32에 업로드합니다
  • 조이스틱의 엄지를 왼쪽/오른쪽/위/아래 또는 아무 방향으로 밀어넣으세요
  • 시리얼 모니터에서 결과를 확인하세요.
COM6
Send
Autoscroll Show timestamp
Clear output
9600 baud  
Newline  

※ NOTE THAT:

한 번에 명령이 없거나, 하나의 명령이거나, 두 개의 명령(예: UP과 LEFT를 동시에)이 있을 수 있습니다.

아날로그 값을 각도로 변환하여 두 개의 서보 모터를 제어합니다.

세부 내용은 ESP32 - 조이스틱으로 서보 모터 제어 튜토리얼에서 확인할 수 있습니다.

동영상

비디오 제작은 시간이 많이 걸리는 작업입니다. 비디오 튜토리얼이 학습에 도움이 되었다면, YouTube 채널 을 구독하여 알려 주시기 바랍니다. 비디오에 대한 높은 수요가 있다면, 비디오를 만들기 위해 노력하겠습니다.

관련 튜토리얼

※ OUR MESSAGES

  • Please feel free to share the link of this tutorial. However, Please do not use our content on any other websites. We invested a lot of effort and time to create the content, please respect our work!