아두이노 앱인벤터 코딩 사례에 의하면 블루투스를 사용하는 예제가 대부분을 차지하고 있다
. 하지만 ESP8266 와파이 보드를 사용하는 방법 또한 매우 중요하다.
ESP8266 12 WiFi 모듈 칩을 사용하는 weMos 보드는 NodeMCU 와 거의 동일한 와이파이 성능을 제공한다. weMos 보드 디지털 데이터 핀 12번과 13번 핀에 인접한 GND를 사용하여 빨간색 LED를 설치하였다. 가급적 빵판 사용을 지양하기 위해서 미리 LED 와 330옴 저항을 납땜 후 테이프 처리 하였다. 붙박이 LED를 사용하려면 코딩에서 14번을 사용하면 된다.
아울러 5V 의 전압 범위내에서 아날로그 전압을 발생시킬 수 있도록 가변 저항을 설치하고 A0 에 입력하도록 배선한다.
이 실험 장치의 사용 방법은 다음과 같다. 일 단 스마트 폰 앱에서 LED on 또는 LED OF 버튼을 누르면 12번에 설치된 LED 가 on OFF 됨과 동시에 weMos에서 현재의 LED 상태를 와이파이를 통해 스마트 폰 화면에 출력한다. 한편 가변 저항 손잡이를 돌리게 되면 0∼1024 범위에 해당하는 아날로그 전압 값이 생성되며 이 업데이트 된 값을 스마트 폰에서 확인하려면 전압 버튼을 눌러야 한다. 이 과정에서 LED on OFF 상태는 변동이 없어야 한다. 반면에 LED를 on OFF 할 경우에는 전압 값의 변동이 없어야 할 것이다.
아두이노 편집기에서 컴파일 업로딩 후 시리얼 모니터를 통해 weMos 의 가상 ip 출력 결과를 확인한 후에 이 값을 앱 인벤터의 txtAddress에 부여하도록 한다.
3개의 버튼을 배치하도록 하자. 2개는 LED on OFF 용이며 나머지 1개는 가변 저항 전압 업데이트 요청용이다. 가변저항에 의해 발생하는 전압은 0∼1024 그대로 출력하기로 한다.
앱 인벤터를 코딩하도록 하자. txtAddress 라벨은 weMos의 가상 ip 값을 입력하는데 사용된다. HorizontalArrangement1 레이아웃을 사용하여 TableArrangement를 설정하여 LED on, LED OFF 및 전압 버튼을 설치한다. 하지만 전압 버튼의 길이가 LED on OFF 버튼의 2배이므로 Table에서 뽑아내어 바깥 레이아웃에 두고 길이 폭을 2배 값을 부여 후 버튼 명을 E_req 로 rename 하였다.
아두이노 ESP8266 weMos 코딩은 디지털 핀 설정 방법만 제외하고 ESP8266 NodeMCU 코딩과 거의 유사하다. 아두이노 우노에서 디지털 핀 번호 12번은 NodeMCU에서 D6 또는 12번(GPIO 12) 인데 weMos 에서는 아두이노 우노와 동일하게 그냥 12번을 사용하면 된다.
loop() 문 내부에서 앱 인벤터로부터 GET 방식의 request를 받는 부분이다. on, OFF 또는 전압의 각 경우에 대해서 url을 통해 접수되는 ASCII 문자열에 /gpio/0, /gpio/1, /gpio/2 에 해당하는 문자열이 들어 있는지 여부를 확인한다. /gpio/0 이거나 /gpio/1 이면 변수 val 의 값을 각각 0 또는 1을 할당하여 digitalWrite() 명령을 실행시킨다. 한편으로 /gpio/2 가 수신되면 가변 저항에 걸린 전압을 analogRead() 명령으로 읽어내고 dtostrf() 명령을 사용하여 문자로 바꾸어준다.
와이파이를 통해 앱 인벤터로 전송하기 위한 정보를 http/1.1 표준에 맞춰 준비한다. 웹상에서 디스플레이 할 내용은 <html> 태그로 시작하여 (val)? 값에 따라서 high:ON 이나 low:OFF. 출력을 준비하고 이어서 <br>을 넣어 웹상에서 줄빠꿈 후 문자화된 전압 값 strVolt를 더하고 </html> 로 마무리하여 출력한다.
이 아두이노 weMos 코드는 PC의 웹 url 에 가상 ip 192.168.0.12/gpio/...을 입력하여도 아래와 같이 작동이 된다.
마지막으로 앱 인벤터 블록 코딩을 살펴보자. 3개의 버튼 클릭 시에 Web1 의 url에 /gpio/0 또는 /gpio/1 또는 /gpio/2 를 입력한다.
버튼 입력 명령이 아두이노 weMos에서 실행되어 결과가 와이파이로 송신되어 스마트폰에서 수신하게 되면 iblResponse 라벨에서 출력한다.
이 블록 코딩을 저장한 후에 Connect 메뉴에서 AI Companion QR 코드 처리하여 스마트 폰에서 실행시켜 보도록 하자.
아래는 앱인벤터 실행 파일임.
아래는 아두이노 weMos 코드임.
Webserver_weMos_volt_appinventor_01
#include <ESP8266WiFi.h>
const char* ssid = "android1234";//무선 공유기 id로 수정
const char* password = "dddddddddd";//무선 공유기 비빌번호
String s;
String strVolt;
int ledPin = 12;
int measurePin = 0; //Connect variable resistor to A0 pin
WiFiServer server(80);
void setup() {
Serial.begin(115200);
delay(10);
// prepare GPIO2
pinMode(ledPin, OUTPUT);
digitalWrite(ledPin, LOW);
// Connect to WiFi network
Serial.println();
Serial.println();
Serial.print("Connecting to ");
Serial.println(ssid);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.println("");
Serial.println("WiFi connected");
// Start the server
server.begin();
Serial.println("Server started");
// Print the IP address
Serial.println(WiFi.localIP());
}
void loop() {
// Check if a client has connected
WiFiClient client = server.available();
if (!client) {
return;
}
// Wait until the client sends some data
Serial.println("new client");
while(!client.available()){
delay(1);
}
// Read the first line of the request
String req = client.readStringUntil('\r');
Serial.println(req);
client.flush();
// Match the request
int val;
if (req.indexOf("/gpio/0") != -1)
val = 0;
else if (req.indexOf("/gpio/1") != -1)
val = 1;
else if (req.indexOf("/gpio/2") != -1) {
char buf[12];
int v = analogRead(measurePin);
strVolt = dtostrf(v, 4, 0, buf);
}
else {
Serial.println("invalid request");
client.stop();
return;
}
// Set GPIO2 according to the request
digitalWrite(ledPin, val);
client.flush();
// Prepare the response
s = "HTTP/1.1 200 OK\r\nContent-Type: text/html\r\n\r\n<!DOCTYPE HTML>\r\n<html>\r\nGPIO ";
s += (val)?"high:ON":"low:OFF";
s += "<br>Volt(0-1024): ";
s += strVolt;
s += " ";
s += "</html>\n";
Serial.print(s);
client.print(s);
delay(1000);
delay(1);
Serial.println("Client disonnected");
}//끝
'앱 인벤터 appinventor' 카테고리의 다른 글
weMos 사물인터넷 코드를 웹뷰어로 불러오기위한 앱인벤터 코딩 (0) | 2017.11.22 |
---|---|
NodeMCU 미세먼지 모니터링 HTML 그래픽 출력 앱 인벤터 웹뷰어 코딩 (0) | 2017.11.22 |
앱 인벤터에 의한 나침판 코딩 업데이트 (0) | 2017.11.02 |
게임 스페이스 인베이더 앱인벤터 코딩 (0) | 2017.10.31 |
아두이노 음성인식 제어 블루투스 RC카 앱인벤터 코딩 (0) | 2017.10.29 |