BeetleC(M5StickC)をゲームパッドで簡単に?操作する


こんにちは だーいー と申します!
※某会社の非公式サークル 野良ハックチーム で活動しています。

それはさて置き、みなさんはBeetleCは買いましたかー!?
M5StickCをラジコンにしてしまう例のやつです

1 標準のUIは操作が難しい

ただこれ、標準のUIがとても特殊で操作がメッチャ難しいんですよ。
こんな感じで直進すら困難なんです・・・
 
実はこのUIは、スマホからM5StickCに URL htttp://192.168.4.1/ctl で接続すると表示されるWebのUIなんですね。
 これです。
このLeftやRightを指でビーっとドラッグすると対応したタイヤが動く仕組みです。
下の色の付いた四角形は、車体の下のLEDがその色で点灯します。
これ、直進させるにはLeft+Rightを同時に同じ分上方向にドラッグしないといけないんですよ!(ありえない・・・

あとスマホからって書いたのには理由があって、PCだとブラウザが画面タッチのイベントを拾ってくれないので操作できません。

2 HTTPのGETメソッドで操作出来る

この難しい操作を何とかしたいですよね!?
BeetleCはGitHubでソースも公開されているのでArduinoIDE等でカスタマイズしちゃえばいいんじゃない?って声も聞こえてきそうですが、標準UIがWebUIならHTTPで操作する方が簡単なんじゃないかと考えたわけです。これなら本体に手を加えなくていいですもんね。
しかも http:// で分かるように暗号化されてないので割と簡単です。

実際に動作を解析したところ、次のようなGETメソッドで操作が可能でした。

 GET /control?left=XX&right=YY&color=ZZ HTTP/1.1
 (フルURL http://192.168.4.1/control?left=XX&right=YY&color=ZZ )
項目 説明 設定値
XX 左タイヤの回転 前進(1~124), 後退(-1~-124)
YY 右タイヤの回転 前進(1~124), 後退(-1~-124)
ZZ 車体下のLEDの色 無(0), 赤(1), 緑(2), 青(3)

他のヘッダ部分はこのようにします。(余計な物も入ってるかもしれませんが、とりあえず固定で良いです)

HOST: 192.168.4.1
Connection: close
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; .NET CLR 1.0.3705)
Accept: */*
Referer: http://192.168.4.1/ctl
Accept-Encoding: gzip, deflate

ちなみにURLを知っていればUI操作もいらないので例えばLED赤で速度100で直進させるなら、PCのブラウザから

http://192.168.4.1/control?left=100&right=100&color=1

と打ち込むだけです。至ってシンプル

3 ゲームパッドで操作する

ブラウザからでも操作できますけど、現実的ではないので操作にゲームパッドを使いたいと思います。(たまたま家に良い感じのがありました

実装の仕方はボタンを押したときに、必要に応じてHTTPのGETをすれば良いだけです!
今回は、十字キーの上を押すと前進、下を押すと後退、左で左旋回、右で右旋回する様にして、Aボタン(ボタン1)はスピードアップ、Bボタン(ボタン2)はスピードダウンに割り当てました。(※十字キーを押すとHTTP GETが発行される仕組みです)

4 作ったアプリを配布します

簡単ですが、上に書いた内容でゲームパッドからBeetleCの制御を行うWindowsのアプリを作りましたのでGitHubで配布したいと思います。

使い方は、ゲームパッドをPCに繋げてPCからBeetleCにWifiで接続後、アプリを起動して「開始」ボタンを押してください。(BeetleCは上で書いたように公式の初期アプリのままで良いです)

配布先:https://github.com/da-eee/BeetleC-Controler

良かったら使ってみてください