(今回の記事は息子くん母が作ったものについての記事です)
M5Stackのコントローラー化を検討
「M5StackをPC操作用のコントローラーにしてみたい!」と思いました。
M5Stackにコントローラーを接続するのではなく、M5Stack自体をコントローラーにするということです。
「m5stack コントローラー bluetooth」とか
「esp32 コントローラー bluetooth」とかで検索すると、
M5Stack/ESP32にコントローラーを接続する記事(やりたいことと反対方向の記事)が沢山出てきます。
知りたいのはそうではないんだな~と思い、実現方法を考えました。
まず通信方法はBluetoothかWiFiか。
Bluetoothしんどそう。WindowsでBluetooth受信プログラムを書かないといけない。
WiFiにしたってそうなんだけどBluetoothのほうがより難しいイメージ。
どちらにしろM5Stackのプログラム開発というよりWindowsシステム側のプログラム開発がメインになっちゃいそう。
この話すると、中1息子くんに「おかあさんには難しいんじゃない?(僕だったらできると思うけど)」とか言われる始末!
かっ!こうみえても私わりと長いことプログラマーやってんですからねー!作ってやろうじゃないのー!
と燃えていた矢先。
引き続きネットで調べているとこちらのページを発見。
アッ・・・
ムズカシイ コト ヤラナクテモ、デキル ミタイ・・・
GitHubで公開されている「ESP32-BLE-Keyboard」っていうライブラリを使うと、簡単にBluetoothキーボードとして認識ができると。
これを使って実装してみました!
Chrome恐竜ゲームのコントローラーにしよう
とその前に、何を動かそう。
M5Stack Fireを使おうと思っており、使えるボタンは3つです。
(加速度センサーで傾きを検知して移動させる方法も考えましたが今回はパス)
なるべく単純な操作でいけるもの・・と考えた結果、PCで誰もが遊べるGoogle Chromeの恐竜ゲームにしました。
Google Chromeの恐竜ゲームとは
息子くんが小5時代(2018年)に改造したことがあるこちら。
siroitori.hatenablog.com
PCのブラウザであるGoogle Chromeで、オフライン時に遊べます。
またはオンライン時でも
chrome://dino/
をブラウザのアドレスバーに入力してアクセスしても起動することができますよ。
↓ この画面から恐竜ゲームが遊べます
使うボタンはジャンプするときのスペースとしゃがむときの下矢印(↓)があればOK!
あとはリセットのためのブラウザリロードF5キーを割り付ければ、ちょうど3つです。
実装
ライブラリの追加
まずは下記ライブラリを追加。
github.com
zipでダウンロードして、
Arduinoの[スケッチ]→[ライブラリをインクルード]→[.ZIP形式のライブラリをインストール…]
でインストールしました。
プログラムの作成
それぞれのボタンを以下のように割り当てることにしました。
Aボタン:F5 ・・・リセット(ブラウザのリロード)
Bボタン:スペース・・・スタート/ジャンプ
Cボタン:↓ ・・・しゃがむ
#include <M5Stack.h> #include <BleKeyboard.h> BleKeyboard bleKeyboard("M5Controller"); bool blestate = false; void setup() { M5.begin(); M5.Power.begin(); bleKeyboard.begin(); M5.Lcd.clear(BLACK); // 画面表示部分の作成 uint16_t x = 20; uint16_t y = 10; M5.Lcd.drawJpgFile(SD, "/dino.jpg", x, y); M5.Lcd.setTextSize(2); M5.Lcd.setTextColor(YELLOW); M5.Lcd.println("=Dinosour Game Controller="); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.println(""); M5.Lcd.setTextColor(BLUE); M5.Lcd.print(" RESET"); M5.Lcd.setTextColor(RED); M5.Lcd.print(" START/JUMP SQUAT"); } void loop() { M5.update(); if (bleKeyboard.isConnected()) { if (!blestate) { blestate = true; } if (M5.BtnA.wasPressed()) { bleKeyboard.press(KEY_F5); bleKeyboard.release(KEY_F5); } else if (M5.BtnB.wasPressed()) { bleKeyboard.press(0x20); //space key bleKeyboard.release(0x20); } else if (M5.BtnC.wasPressed()) { bleKeyboard.press(KEY_DOWN_ARROW); delay(300); bleKeyboard.release(KEY_DOWN_ARROW); } } else { if (blestate) { blestate = false; } } }
KEY_F5 や KEY_DOWN_ARROW は、Keyboard.h に定義されている定数。
スペースキーは定義が無かったので、0x20を直で入れました。
なんとこれだけのコードでコントローラーの完成!素敵!
これをM5Stackに書き込んで実行後PCのbluetooth接続設定の画面を開くと、新しいbluetoothデバイスとして「M5Controller」が出てくるのでWindowsからこれをペアリングしてあげます。
それであとはコントローラーとして実行できる状態になります。
できあがり
おわりに
なんとも本当に簡単にできました。
画面回りの調整に少し時間はかかったかなと思いますが、今回行き詰ることがなかったので、トータルで1時間半程度で作れました。
みなさんもM5Stackで簡単bluetoothコントローラー是非作ってみてください。