M5Stackの傾斜計と3D表示するスマホアプリの作成


はじめに

  • M5Stackについて
    • ESP-32(WiFiとBluetoothが搭載された低価格マイコン)が搭載されたユニットで、QVGAのLCDやMicroSDカードスロットもあり、30ピンコネクタのスタックなど、拡張性までよく考えられた製品です。
    • ESP-WROOM-32の価格(700円くらい)を知って、これベースのモノを作ってみようと色々と実験してたんですが、M5Stackに同じマイコンが載っていることは後で知りました。

完成状態

  • youtubeにアップロードしてます。

IMAGE ALT TEXT HERE

  • ソースは、GitHub(Angle3DMonitor)で公開しています。

M5Stackの傾斜計

  • いわゆる水準器をイメージして作りました。
  • M5Stack GrayにはMPU9250(9軸センサー)が搭載されているので、コレ単体でできました。
  • M5Stackのサンプルはかなり参考になりました。(結構、コピペしてます)

    • バグかな?と思うところが1箇所あったので、そこは修正しました。
    オリジナル
    MahonyQuaternionUpdate(IMU.ax, IMU.ay, IMU.az, IMU.gx*DEG_TO_RAD,
                         IMU.gy*DEG_TO_RAD, IMU.gz*DEG_TO_RAD, IMU.my,
                         IMU.mx, IMU.mz, IMU.deltat);
    
    修正版
    MahonyQuaternionUpdate(IMU.ax, IMU.ay, IMU.az, IMU.gx*DEG_TO_RAD,
                         IMU.gy*DEG_TO_RAD, IMU.gz*DEG_TO_RAD, IMU.mx,
                         IMU.my, IMU.mz, IMU.deltat);
    
  • BLE通信部分は、こちらのサンプルを参考に(というか、コレも結構コピペ)しました。


スマートフォンでの3D表示

  • BLE接続されたM5Stackから送られてくる加速度センサー値をもとに、X方向とY方向の傾斜を算出しています。
  • 円筒型のオブジェクトを3D表示していますが、OSSライブラリのUrhoSharp.Formsを使っています。
    • FormsSampleを参考にしています。
    • これの座標系は、まだよくわかってないです。座標値をプログラムに設定して表示させてみて・・・とカットアンドトライしました。
  • BLE通信部分は、OSSライブラリのPlugin.BLEを使っています。
  • Xamarin.Formsについて
    • AndroidとiOSでコードを共通化できますが、ポータブルクラスライブラリ(PCL)と共有ライブラリの2種類があります。
    • Visual Studio Community 2017 for Macを使用していますが、新しいプロジェクト作成で「フォームアプリ」で進めると、共有プロジェクトの方でできてしまいます。
    • ポータブルクラスライブラリの方で作成したい場合、「空白フォームのアプリ」で進める必要があるところは、ちょっとハマりました。