スマホからボタン操作して日常の記録を取る【M5StackとBlynk連携】
使い始めるとハマってしまうガジェットM5Stack。。。毎日楽しく使い道を探しています。ふと、以前から作りたかったスマホから操作して日常の記録を取るシステムが思い浮かんだので実際に作ってみました。M5StackとBlynkというアプリを使うと簡単にシステムを作ることができます。
もくじ(Index)M5Stack関連の目次へ戻る
用意するもの
ハードウェア
①M5Stack
M5Stackを１台用意します。
②スケッチを書き込めるPC
今回はBlynkというスマホアプリを利用するのですが、M5Stack側にAuth Tokenという文字列やWiFi設定するためスケッチをコンパイルする必要があります。Windows,Mac,LinuxなどArduinoIDEが使えるPCを用意しましょう。
ソフトウェア
①ArduinoIDE（母艦PC）
WindowsでArduinoIDEを使うには下記の記事を見てください。
初心者向けM5Stackの始め方（ArduinoIDE編）②LovyanLauncher
このアプリはM5Stack LovyanLauncher対応です。詳しくは下記の記事を参照してください。LovyanLauncherを使って切り替えるとSDカードのCSVデータをFTPで転送できるので便利です。
初心者向けM5Stackの始め方（M5Burner/LovyanLauncher編）M5Stack LovyanLauncherの使い方
③ArduinoIDE追加ライブラリ
コンパイルするために下記のライブラリが必要です。
「スケッチ」→「ライブラリをインクルード」→「ライブラリの管理」で追加してください。
④スケッチ
GitHubで公開しています。BlynkEventLoggerというフォルダをスケッチがある場所へコピーしてください。
https://github.com/mongonta0716/M5Stack-BlynkEventLogger
スマホアプリで画面を作る
アプリのインストール
スマホまたはタブレットにBlynkというアプリをインストールします。
Blynkアカウントの作成
Blynkを初めて利用する際は、アカウントの登録が必要です。メールアドレスと任意のパスワードを用意して登録しましょう。
プロジェクトの作成
プロジェクト名は、自分で決めて入力します。「CHOOSE DEVICE」と「CONNECTION TYPE」はそれぞれ下記の値を選びます。
- ESP32 Dev Board
- WiFi
テーマ（THEME）はDARKかLIGHT好きな方を選びます。
プロジェクトの作成が完了すると登録したメールアドレスに「Auth Token」という後で必要になる文字列が書かれたメールが送付されます。
部品の配置
画面をタップすると右から部品の一覧（Widget Box）が表示されます。その中からButtonを３つ（200×3=600 energy）、LCDを２つ(400×2=800 energy)配置します。合計1,400energyなので初期の無料分には収まります。（2019/4現在）
- ボタン OUTPUTにVirtual V3～V5をそれぞれ割り当てる。
- LCD ADVANCEDにして、INPUTにVirtual V1とV2をそれぞれ割り当てる。
★ボタンは「Styled Button」でも大丈夫です。
ボタンの設定
V3（初期表示はPIN）の部分をタップしてVirtualのV3～V5を割り当てます。
LCDの設定
LCDはまず「ADVANCED」を選択して、V2（初期表示はPIN）の部分をタップして、VirtualのV1,V2を選択します。
Energyについて
Blynkは新規登録の場合2,000 Energy分の無料枠があります。配置した部品の合計がそれを超えた場合は有料で課金する必要があります。（Widget Boxの「+Add」ボタンを押すと課金の画面に移ります。）
★１．部品を削除した場合は、その分のEnergyは戻ります。
★２．Generate Link（1,000 Energy）だけは戻らないので注意
GenerateLinkとは作成したプロジェクトを他の人と共有する機能です。
スケッチをコンパイル
書き換え
以下の２点を自分で書き換えます。
①Auth TokenとWiFi設定
自分の環境に合わせてWiFi設定値を書き換えます。また、プロジェクト作成時にメールで送付されたAuth Tokenの部分も書き換えてください。
// You should get Auth Token in the Blynk App.
// Go to the Project Settings (nut icon).
char auth[] = "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX";
// Your WiFi credentials.
// Set password to "" for open networks.
char ssid[] = "XXXXXXXXXXXXXXXXXXXX";
char pass[] = "XXXXXXXXXXXXXXXXXXXX";②ログの設定
ファイル名やボタンに対応したCSVに記録するイベントの名称を変えることができます。イベント名は日本語可です。
// Logger Settings
File file;
const char* fname = "/event_log.csv";
const String title = "Event";
// { V3 pin, V4 pin, V5 pin }'s eventName
char *eventName[] = { "event1", "event2", "event3" };スケッチの書き込み
スケッチの書き換えが完了したら、M5Stackに書き込みます。（バイナリファイルを作成してSDカードにコピーしてLovyanLauncherから呼び出す方法でも可。）
実際に操作してみる。
M5Stack側で「Event Recording System」と日付、時間が表示されたらスマホのプロジェクトを開始します。
V3のボタンを押すと画面に「V3：Pressed」という文字列がM5Stackの画面に表示されます。
●動作例
動画は、排泄の記録を取るために作ってみたものです。育児や介護の記録を取りたい時に使えます。Blynkはクラウド経由で繋がっているので、家に置いたM5Stackの電源が入っていれば外出先でも記録可能です。
V3にうんち、V4におしっこ、V5に訂正というイベントを設定しています。
注意事項
CSVファイルの日付時刻について
M5Stackは内部時計（RTC）を持っておらずネットに繋ぐまで正しい時刻は取得できません。そのためCSVファイルの時刻は正しく記録されません。
応用
M5StackとBlynkを組み合わせると、色々なシステムを作ることができます。今回は記録システムでしたが、M5Stackに接続したモーターを制御すれば遠隔でモーターの操作を行うこともできます。
また、簡易的なグラフもWidgetにあるので温度の監視をスマホで行うといった利用方法もあります。
おわりに
ESP32では、思いつかなかったことや難しかったこともM5Stackを利用すると簡単にできるようになりました。価格はBasicが￥4,000～という値段ですが、LCD,バッテリー、ボタン、microSDなどすぐにシステムを構築できる要素が揃っており、これからも楽しいことが思いつきそうです。興味が出たら是非使ってみてください。
初心者の方は、ゲーム等がすぐに使えるLovyanLauncherがおススメです。下記の記事を見てみてください。
初心者向けM5Stackの始め方（M5Burner/LovyanLauncher編）
