앱인벤터2 고급 강좌 2 : 아두이노-블루투스를 이용해서 센서의 값을 푸시 알림 메시지로 보내기2

 이번 시간은 앱인벤터2 고급 강좌 2번째 시간으로  앱인벤터, 아두이노 보드, 블루투스 모듈, 광전자 센서를 이용해 스마트폰에 푸시 알림 메시지를 보내는 방법을 알아보도록 하겠다. 이번 강좌는 푸시 알림 메시지 보내기1편과 이어지므로 1편을 보지 않은 사람은 먼저 1편을 잘 숙지하고  이번 강좌를 보기 바란다. 

 

앱인벤터2 고급 강좌 1 : 푸시 알림 메시지 보내기1

 

앱인벤터2 고급 강좌 3 : 아두이노-와이파이를 이용해서 센서값 읽어 오고 푸시알림으로 보내기

 

아두이노 보드와 브레드 보드에 아래와 같은 회로를 구성하고 아두이노 보드를 컴퓨터에 연결한다. 브레드 보드에는 HC-06 블루투스 모듈, 광전자 센서 그리고 1kΩ의 저항을 pull up 방식으로 연결한다.

 

 아두이노 스케치 IDE에 아래와 같이 코딩한다. 아두이노는 C++을 기초로 하므로 C++의 기초가 부족한 사람은 C++ 책을 참고하기 바란다.

 블루투스 모듈의 신호선은 아두이노 보드의 2, 3번 핀에 연결하고 광전자 센서의 신호는 아두이노 보드의 A0 핀에 연결한다. 광전자 센서의 값이 500 이상이 입력되면 아두이노 시리얼 모니터에는 센서 값을 출력하고, 블루투스 모듈로는 "sun rise" 라는 문자를 송출한다. 블루투스 모듈로 보내진 값이 앱인벤터를 통해 사용자의 스마트 폰에 푸시 알림 형식으로 보내 질 것이다. 광전자 센서의 값이 500 이하이면 시리얼 모니터에는 "111" 값을 출력하고, 블루투스 모듈로는 "sun down" 이라는 문자를 송출한다. 이 방식으로 센서의 종류만 바꿔 화재 경보, 센서의 데이터 값 출력, 또는 어떤 물체의 존재 유무등 다양한 알림을 스마트폰에 보낼 수 있다. 

 

 

 

 H/W 적인 구성이 끝났으면 이제 앱인벤터에 아래와 같이 디자이너 화면을 구성한다. 앱인벤터에는 블루투스 보드를 직접 인식하는 기능이 없으므로 '목록 선택 버튼(LsitPicker)'을 이용해 블루투스 보드를 선택한 후 블루투스에서 전송되는 값을 받아 들일 것이다. Palette에서 '목록 선택 버튼'을 드래그 해서 "푸시 알림 메시지 보내기" 라는 글자를 입력한다.

 

 

 

 

센서 항목에서 '시계'를 가져다 두고 타이머 간격은 100으로 둔다. 0.1초 간격으로 데이터를 수집하겠다는 뜻이다.

 

 미디어 항목에서는 '플레이어'를 가져다 두고 소스에는 경고 메시지를 줄 수 있는 소리의 소스를 설정한다. 

 

 연결 항목에서 '블루투스 클라이언트' 컴포넌트를 가져다 둔다. 우리는 블루투스에서 날아오는 데이터를 수신만 할 것이기 때문에 '블루투스 클라이언트' 컴포넌트만 가져 온다. 앱인벤터가 블루투스 서버로 역할을 할 때에는 "블루투스 서버" 컴포넌트도 사용할 수 있다.

 

 

 

 

푸시 알림 메시지 익스텐션은 1편에서 사용한 "NotificationStyle" 을 사용할 것이다. 

 

 디자이너 화면 구성이 끝났으면 블록 에디터로 넘어 간다.  "목록 선택 버튼1" 컴포넌트의 세부 블록에서 "afterPicking 이벤트 블록"과 "BeforePicking 이벤트 블록"을 가져다 두고 내부 블록들을 채운다. "BeforePicking 이벤트 블록" 안에 들어가는 "set 목록 선택 버튼1.Elements to" 블록이 주변에서 신호가 잡히는 블루투스 모듈을 리스트 형식으로 보여 주는 블록이고 "AfterPicking 이벤트 블록" 안에 들어 있는 "set 목록 선택 버튼1.Selection to" 블록이 아두이노 보드에서 사용하는 HC-06 블루투스 모듈을 선택 할 수 있게 해 주는 블록이다.

 

 해당하는 블록들을 잘 확인해서 끼워 넣는다.

 

 

 

 

 보라색의 블록은 블루투스 클라이언트 컴포넌트에 있는 블록이다. 목록 선택 버튼에서 선택하는 HC-06 블루투스 모듈을 블루투스 클라이언트에 연결해 준다. 

 

 시계 컴포넌트를 선택해서 "언제 Clock1. 타이머가 작동할때" 이벤트 블록을 가져다 둔다. 그 안에는 '공통 블록'의 "제어" 안에 들어 있는 "만약 이라면 실행" 제어 블록을 두개 배치한다. 바깥 제어 블록은 블루투스가 연결 되어 있는지 아닌지 판단하는 블록이고 안쪽 블록은 블루투스가 연결되었을때 실행되는 내용을 코딩한다.

 

 블루투스 클라이언트 컴포넌트에서 "블루투스 클라이언트1. isConnected" 블록을 꺼내서 바깥에 있는 "만약 이라면 실행" 블록에 끼워 넣는다. 블루투스가 연결되었는지 판단하는 부분이다. 

 

 

 

 

 "NotificationStyle" 익스텐션 컴포넌트에서 "call NotificationStyle1.BigPictureNotification"을 블록을 꺼내서 아래와 같은 블록을 구성한다. 이 블록이  가장 핵심적인 블록으로 여기에서 보내고 싶은 알림 메시지, 블루투스 데이터 표시, 아이콘 그림 표시 등과 같은 설정을 한다. title에는 주제, subtitle에는 보내고 푸시 알림 메시지 또는 나타내고 싶은 데이터를, largeIcon에는 이 주제를 나타내는 아이콘등을 세팅한다.  

 

  나머지 블록들도 잘 확인해서 끼워 넣는다. 여기에도 일반 알림 메시지와 소리, 진동 블록들도 같이 코딩했다.

 

 

 앱인벤트를 빌드 한 후 필자의 스마트폰에 설치된 이 앱의  초기 화면이다. "푸시 알림 메시지 보내기" 목록 선택 버튼을 클릭해 보자. 

 

 

 

 

 신호가 잡히는 블루투스 목록이나 예전에 사용했던 것들이 리스트 형식으로 나타난다. "HC-06"을 선택해 준다.

 

 곧바로 요란한 소리, 진동과 함께 일반 알림 메시지 그리고 푸시 알림 메시지가 계속 도착한다.

 

 푸시 알림 메시지에 "sun rise"와 "sun down" 메시지가 나타난다. 방안에서 실험하고 있기 때문에 조도 센서의 값이 500 이하로 내려 갈 때도 있어 가끔씩 "sun down" 메시지도 나타난다.

 

 

 푸시 알림 메시지는 4~5초 정도 지나면 스마트폰 화면에서 사라진다. 그러나 이 푸시 알림 메시지는 완전히 사라지지 않고 남아있다. 스마트폰 상단에 손가락을 갖다 대고 아래로 제스처를 취하면 알림 화면이 나타나는데 시간이 지난 후에도 여기에서 푸시 알림 메시지를 확인 할 수 있다.

 

 이번 시간에는 앱인벤터2 고급 강좌 2번째 시간으로  앱인벤터, 아두이노 보드, 블루투스 모듈, 광전자 센서를 이용해 스마트폰에 푸시 알림 메시지를 보내는 방법을 알아보았다. 이 방식은 IoT나 데이터 수집, 경보 등등 수많은 곳에 직접 쓰일 수 있는 아주  실용적인 내용 이므로 잘 알아두고 긴요하고 사용하길 바란다.