2016년 11월 14일 월요일

Simblee BLE module

아두이노 등으로 작품을 만들 때 가장 골치아픈 부분중에 하나가 블루투스 통신이다.  블루투스 통신  뿐  아니고 스마트폰으로 무언가를 제어하거나 센서 값을 화면에 표시하려면 아두이노쪽 코드 뿐 아니고 안드로이드 또는 iOS  앱을 따로 만들어 줘야만 한다.
하지만 simblee는 이 문제를 다른 방법으로 접근해 간단하게 해결했다.

디바이스 코드 뿐 아니고 스마트폰에 표시될 UI  관련 코드까지 아두이노 UI에서 한번애  다 작성할 수 있게 만들어 버렸다.  즉 스마트폰 화면에 표시할 UI를 simblee에서 직접 보내주고,  스마트폰에서 이벤트가 발생(버튼 클릭 등)하면 그 이벤트에 대한 처리 코드 역시 simblee에 들어있다.



스마트폰은 일종의 웹 브라우져같이  동작해  스마트폰에서 Simblee for mobile앱을 실행시켜 놓으면 웹서버(즉 여기서는 simblee)에서 웹페이지 내용(여기서는 UI  화면)을 받아 화면에 표시해주고 사용자가 버튼이나 링크를 클릭하는 등의 이벤트가 생기면 웹 서버(여기서는 simblee)에 그 이벤트를 전달해 정해진 동작을 처리하게 한다.

그래서 아두이노 스케치에는 기본적으로 setup(), loop() 이렇게 두개의 함수가 있어야만 하는데 simblee  앱에서는 setup(), loop() 외에 추가로 ui(), ui_event() 함수가 있어야 한다.  Simblee는  자신의 정보를 advertise하고 있다가 스마트폰의 Simblee  for  mobile  앱과 연결되면 ui()  자동으로 ui()  함수가 실행되게 된다.  ui()  함수에서 아래와 같이 스마트폰 화면에 표시될 ui  정보를 보내주게 된다.

void ui()
{
  SimbleeForMobile.beginScreen(WHITE,PORTRAIT);
  SimbleeForMobile.drawSwitch(135, 100);
  SimbleeForMobile.endScreen();
}

UI  정보가 스마트폰으로 전송되면 스마트폰 앱 화면에 다음과 같이 수신된 UI가 표시된다.


사용자가 스위치를 토글하면 이벤트가 발생되어 그 이벤트 정보가 simblee로 전달된다.  Simblee는 이벤트를 받으면 자동으로 ui_event()  함수를 호출해 이벤트에 대한 처리를 수행하게 된다.

#include <SimbleeForMobile.h>

uint_8 switch;

void setup()
{
  Serial.begin(9600);
  SimbleeForMobile.deviceName = "Switch";  // SimbleeForMobile  앱에서 'Switch'라는 이름으로 검색됨
  SimbleeForMobile.begin();
}

void loop()
{
    SimbleeForMobile.process();
}

void ui()
{
  SimbleeForMobile.beginScreen(WHITE, PORTRAIT);
  switch = SimbleeForMobile.drawSwitch(135,100);
  SimbleeForMobile.endScreen();
}


void ui_event(event_t &event)
{
  if (event.id == switch) {
    Serial.println(event.value);
  }
}

위의 코드를 Simblee에 다운로드 하고 스마트폰에서 SimbleeForMobile앱을 실행해 'switch'라는 이름의디바이스를 선택하면 위와 같은 화면이 나오고 스위치를 토글하면 아래와 같이 시리얼 포트로 값이 변화하는걸  볼 수 있다.


 좌표계는 아래  그림처럼 좌측 상단이 (0, 0)이 된다.


 Simblee에 연결되는 디바이스마다 화면 크기는 달라진다.  아이폰 5의 경우 폭은 320픽셀,  높이는 570픽셀이 된다.  각 디바이스의 화면 크기는 스마트폰에 연결되면 SimbleeForMobile.screenWidth 과 SimbleeForMobile.screenHeight 에 자동으로 값이 설정된다.




댓글 없음:

댓글 쓰기