BlynkアプリでSPRESENSEをリモートコントロールする

Blynkアプリを使ってデバイスコントロールに挑戦しました。スマホからボードを制御したりボードの情報をスマホに送ったりと簡単に自作IoTを実現することができます。そんなに凝ったことをしなければ無料で遊べます。

# Blynk アプリの導入

Blynk をご存知ない方のために本家サイトはこちらです。
https://blynk.io/

AndroidやiOS用のスマホアプリが用意されていて、デバイスもArduino、ESP、RaspberryPiなど各種ボード(400以上)に対応しています。デバイスとの接続方法も、WiFi, Ethernet, Cellular(GSM, LTE), Serial, USB, Bluetoothと多種多様です。

[BlynkのCommunitiyサイト](https://community.blynk.cc/t/sony-spresense/31174
)にこんなやり取りを見つけました。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/efb5ae59-2a5e-dd17-de00-4c40fc8407c8.png" width="75%">

Spresenseボードはまだサポートされていないけど、オープンソースだからコントリビューションはウェルカムだよとのこと。前回、[SPRESENSEでArduino Ethernetライブラリを動かしてみた](https://qiita.com/baggio/items/650eeb2a80875afed07e)ので、SpresenseボードをEthernetで接続してBlynkアプリでコントロールしてみたいと思います。用意されたまま使うよりも、移植してみたりハマったりした方が理解が深まると思うので（持論）、敢えて茨の道を進んでいきます。

## Blynk アプリのインストール手順

iOSを使った手順ですが、Androidでも特に変わらないと思います。

|手順||
|---|---|
|"blynk"を検索してアプリをインストールします。|<img width="375" alt="install.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/fbb43197-fe43-7fec-26c4-d7fe55971a3d.png">|
|初めて使用する場合は、"Create New Account"でアカウントを作成します。|<img width="375" alt="login.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/b0797ee1-7e01-d07d-7abe-9610ac4faf3d.png">|
|"Email"と"Password"を入力します。<br><br>登録したEmail宛に"Auth Token"が送られてきます。このトークンは後でプログラムに入れて使います。|<img width="375" alt="new_account.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/31beb738-e600-fac3-9232-4e1be6796b34.png">|

## Blynk アプリの使い方

|手順||
|---|---|
|"New Project"を作成します。<br>ここでは"test"という名前で<br>デバイスは"Arduino UNO"、<br>CONNECTION TYPEは"Ethernet"<br>を選択します。|<img width="375" alt="new_project.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/c236be39-43b7-9c41-31e5-9aef56029b6a.png">|
|キャンバスが現れます。<br>ここのキャンバスをクリックすると"Widget Box"が現れます。|<img width="375" alt="test.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/5fdfe484-fcca-adca-ad13-17f20322994d.png">|
|色々なWidgetが用意されています。<br>"YOUR ENERGY BALANCE"として初期状態で2000ポイントが与えられています。つまり2000ポイント以内であれば無料でWidgetを組み合わせて使うことができます。|<img width="375" alt="widget_box.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/a65981ff-6aa5-9da8-564b-edec2b0b9f91.png">|
|例えば、"Button" Widgetの場合、<br>"PIN"をクリックして使用するピンを選びます。"Digital", "Analog"など物理的なピン番号の他に、"Virtual" という仮想的なピン番号を選ぶこともできます。仮想的なピン番号はこの後で出てくるプログラミングと合わせて使用します。|<img width="375" alt="button_settings.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/ca6dd0a7-a4ba-6269-b620-c8b996d21a97.png">|
|例えば、"LED" Widgetの場合、<br>"PIN"をクリックして使用するピンを選びます。ここでは"Virtual"ピンのみを選ぶことができます。<br><br>なんとなく"Button"と"LED"のOUTPUT/INPUTの表示が逆になっているように思うかもしれませんが、"Button"の場合はBlynkアプリでボタンを押したという信号をデバイス側に出力するのでOUTPUT、"LED"の場合はデバイスからの信号を入力してスマホ上のLEDを光らせるので"INPUT"になります。|<img width="375" alt="led_settings.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/3a935c92-ca9c-16c9-3779-6919d6a56326.png">|
|2000ポイントで足りなくなったら"Energy Pack"を追加購入することもできます。|<img width="375" alt="energy_store.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/1df6758f-3b7b-b158-f1cd-228994cac86a.png">|

# デバイス側のプログラミング

Blynkライブラリはこちらにあります。
https://github.com/blynkkk/blynk-library

Arduinoライブラリマネージャからインストールすることもできますが、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/0550cc7e-8435-c96b-a3d1-b8794ebc2948.png)

私はソースコードを編集して使いたいので（構成管理したい）ので、Arduino の libraries フォルダ以下に git clone します(以下はLinuxでの例です)。

```console
$ cd ~/Arduino/libraries
$ git clone https://github.com/blynkkk/blynk-library
```

blynk-libraryですが、とにかく設計/ソースコードが綺麗です。
色々なサンプルコードが用意されているのですが、ここを眺めてみるのが一番理解が深まると思います。
https://examples.blynk.cc/?board=Arduino%20Uno&shield=Ethernet%20Shield%20W5100&example=GettingStarted%2FBlynkBlink

## Arduino_Ethernet スケッチサンプル

`Blynk`->`Boards_Ethernet`->`Arduino_Ethernet`のスケッチを開きます。
~/Arduino/libraries/blynk-library/examples/Boards_Ethernet/Arduino_Ethernet/Arduino_Ethernet.ino

プログラム中の"YourAuthToken"のところをメールで送られてきたTokenに置き換えます。

```c++:Arduino_Ethernet.ino
// You should get Auth Token in the Blynk App.
// Go to the Project Settings (nut icon).
char auth[] = "YourAuthToken"; // <=== 置き換える
```

ビルドするにはEthernetライブラリが必要です。こちらを参考にしてください。
[SPRESENSEでArduino Ethernetライブラリを動かしてみた](https://qiita.com/baggio/items/650eeb2a80875afed07e)

analogRead()のピン番号がArduino UNOベースになっているので、Spresense用に次のように変更します。

```diff
diff --git a/src/BlynkApiArduino.h b/src/BlynkApiArduino.h
index f0b2f8d..8e1231b 100644
--- a/src/BlynkApiArduino.h
+++ b/src/BlynkApiArduino.h
@@ -156,7 +156,7 @@ void BlynkApi<Proto>::processCmd(const void* buff, size_t len)
         BlynkParam rsp(mem, 0, sizeof(mem));
         rsp.add("aw");
         rsp.add(pin);
-        rsp.add(analogRead(pin));
+        rsp.add(analogRead(A0 + pin - 14));
         static_cast<Proto*>(this)->sendCmd(BLYNK_CMD_HARDWARE, 0, rsp.getBuffer(), rsp.getLength()-1);
     } break;
```

ビルドして動かしてみます。ネットワークへの接続に成功すると以下のようなログが表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/89bd5dc7-73b8-7d86-57df-c217c0e4a490.png)

## Blinkyアプリ

動作確認用にシンプルなBlynkアプリとして、次のようなWidgetを使いました。

"GAUGE" Widgetを二つ用意して、A0 と A1 をモニタします。

- PIN: Analog A0
- PIN: Analog A1

"BUTTON" Widgetを二つ用意して、D2, D3 に接続します。

- PIN: Digital D2
- PIN: Digital D3

<img width="375" alt="test1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/d9c32027-4a12-1f4f-3a18-945704f1c14b.png">

アプリの右上の ▷ 再生ボタンを押すとデバイスに接続します。

<img width="375" alt="test-exec.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/1261af21-a15d-ad98-1331-f240c6e63fc6.png"> <img width="375" alt="connect.jpg" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/432852/da526b08-1b4a-805f-d609-01abe6c9c3a9.jpeg">

"GAUGE"にA0, A1 から読み取ったアナログ値が表示されており、リアルタイムに更新されます。

D2<->D3 間に LED をつないで、(D2,D3)=(OFF,ON) にすることで LED が点灯、(D2,D3)=(OFF,OFF) にして LED が消灯します。

# さいごに

Widgetは他にもたくさんあります。

"Music Player" Widgetを使って Spresense の Audio Playder につなげる、とか、"Map" Widget を使って Spresense の GPS 情報をスマホで見る、といったことが可能です（たぶん）。このあたりは後日チャレンジして機会があれば作品をアップしようと思います。