MIT App Inventor를 사용하여 Arduino 프로젝트용 맞춤형 Android 앱을 빌드하는 방법

<메인 클래스="사이트 메인" id="메인">

이 Arduino Tutorial에서는 MIT App Inventor 온라인 응용 프로그램을 사용하여 Arduino를 제어하기 위한 맞춤형 Android 응용 프로그램을 구축하는 방법을 배웁니다. 다음 비디오를 보거나 아래에 작성된 튜토리얼을 읽을 수 있습니다.

개요

이 자습서에는 두 가지 예가 있습니다. 첫 번째는 간단한 LED를 제어하는 ​​것이고 두 번째는 스마트폰을 이용하여 Stepper Motor를 제어하는 ​​것이다. 이전 튜토리얼에서 우리는 이미 HC-05 블루투스 모듈을 사용하여 Arduino 보드와 스마트폰 사이에 블루투스 통신을 만드는 방법을 배웠고 첫 번째 예제에 필요한 Arduino 코드를 설명했습니다.

Arduino 코드

다음은 해당 코드에 대한 간략한 개요입니다. 따라서 직렬 포트를 통해 스마트폰에서 들어오는 데이터를 받아 '상태' 변수에 저장합니다. 'LED:OFF' 버튼을 눌렀을 때 스마트폰에서 보낸 문자 '0'을 받으면 LED를 끄고 문자열 "LED:OFF"를 스마트폰으로 다시 보냅니다. 반면에 문자 '1'을 수신하면 LED를 켜고 문자열 "LED:ON"을 다시 보냅니다.

/* Arduino and HC-05 Bluetooth Module Tutorial
 * 
 * by Dejan Nedelkovski, www.HowToMechatronics.com
 * 
 */
 
#define ledPin 7
int state = 0;

void setup() {
 pinMode(ledPin, OUTPUT);
 digitalWrite(ledPin, LOW);
 Serial.begin(38400); // Default communication rate of the Bluetooth module
}

void loop() {
 if(Serial.available() > 0){ // Checks whether data is comming from the serial port
 state = Serial.read(); // Reads the data from the serial port
 }

 if (state == '0') {
 digitalWrite(ledPin, LOW); // Turn LED OFF
 Serial.println("LED: OFF"); // Send back, to the phone, the String "LED: ON"
 state = 0;
 }
 else if (state == '1') {
 digitalWrite(ledPin, HIGH);
 Serial.println("LED: ON");;
 state = 0;
 } 
}Code language: Arduino (arduino)

이제 특정 버튼을 눌렀을 때 '0'과 '1' 문자를 보내고 Arduino에서 들어오는 문자열을 수신하는 맞춤형 Android 애플리케이션을 빌드해야 합니다.

MIT 앱 발명가

MIT App Inventor 웹사이트에서 "앱 만들기!"를 클릭하여 온라인 구축 애플리케이션에 로그인해야 합니다. 단추. 로그인하려면 Gmail 계정이 있어야 합니다. 이제 로그인하면 첫 번째 프로젝트를 만들 수 있습니다. 다음은 디자인 창의 모양이며 이제 애플리케이션 빌드를 시작할 수 있습니다.

하지만 그 전에 스마트폰을 이 프로젝트에 연결하여 앱이 스마트폰에서 직접 실시간으로 어떻게 모양을 만들고 있는지 확인할 수 있습니다. 그렇게 하려면 먼저 Play 스토어에서 MIT AI2 Companion 앱을 다운로드하고 스마트폰에 설치해야 합니다. 그런 다음 온라인 편집기의 연결 메뉴에서 AI Companion을 선택하면 바코드가 나타나며 이를 스캔하거나 스마트폰 앱에 코드를 삽입하면 온라인 편집기와 스마트폰 앱 간의 연결이 설정됩니다.

<그림 클래스="aligncenter">

그래서 이제 예를 들어 온라인 편집기 화면에 버튼을 삽입하면 버튼이 실시간으로 스마트폰에도 나타납니다. 이와 유사하게 앱을 빌드하면서 스마트폰을 사용하고 싶지 않다면 컴퓨터에 안드로이드 에뮬레이터를 설치하여 같은 방법으로 사용하면 됩니다. 웹사이트에서 에뮬레이터를 설정하는 방법에 대해 자세히 알아볼 수 있습니다.

앱 빌드 – 예제 1

이제 첫 번째 예제를 빌드할 준비가 되었습니다. 프로그램 구성부터 시작하겠습니다. 먼저 레이아웃 팔레트에서 HorizontalArrangements를 추가하고 프로그램이 원하는 모양과 일치하도록 높이, 너비 및 정렬과 같은 속성을 설정합니다. 그런 다음 UserInterface 팔레트에서 ListPicker를 추가하고 이미지를 첨부합니다. ListPicker는 스마트폰이 연결할 블루투스 장치를 선택하는 데 사용됩니다.

다음으로 레이블을 배치할 다른 HorizontalArrangements를 추가합니다. 이 레이블은 스마트폰이 Bluetooth 모듈에 연결되어 있는지 여부를 나타내므로 이 레이블의 초기 텍스트를 "연결되지 않음"으로 설정합니다. 다음 레이블은 꺼져 있거나 켜져 있는지 여부에 관계없이 LED 상태를 표시하는 데 사용됩니다. 초기 상태는 "LED:OFF"입니다. 다음으로 LED를 제어하기 위한 '켜기'와 '끄기'라는 두 개의 버튼을 추가합니다. 이 시점에서 나중에 블록 편집기에서 더 쉽게 인식하고 사용할 수 있도록 구성 요소의 이름을 바꾸는 것이 좋습니다. 이제 연결 상태를 실시간으로 표시하는 데 사용할 시계와 보이지 않는 구성 요소인 BluetoothClient를 추가하는 일만 남았습니다.

블록 편집기

이제 블록 편집기에서 프로그램에 생명을 불어넣을 준비가 되었습니다. 왼쪽에는 이전에 추가한 구성 요소와 관련된 모든 블록과 기능이 있습니다.

BluetoothList ListPicker부터 시작하겠습니다. 거기에서 먼저 'BeforePicking' 블록을 추가하고 'Bluetooth 요소 설정' 블록을 첨부합니다. 그런 다음 BluetoothClient 블록에서 'BluetoothClient AddressesAndNames' 블록을 추가합니다. 이 블록 세트는 이미 휴대폰과 페어링된 Bluetooth 장치 목록을 설정하므로 ListPicker "연결 버튼"을 클릭하면 페어링된 모든 장치 목록이 표시됩니다.

다음으로 우리는 특정 블루투스 모듈을 선택하거나 선택한 후에 일어날 일을 설정해야 합니다. BluetoothClient 블록에서 'call BluetoothClient .Connect address' 블록을 추가하고 여기에 'BluetoothList Selection' 블록을 추가합니다. 이는 전화가 이전에 선택한 Bluetooth 주소에 연결됨을 의미합니다.

다음으로 Clock 블록에서 ".Timer" 블록을 추가합니다. 이 블록 내에서 "Connected"라는 레이블의 "set Text" 블록을 사용하여 전화가 Bluetooth 모듈에 연결되었는지 여부를 실시간으로 표시합니다.

<그림 클래스="aligncenter">

다음으로 두 개의 버튼에 생명을 불어넣어야 합니다. 따라서 "TurnOn_Button"을 클릭하면 Bluetooth 클라이언트 기능 "Send1ByteNumber"를 사용하여 Arduino Bluetooth 모듈에 번호를 보냅니다. 우리의 경우 ASCII 테이블에 따라 문자 '1'에 해당하는 숫자 49가 LED를 켭니다. 그 직후 "ReceiveText" BluetoothClient 기능을 사용하여 Arduino에서 전화로 다시 전송되는 수신 문자열을 수신합니다. 이 문자열은 "LED_Status" 레이블로 설정됩니다.

동일한 절차가 "TurnOff_Button"에 대해 진행되며, 여기서 송신 번호는 문자 '0'에 해당하는 48로 변경되어야 합니다. 이제 스마트폰에 프로그램을 다운로드하여 설치하는 일만 남았습니다. "빌드" 메뉴에서 컴퓨터에 저장한 다음 휴대폰으로 전송하거나 프로그램의 온라인 다운로드를 위해 QR 코드를 스캔하여 이를 수행할 수 있습니다. 다음은 예제의 데모입니다.

다음은 위의 MIT 앱 인벤터 프로젝트의 다운로드 파일입니다.

BluetoothTest.aia

파일 1개 5.16KB 다운로드

스테퍼 모터 제어 예

---

이제 스테퍼 모터를 제어하는 ​​두 번째 예를 살펴보겠습니다. 화면 상단에는 이전 예와 동일한 Bluetooth 연결 구성 요소가 있습니다. 다음으로 이미지를 그리고 삽입하는 데 사용되는 Canvas 구성 요소가 있습니다. 이전에 그린 두 개의 투명 이미지를 삽입했습니다. 첫 번째는 제자리에 고정될 게이지의 이미지이고 두 번째는 회전할 포인터의 이미지입니다. 다음으로 수동과 자동 또는 연속 실행 모드 사이를 전환하기 위한 확인 버튼과 회전 방향을 변경하기 위한 버튼이 있습니다. 버튼에는 스테퍼 모터의 회전 속도를 변경하기 위한 슬라이더가 있습니다.

다음은 이 예제 뒤에 있는 블록과 Arduino 코드입니다. 따라서 블록 편집기에는 이전 예와 동일한 Bluetooth 연결 블록이 있습니다.

이제 포인터 이미지를 회전하기 위해 이미지를 0° 위치에서 캔버스가 터치된 X 및 Y 좌표로 회전하는 ImageSprite 함수 ".PointInDirection"을 사용합니다. 동시에 회전된 ImageSprite 제목을 위의 텍스트 레이블로 설정했습니다. 그 후 우리는 맞춤형 프로시저 또는 실제로 10m초 지연되는 함수를 호출합니다.

마지막으로 "SendText" 블루투스 기능을 사용하여 제목 값을 텍스트로 Arduino에 보냅니다. 이 값은 Arduino에 의해 허용되며 그에 따라 스테퍼 ​​모터가 회전합니다.

다음은 CheckBox 블록입니다. 따라서 CheckBox가 선택되어 있으면 "Auto"라는 텍스트를 Arduino에 보내어 스테퍼 모터를 활성화하여 지속적으로 회전합니다. 이 모드에 있는 동안 "Reverse" 버튼을 누르면 "Reverse"라는 텍스트가 Arduino에 전송되어 모터의 회전 방향이 변경됩니다. 또한 이 모드에 있는 동안 회전 속도를 변경할 수 있습니다. 슬라이더의 위치를 ​​변경하면 슬라이더 위치의 현재 값이 Arduino로 전송되어 스테퍼의 회전 속도가 변경됩니다. CheckBox를 선택 취소하면 수동 모드로 돌아갑니다. 다음은 예제의 데모입니다.

다음은 위의 MIT App Inventor 프로젝트의 다운로드 파일과 프로젝트에 사용된 두 개의 이미지입니다.

StepperMotorTest.aia

파일 1개 60.96KB 다운로드

스테퍼 모터 게이지 및 포인터 이미지

파일 1개 27.34KB 다운로드

다음은 두 번째 예제의 Arduino 코드입니다.

/*  Stepper Motor Control via HC-05 Bluetooth Module
 *      
 *  by Dejan Nedelkovski, www.HowToMechatronics.com
 *  
 */

// Defining variables
const int stepPin = 7; 
const int dirPin = 6;
String state = ""; 
int currentHeading=0;
int currentAngle=0;
int lastAngle=0;
int angle=0;
int rotate=0;
int runContinuously=0;
String mode = "Manual";
boolean dirRotation = HIGH;
int rotSpeed = 1500;
 
void setup() {
  // Sets the two pins as Outputs
  pinMode(stepPin,OUTPUT); 
  pinMode(dirPin,OUTPUT);
  Serial.begin(38400); // Default communication rate of the Bluetooth module
}
void loop() {
  delayMicroseconds(1);
  if(Serial.available() > 0){ // Checks whether data is comming from the serial port
    state = Serial.readString(); // Reads the data from the serial port
 }
 // When Auto Button is pressed
 if (mode == "Auto") {
  if (state == "Reverse") {
    delay(10);
    if (dirRotation == HIGH) {
      dirRotation = LOW;
    }
    else {
      dirRotation = HIGH;
    }  
    digitalWrite(dirPin,dirRotation);
    delay(10);
    state = "";
  }
  rotSpeed = state.toInt();
  if (rotSpeed >= 300 && rotSpeed <= 3000) {
  digitalWrite(stepPin,HIGH); 
  delayMicroseconds(rotSpeed); 
  digitalWrite(stepPin,LOW); 
  delayMicroseconds(rotSpeed);
  }
  else {
  digitalWrite(stepPin,HIGH); 
  delayMicroseconds(1500); 
  digitalWrite(stepPin,LOW); 
  delayMicroseconds(1500);
  }
  
  if (state == "Manual"){
    mode = state;
  }
 }
 // When Program is in Manual mode
 else if (mode == "Manual"){ 
 currentHeading = state.toInt();
 //Serial.println(angle);
 //Serial.println(state);
 if (currentHeading < 0 ){
  currentHeading = 360+currentHeading;
 }
 currentAngle = map(currentHeading,0,359,0,200);
 digitalWrite(dirPin,HIGH); // Enables the motor to move in a particular direction
  // Makes 200 pulses for making one full cycle rotation
  if (currentAngle != lastAngle){
    if(currentAngle > lastAngle){  
      rotate = currentAngle - lastAngle;  
      for(int x = 0; x < rotate; x++) {
      digitalWrite(stepPin,HIGH); 
      delayMicroseconds(500); 
      digitalWrite(stepPin,LOW); 
      delayMicroseconds(500); 
      }
    }

    if(currentAngle < lastAngle){  
      rotate = lastAngle - currentAngle; 
      digitalWrite(dirPin,LOW); //Changes the rotations direction
      for(int x = 0; x < rotate; x++) {
      digitalWrite(stepPin,HIGH); 
      delayMicroseconds(500); 
      digitalWrite(stepPin,LOW); 
      delayMicroseconds(500); 
      }
    }
  }
  lastAngle = currentAngle;
  if (state == "Auto"){
    mode = state;
  }
 }
}
Code language: Arduino (arduino)