Android(スマホ)からサーボモータを制御|スマホアプリ編

Pocket

Arduino&サーボ

 以前、スマホ(Android)アプリからサーボモータをコントロールする記事を紹介したのですが、スマホアプリの作り方を紹介してほしいと少し要望がありましたので、今回はスマホアプリ作成の内容をメインに紹介したいと思います。

 

Arduino側スケッチはこちらで紹介しています。

Android(スマホ)からサーボモータを制御|Arduinoスケッチ編

 

概要

 制作物の概要ですが、スマホからのデータをBluetoothLE(以下BLE)経由で送信。Arduino/Genuino101の内蔵BLEでデータ受信、そのままArduinoからサーボモータを制御します。

 

▼動画です▼

 使い廻しの動画ですみません。準備するものはArduino101、サーボモータ、スマホとPC(開発環境)です。スマホはBLEに対応している必要があります。

 

アプリ開発環境

 今回のスマホアプリは、「Mit App Inventor 2」を使用して作成します。BLEを使用するには、①BLEコンポーネントに対応したサイトURLを使用する。②通常のサイトURLで、Extensionをダウンロードして、別途BLEコンポーネントをアップロードして使用。のどちらかになります。(2016/9/24時点)(Mit App Inventor 2のBLE対応についてはこちらで少し解説してます)

 

 今回は①の方法を使用します。BLEコンポーネントを使用できるURLは「http://ble-test.appinventor.mit.edu」になります。このURLではBLEコンポーネントが使用できるようになってます。それ以外のコンポーネントは通常の使い方と同じかと思います。(2016/9/24時点)

 

 以下から具体的な内容を解説します。「Mit App Inventor 2」自体の使い方はいろいろなサイトで解説されているのでここでは細かく触れません。(以下からの画像はクリックすると拡大します)

 

作成するアプリの概要

 スマホ側をセントラルとして、アドバタイジングされたペリフェラル(Arduino+サーボモータ)を見つけ出し接続します。スマホ側からサーボモータ位置情報を送信、Arduino側の情報(ループ処理速度)を受信してリアルタイムで表示するというものです。

 

▼アプリ画面はこんな感じです▼

 見たままです。画面上部でスワイプ(画面に触れ、その指先をスライドさせる)または、「-30」「0」「-30」角度のボタンタップでサーボモータを制御します。スワイプやボタンタップに連動して上の絵(ダイヤルみたいなの)が回転します。

 

 その下はデバック目的のテキスト表示です。

・status      ー> Arduinoとの通信接続状態
・device     ー> BLE機器の探索状況。「serching」は検索中。BLE機器を発見すると「found」と表示を変えてます。
・period     ー> Arduino側の動作周期。
・freqency ー> Arduino側の動作周波数。
・position  ー> サーボモータの位置。

 

 最下段の「Connect」「Disconnect」ボタンはBLE接続と切断のボタンです。では早速アプリを作っていきたいと思います。

 

コンポーネントを配置

 コンポーネントを配置していきます。

 

▼まず画面上部▼

 「Screen1」については特に必要なプロパティは無いため好み(色や名前など)で設定します。次に「Canvas1」を配置してその中に「ImageSprite1」を配置します。ここも必要なプロパティ設定は無いです。好みで設定します。ここでは「ImageSprite1」の「Picture」プロパティにダイヤルのような絵のイメージを設定してます。ちなみにこの絵はExcelで準備しました。Excelの図形で割と簡単にこういったイメージ作成が可能です。

 

 次に「+30」「0」「ー30」角度指定の「Button」の配置です。ここでは水平に並べるため、上のツリーのように「HorizontalArrangemet」の下にボタンを配置してます。間に配置している「Label」はダミーです。ボタンの間を空けるためだけに空の「Label」を配置してます。「Button」のプロパティはとくに設定の必要は無いです。好みで設定します。「Button」は何個も出てくるためわかり易い名前に「Rename」しておきます。

 

▼次にテキスト表示部の配置▼

 コンポーネントツリーのままですが「HorizontalArrangemet」を5列分準備して、その中に「Label」を並列に配置していきます。表示内容が固定されている「Label」と受信した内容や状況で表示が変わる「Label」は分けてそれぞれで配置しておきます。それぞれコンポーネントプロパティの「text」欄は初期に表示させたい文字列もしくは数値を入力しておきます。それ以外のプロパティは好みで設定します。

 

 また、受信した内容や状態で表示が変わる「Label」にはわかり易い名前に「Rename」しておきます。

 

▼「Connnect」「Disconnect」ボタンと「Non-visible」の配置です▼

 ボタンは「HorizontalArrangemet」で並列に配置しています。このボタンはBLE機器への接続/切断に使用します。「Connect」ボタンは「ListPicker」コンポーネントを配置。「Disconnnect」ボタンは「Button」コンポーネントを配置します。

 

 ともにプロパティは好みで設定、わかり易い名前に「Rename」しておきます。

 

 ついでに「BluetoothLE」と「Clock」のコンポーネントを配置しておきます。「BluetoothLE」コンポーネントにはプロパティは無いです。「Clock」コンポーネントのプロパティで「TimerInterval」の欄に「1000」を設定しておきます。1秒置きに呼び出される設定です。名前はわかり易い名前に「Rename」しておきます。「Clock」コンポーネントはBLE受信に使用します。1秒おきに受信データが無いかを確認するためのものです。

 

 これで一通りのコンポーネントの配置は完了です。上記は一例ですので、好みなデザインで配置してもO.Kです。

 

ブロックプログラミング

 続いてブロックプログラミングを行います。はじめにに変数を準備します。

 

▼変数定義▼

 「BLEDevice」は見つけたペリフェラル機器のマックアドレスを格納するための変数です。「buf」は受信する情報を格納しておく変数。ともに文字列の空欄を初期値としてます。

 

「servoPosition」は画面をスワイプしたときの移動量(角度)を格納しておく変数。「lastPosition」は一つ前の位置情報(角度)を格納しておく変数です。ともに数値の「0」を初期値としています。

<スポンサーリンク>

 

 次にアプリを起動時に呼ばれるブロックを定義します。

 

▼アプリ起動時▼

 まず最初に「Label」コンポーネントのテキストに文字列を入れます。status に ”not connect” を device に ”serching…..” を入れておきます。アプリ起動時はまだBLE機器にしていないため、「未接続」「機器を検索中」と、このような表示にしてます。確か日本語表示もできるようになったのかな?試していないのでわかりません。

 

 もう一つ、「BluetoothLE」コンポーネントの.StartScanningを入れておきます。スマホからArduino(ペリフェラル機器)のスキャンを開始します。

 

▼BLE機器を見つけたとき▼

 「.DeviceFound」はアドバタイジングされたペリフェラル機器を見つけたら呼び出される関数です。機器を見つけたらBLE機器の一覧をListPickerへ格納。「Label」の device に “found”と表示させます。その後、BLE機器のスキャンを停止しています。

 

▼BLE機器と接続する▼

 「Connect」ボタン(ListPicker)がタップされて、BLE機器の一覧表示、その後選択されたBLE機器との接続を行う動作です。選択された機器のマックアドレスを取得して、変数「BLEDevice」へ格納します。BLEデバイスの最初の17文字がマックアドレスになります。

 

 「.ConnnectWithAddress」へ接続する機器のマックアドレスを渡します。「Label」の status に ”connecting….” と表示、 device にマックアドレスを表示させます。

 

▼接続完了▼

 BLE接続されたら呼ばれる関数です。接続がされたら status に ”connected” と表示させてます。

 

▼接続中のBLE機器を切断する▼

 接続のときと逆ですね。マックアドレスから機器を切断。Labelに上記のテキストを表示させてます。最後にBLE機器のスキャンを開始してます。

 

 これでBLE接続/切断は完了です。続いてBLE送信の部分をプログラミングしていきます。

 

 送信するデータはサーボモータの回転量(角度)です。スワイプしたときや、角度ボタンをタップするたびにデータ送信を行うため、送信部分は関数で準備しておきます。

 

▼BLE送信部の関数▼

 関数名は「sendBLE」としています。サーボーモータの角度(-90~90)を送信するだけなので型はint型を使用してます。Arduino側(ペリフェラル側)で設定している「service_UUID」と「characteristic_UUID」を入れておきます。送信するデータには変数の「servoPosition」を入れておきます。「offset」は0です。

 

 今回、送信用(サーボモータ位置データ)と受信用(Arduino動作周波数データ)の2つの「characteristic」をArduino側では定義しています。

 

▼画面スワイプ時の動作▼

 画面をドラッグ(スワイプ)した時に呼ばれる関数です。現在の位置にスワイプ量を足して、数値を丸めて変数「servoPosition」へ格納してます。その後 -90<servoPosition<90になるように「IF」文で切り取ってます。

 

 「.Heading」でイメージを回転させて、Labelのテキストで現在のサーボモータ位置を表示させます。最後にBLE送信の関数を呼び出します。

 

▼タッチアップ時の動作▼

 指を画面から離した時に呼ばれる関数です。現在のサーボモータ位置を変数「lastPosition」へ格納して、BLE送信の関数を呼び出します。

 

▼「-30」「0」「30」度のボタンがタップされた時▼

 この画像は「-30」ボタンがタップされた時です。「servoPosition」を-30してから、「IF」文で-90以下にならないようにしてます。その後、サーボモータ位置に合わせてイメージを回転させて、テキスト表示してます。最後にBLE送信です。

 

 「30」「0」のボタンも要領は同じなので画像は割愛します。これで送信系は完了です。続いてBLE受信側です。

 

▼データ受信▼

 「timer」を使って定期的に「characteristic」を読みに行きます。「IF」文を使って、BLEが接続状態あれば読みに行きます。Arduino側(ペリフェラル側)で定義している「service」と「characteristic」のそれぞれのUUIDを指定します。

 

 受信はstring型で行ってます。意味はありません。string型を試したかっただけです。Arduino側からはArduinoソースのループ時間を送信しています。これも意味はありません。何か送信したかったのですが、いいものが無かったもので・・・・。

 

▼受信データの読込▼

 データが読み込まれた時に呼び出されます。受信データはローカル変数へ格納されますので受信した型に合わせて使用します。受信データをいったん変数「buf」へ格納して「Label」テキストへ表示させてます。受信した周期の逆数を取って周波数もテキスト表示させてます。

 

 これでブロックプログラミングも終了。最後に「.apk」へ出力してスマホへインストールすれば完了となります。Arduino(スケッチ)とサーボモータを準備すれば記事冒頭の動画のようにBLE無線を使用してスマホからサーボモータを制御できると思います。

 

 MIT APP Inventor2を使用すればほとんどBLEの知識が無くても比較的簡単にこういったアプリ作成が可能です。またArduino101の内蔵BLEを使用するのもライブラリが準備されているため、同様にほとんどBLEの知識が無くてもスケッチが割と簡単に書けます。そこそこ簡単に無線を使って遊ぶことができると思います。

 

 

Pocket

<スポンサーリンク>


この投稿へのコメント

  1. 匿名希望 said on 2017-05-14 at 19:16

    こんなに詳しく解説してくれてありがとうございます。
    これからも頑張ってください。

  2. 匿名希望 said on 2017-05-14 at 22:59

    この記事を参考にして、アプリを作成して、bluetoothの接続まではできたのですが、
    サーボモーターを動かすプログラムの作り方が分かりません。
    もしよろしければ、この記事のようにサーボモーターを動かすアプリの作り方を教えてくれませんか。
    この前の記事のプログラムも参考にしたのですが分かりませんでした。
    お手数をおかけしますが、お願いします。

    • imo said on 2017-05-15 at 06:10

      スマホ側のプログラムはこの記事内容で全てです。Arduino側スケッチ(プログラム)のことでしょうか?

  3. 匿名希望 said on 2017-05-15 at 23:12

    詳しく書かなくてすみません。
    arduinoのプログラムのことです。
    よければ教えてください。
    お願いします。

  4. 匿名 said on 2017-08-18 at 16:28

    とても分かりやすくて参考になりました。助かりました。ありがとうございます。
    App Inventor 2が正式にBLEに対応したようですね。
    http://iot.appinventor.mit.edu/#/

  5. 匿名 said on 2017-11-30 at 15:28

    「http://ble-test.appinventor.mit.edu」このURLからApp Inventor 2でアプリを作ろうとしていたら
    Server error: could not save one or more files. Please try again later!とエラー文が上の方に出て保存することが出来ません。お手数でなければ解決方法を教えていただけないでしょうか?…

    • imo said on 2017-11-30 at 16:33

      匿名さん、こんにちは。
      久しくMIT.inventor2を使っていなかったのですが・・・。確かに私のアカウントでも同様のエラーが発生しますね。
      もともとこのURLが試行版である可能性が高いため、MIT側のエラーかもしれません。解決方法は不明です。
      このURLではエラーが出なかったのでこちらで試してみてはどうでしょうか。
      http://ai2.appinventor.mit.edu

      • 匿名 said on 2017-12-01 at 20:07

        上記のURLからはエラーがでなく無事に始める事ができました!
        アプリで質問なのですがBLEの送信部のブロック図がimoさんと同じブロック図が出てきません…、これはmitがアップデートなどの問題で消えてしまったりしているのでしょうか?

        • imo said on 2017-12-01 at 23:14

          紹介したURLからではデフォルトではBLEコンポーネントが無いです(従来のBluetooth規格のものはあります)。BLE規格を使用するのであれば別途ここから
          http://appinventor.mit.edu/extensions/
          「BluetoothLE.aix」をダウンロードします。
          そして、Inventor2の開発画面「Pallete」の一番したにある「Extension」からダウンロードした.aixをインポートします。そうすればBluetoothLEのコンポーネントが使えるようになると思います。
          ただ随分長いことinventor2を使っていなかったため、この方法で問題ないかどうかはご自身で確かめて下さい。
          過去に試したときはスマホへのインストール後の動きが少しおかしかったような覚えがあります。

          • 匿名 said on 2017-12-02 at 14:44

            丁寧に説明頂いてありがとうございます!時間が出来た時に早速試してみます!

コメントを残す

メールアドレスが公開されることはありません。

この投稿へのトラックバック

トラックバックはありません。

トラックバック URL