[2020] Micro:bit ゲームパッドアプリでiPhone (iPad) からラジコンカーを操作してみよう！

皆さんは micro:bit をご存知ですか？micro:bit が提供するアプリをお手持ちの iPhone (iPad) にダウンロードすると、ゲームパッドとして様々な使い方ができます。iPhone (iPad) から App Store 内で micro:bit と検索すると無償でアプリがダウンロード可能です。

ゲームパッドのアプリをインストールした iPhone (iPad) から、ブルートゥースでペアリングされた micro:bit をワイヤレスで操作できる楽しいプロジェクトを始めてみましょう！

このチュートリアルでは、アプリの設定、ブルートゥースによるペアリング、ゲームパッドの準備などを解説していきます。micro:bit で操作できるラジコンカーとして、ヴァレンタ・オフローダーを使用します。マイクロソフト社 MakeCode エディターにて作成した micro:bit サンプルコードも チュートリアル内でダウンロード可能ですので、どうぞお試しください。

このチュートリアルで解説する作り方については YouTube 動画 (英語) でも確認できますのでご参考下さい。

Supplies

micro:bit が提供するアプリをお手持ちの iPhone (iPad) にダウンロードする必要があります。お手持ちの iPhone (iPad) が micro:bit とブルートゥースでペアリングが可能か操作環境をご確認ください。micro:bit で操作できるラジコンカーとして、ヴァレンタ・オフローダーを使用します。micro:bit を1つ、単3電池を4本使用します。

ヴァレンタ・オフローダーは micro:bit で操作できるラジコンカーです。レゴ・テクニックの部品と互換性があります。後輪に2つのギアモーターがあり、車体前方にマイクロサーボを使用し、ロベルヴァル・メカニズム (機構) を用いて前輪のステアリングを操作します。

組み立て方についてはこちらのチュートリアルをご参照ください。単３電池4本を使用します。

Step 1: サンプルコードをダウンロードしましょう

このチュートリアル内では、マイクロソフト社 MakeCode エディターにて作成した micro:bit 用のサンプルコードを使用します。さっそくダウンロードしてみましょう。全てプログラミング済みですのですぐに遊べます。後のステップでサンプルコードの解説をします。サンプルコードが理解出来たら新しいコーディングに挑戦してみてください！

このステップ内にあるサンプルコード (Receiver.hex ファイル) をお手元のコンピューターにダウンロードしてください。コンピューターと micro:bit を USB ケーブルで接続してファイルをドラッグアンドドロップして書き込んでください。

サンプルコードを書き込みましたか？USB ケーブルから取り外した micro:bit をラジコンカー（ヴァレンタ・オフローダー）に搭載して車の電源を ON にしましょう！

Step 2: Micro:bit アプリを開いてみましょう

App Store 内からお手持ちの iPhone (iPad) に micro:bit アプリをダウンロード、インストールできたでしょうか？

アプリを開いたら Choose micro:bit (マイクロビットを選ぶ) ボタンを押してみましょう。

Step 3: Micro:bit とブルートゥースでペアリングしましょう

まだ micro:bit はお手持ちの iPhone (iPad) とはブルートゥースでペアリングできていません。Pair a micro:bit (マイクロビットをペアリングする) ボタンを押してみましょう。

Step 4: A、B ボタンと RESET ボタンを同時に押してみましょう

次に micro:bit のボタン A、B を押しながら裏側の RESET ボタンも同時に押し micro:bit 前面の LED が全て点灯するのを確認しましょう。その後、全てのボタンから手を離して、アプリ内の Next (次へ) ボタンを押してみましょう。

Step 5: 点灯する LED の通りに入力しましょう

micro:bit 前面の点灯している LED ドットと同様に、アプリ内に表示されているドットも一つ一つ正確にタップして入力してみましょう。その後、アプリ内の Next (次へ) ボタンを押してみましょう。

Step 6: Micro:bit とブルートゥースでペアリングを開始します

アプリ内の Next (次へ) ボタンを押してみましょう。

Step 7: Micro:bit とブルートゥースでペアリング中です、、、

もう少しでペアリングが完了します、、、

Step 8: 無事にペアリングが成功しましたか？

ペアリングが成功したら、アプリ内の OK ボタンを押してみましょう。

Step 9: ゲームパッドを設定しましょう

アプリのトップ画面に戻り Monitor and Control (モニターとコントロール) ボタンを押して、ゲームパッドを設定する画面に進みましょう。

画面下の Add + (追加) ボタンを押して、リスト内の Game Pad (ゲームパッド) を追加しましょう。

Step 10: ゲームパッドを試してみましょう

画面下の Start (開始) ボタンを押して、ラジコンカー（ヴァレンタ・オフローダー）を運転してみましょう。

ボタン A を押す -> 車が前進する

ボタン B を押す -> 車が後進する

ボタン C を押す -> 車が左折する

ボタン D を押す -> 車が右折する

Step 11: ペアリング済みの Micro:bit をアプリ内から削除する場合

このアプリ内では複数の micro:bit をペアリングして遊ぶことができます。

もし micro:bit を数多くペアリングしてしまい、後から micro:bit を削除したい場合は、アプリのトップ画面に戻り「Choose micro:bit (マイクロビットを選ぶ) 」ボタンを押して先ほどの画面に戻ります。

画面内で削除したい micro:bit を選び、ごみ箱ボタンを押して削除します。

Step 12: IPhone (iPad) 内のブルートゥース設定から Micro:bit を削除する場合

もし micro:bit を数多くペアリングしてしまい、後から micro:bit を削除したい場合は、アプリ内から削除したい micro:bit を削除するだけでなく、iPhone (iPad) 内のブルートゥース設定からも micro:bit を削除する事をお勧めします。

お手持ちの iPhone (iPad) の「設定」から「ブルートゥース」に移動し、削除したい micro:bit を選択して削除します。

Step 13: MakeCode エディターを開いてサンプルコードを確認します

では、マイクロソフト社 MakeCode エディターを開いてサンプルコード (Receiver.hex ファイル) を確認してみましょう。

ステップ１でダウンロードしたサンプルコード (Receiver.hex ファイル) をエディターから開いてみましょう。

エディター内の Import (読み込む) ボタンを押してサンプルコード (Receiver.hex ファイル) を選択しファイルを開きましょう。

Step 14: 拡張機能を追加してみましょう

サンプルコード内には、Bluetooth、Devices、Servos の拡張機能を使用しています。高度なブロックから拡張機能をクリックして、３つの拡張機能を一つ一つ追加してゆきましょう。

Bluetooth 拡張機能

Bluetooth 入出力端子サービス (bluetooth io pin service) というブロックを使用します。このブロックを通じてブルートゥースを経由して micro:bit のデジタル・アナログピンを操作できる様にします。

Devices (Bluetooth 接続機器) 拡張機能

ゲームパッドのボタン [A を押した] とき (on gamepad button [A down]) というブロックを使用します。このブロックを使用してアプリ内のゲームパッドの各ボタンの操作を設定します。

Servo (サーボモーター) 拡張機能

servo [P2] 角度範囲の設定 [0]~[180] (set servo [P2] range from [0] to [180])、servo [P2] 角度 [90] (set servo [P2] angle to 90) というブロックを使用して、車のステアリングに使われるサーボの回転角度の範囲を設定したり、サーボを特定の角度に動かす事ができる様にします。

Step 15: On Start ブロック の仕組みを学びましょう

on start ブロックはサンプルコードを起動した時に最初に一度だけ実行されます。

Bluetooth 入出力端子サービス (bluetooth io pin service) というブロックを使用します。このブロックを通じてブルートゥースを経由して micro:bit のデジタル・アナログピンを操作できる様にします。

関数 (function) のブロックを見てみましょう。新たに steer 関数 (function steer) を作成して、on start ブロック内にドラッグアンドドロップします。車のステアリングに使われるサーボの設定をする steer 関数 (function steer) を呼び出すためです。次のステップで steer 関数 (function steer) について解説します。

Step 16: Steer 関数 (function Steer) の仕組みを学びましょう

車の操舵に使うサーボの初期状態ですが、車が直進できる様にステアリングが真っすぐ向いているとは限りません。上から見ると車のステアリングが少し右か左に傾いています。

サンプルコード内にある steer 関数 (function steer) を用いてサーボ角度を調整します。車が直進できる様にステアリングを真っすぐにします。

前回のステップで steer 関数 (function steer) を作成しています。新たに center という変数 (variable) を作成します。この変数 center に車が直進できる角度、つまりステアリング用サーボの回転範囲 (0~180度) の中央となる角度 (90度) を設定します。なおサンプルコード内ではサーボ操作用に P2 ピンを使用しています。

サーボモーター拡張機能 (Servos) から、サーボ P2 の角度を 変数 center に設定する様に設定します。

ステアリングが少し左に傾いていたら、変数 center を 90 - 5 度に調整し、右に -5 度だけ修正してください。

ステアリングが少し右に傾いていたら、変数 center を 90 + 5 度に調整し、左に +5 度だけ修正してください。

Step 17: Forward 関数 (function Forward) の仕組みを学びましょう

車の進行方向と速度をどの様に設定するのでしょうか？

左後輪 (ギアモーター M1)、右後輪 (ギアモーター M2) の進行方向と速度を設定したいと思います。

関数 (function) のブロックから新たに forward 関数 (function forward) を作成します。

左後輪 (ギアモーター M1) の進行方向に P13 ピンを使用しています。入出力端子 (pins) ブロックから、デジタルで出力する端子 [P13] 値 [0] (digital write pin [P13] to [0]) を forward 関数 (function forward) 内にドラッグアンドドロップします。

右後輪 (ギアモーター M2) の進行方向に P15 ピンを使用しています。入出力端子 (pins) ブロックから、デジタルで出力する端子 [P15] 値 [0] (digital write pin [P15] to [0]) を forward 関数 (function forward) 内にドラッグアンドドロップします。

左後輪 (ギアモーター M1) の速度設定 (最大速度 1023) に P12 ピンを使用しています。入出力端子 (pins) ブロックから、アナログで出力する端子 [P12] 値 [1023] (analog write pin [P12] to [1023]) を forward 関数 (function forward) 内にドラッグアンドドロップします。

右後輪 (ギアモーター M2) の速度設定 (最大速度 1023) に P14 ピンを使用しています。入出力端子 (pins) ブロックから、アナログで出力する端子 [P14] 値 [1023] (analog write pin [P14] to [1023]) を forward 関数 (function forward) 内にドラッグアンドドロップします。

Step 18: Backward 関数 (function Backward) の仕組みを学びましょう

関数 (function) のブロックから新たに backward 関数 (function backward) を作成します。

左後輪 (ギアモーター M1) の進行方向に P12 ピンを使用しています。入出力端子 (pins) ブロックから、デジタルで出力する端子 [P12] 値 [0] (digital write pin [P12] to [0]) を backward 関数 (function backward) 内にドラッグアンドドロップします。

右後輪 (ギアモーター M2) の進行方向に P14 ピンを使用しています。入出力端子 (pins) ブロックから、デジタルで出力する端子 [P14] 値 [0] (digital write pin [P14] to [0]) を backward 関数 (function backward) 内にドラッグアンドドロップします。

左後輪 (ギアモーター M1) の速度設定 (最大速度 1023) に P13 ピンを使用しています。入出力端子 (pins) ブロックから、アナログで出力する端子 [P13] 値 [1023] (analog write pin [P13] to [1023]) を backward 関数 (function backward) 内にドラッグアンドドロップします。

右後輪 (ギアモーター M2) の速度設定 (最大速度 1023) に P15 ピンを使用しています。入出力端子 (pins) ブロックから、アナログで出力する端子 [P15] 値 [1023] (analog write pin [P15] to [1023]) を backward 関数 (function backward) 内にドラッグアンドドロップします。

Step 19: Stop 関数 (function Stop) の仕組みを学びましょう

関数 (function) のブロックから新たに stop 関数 (function stop) を作成します。

左後輪 (ギアモーター M1) の進行方向に P13 ピンを使用しています。入出力端子 (pins) ブロックから、デジタルで出力する端子 [P13] 値 [0] (digital write pin [P13] to [0]) を stop 関数 (function stop) 内にドラッグアンドドロップします。

右後輪 (ギアモーター M2) の進行方向に P15 ピンを使用しています。入出力端子 (pins) ブロックから、デジタルで出力する端子 [P15] 値 [0] (digital write pin [P15] to [0]) を stop 関数 (function stop) 内にドラッグアンドドロップします。

左後輪 (ギアモーター M1) の速度設定 (停止速度 0) に P12 ピンを使用しています。入出力端子 (pins) ブロックから、アナログで出力する端子 [P12] 値 [0] (analog write pin [P12] to [0]) を stop 関数 (function stop) 内にドラッグアンドドロップします。

右後輪 (ギアモーター M2) の速度設定 (停止速度 0) に P14 ピンを使用しています。入出力端子 (pins) ブロックから、アナログで出力する端子 [P14] 値 [0] (analog write pin [P14] to [0]) を stop 関数 (function stop) 内にドラッグアンドドロップします。

Step 20: ボタン a の動作を設定しましょう

アプリ内のゲームパッドのボタン A に動作を設定しましょう。

サンプルコード (Receiver.hex ファイル) で以下の設定をしていますのでご参考ください。

Bluetooth 接続機器 (Devices) から、ゲームパッドのボタン [ A を押した] とき (on gamepad button A down) ブロックを使用します。このブロック内に、関数 (function) ブロック内で作成した forward 関数 (function forward) をドラッグアンドドロップします。ボタン A を押すと車が前進します。

Bluetooth 接続機器 (Devices) から、ゲームパッドのボタン [ A をはなした] とき (on gamepad button A up) ブロックを使用します。このブロック内に、関数 (function) ブロック内で作成した stop 関数 (function stop) をドラッグアンドドロップします。ボタン A をはなすと車が停止します。

Step 21: ボタン B の動作を設定しましょう

アプリ内のゲームパッドのボタン B に動作を設定しましょう。

サンプルコード (Receiver.hex ファイル) で以下の設定をしていますのでご参考ください。

Bluetooth 接続機器 (Devices) から、ゲームパッドのボタン [ B を押した] とき (on gamepad button B down) ブロックを使用します。このブロック内に、関数 (function) ブロック内で作成した backward 関数 (function backward) をドラッグアンドドロップします。ボタン B を押すと車が後進します。

Bluetooth 接続機器 (Devices) から、ゲームパッドのボタン [ B をはなした] とき (on gamepad button B up) ブロックを使用します。このブロック内に、関数 (function) ブロック内で作成した stop 関数 (function stop) をドラッグアンドドロップします。ボタン B をはなすと車が停止します。

Step 22: ボタン C の動作を設定しましょう

アプリ内のゲームパッドのボタン C に動作を設定しましょう。

サンプルコード (Receiver.hex ファイル) で以下の設定をしていますのでご参考ください。

車に搭載されているステアリング用サーボは P2 ピンを使用しています。

Bluetooth 接続機器 (Devices) から、ゲームパッドのボタン [ C を押した] とき (on gamepad button C down) ブロックを使用します。サーボモーター (Servos) 拡張機能から servo [P2] 角度 [変数 center + 10度] (set servo [P2] angle to [center + 10]) をこのブロック内にドラッグアンドドロップします。ステアリング用のサーボが車の直進角度 (90度) から +10度 だけ左に傾きます。次に forward 関数 (function forward) をこのブロック内にドラッグアンドドロップします。ボタン C を押すと車が左折しながら前進します。

Bluetooth 接続機器 (Devices) から、ゲームパッドのボタン [ C をはなした] とき (on gamepad button C up) ブロックを使用します。steer 関数 (function stop) と stop 関数 (function stop) をこのブロック内にドラッグアンドドロップします。ボタン C をはなすと車のステアリングが真っすぐに向いて停止します。

Step 23: ボタン D の動作を設定しましょう

アプリ内のゲームパッドのボタン D に動作を設定しましょう。

サンプルコード (Receiver.hex ファイル) で以下の設定をしていますのでご参考ください。

車のステアリング用サーボは P2 ピンを使用しています。

Bluetooth 接続機器 (Devices) から、ゲームパッドのボタン [ D を押した] とき (on gamepad button D down) ブロックを使用します。サーボモーター拡張機能 (Servos) から servo [P2] 角度 [変数 center - 10度] (set servo [P2] angle to [center - 10]) をこのブロック内にドラッグアンドドロップします。ステアリング用のサーボが車の直進角度 (90度) から -10度 だけ右に傾きます。次に forward 関数 (function forward) をこのブロック内にドラッグアンドドロップします。ボタン D を押すと車が右折しながら前進します。

Bluetooth 接続機器 (Devices) から、ゲームパッドのボタン [ D をはなした] とき (on gamepad button D up) ブロックを使用します。steer 関数 (function stop) と stop 関数 (function stop) をこのブロック内にドラッグアンドドロップします。ボタン D をはなすと車のステアリングが真っすぐに向いて停止します。