Web Serial APIでマイクロビットからパソコンを操作してみよう


パソコン側のChrome(クローム)等のブラウザにあるWeb Serial API(ウェブシリアルエーピーアイ)という機能を使ってマイクロビットからパソコンを動かしてみます。


パソコン側の操作のサンプルとして、簡単なシューティングゲームを用意しましたので、マイクロビットでゲームを操作する為のゲームパッド作りをしてみます。

https://saitodev.co/programming/game/shooting.html


サンプルのゲームの操作方法は下記のようになります。

※ キーボードとシリアル通信でどちらも同じ値を使います。

w:上

a:左

s : 下

d : 右

k : 攻撃(弾を発射する)

r : ゲームオーバ―時にゲームを再スタート


サンプルのゲームの仕様は下記の通りです。

ボーレート(baud rate):115200bps

※ボーレートに関してはマイクロビットでUARTを使ってみるに記載があります




先にMakeCodeでコードを作ってフラッシングしておきます。



最初だけブロックに挿入しましたシリアル通信 通信速度を115200に設定するブロックですが、こちらはbaudrate(ボーレート)になりまして、ブラウザと接続する時に重要になります。




ずっとブロックを2個設けて、片方には移動に関する処理にして、もう片方には弾の発射等のボタンを押した時の処理にします。


ずっとブロックを分けないと、移動しながら弾を発射することができなくなります。


1つ目のずっとブロックの中にありますロールに関しては、Microbit Moreの水準器を使ってスプライトを移動してみるに記載があります。




コードをフラッシングしましたら、パソコンとマイクロビットをUSBケーブルで繋いだままにして、https://saitodev.co/programming/game/shooting.htmlを開きます。



ゲーム画面上部にありますマイクロビットと接続(シリアル通信)ボタンをクリックします。



micro:bitを選択して接続ボタンを押します。



画面右下のシリアル通信の状態が未接続から接続済み(115200bps)に変わりましたら接続は終了です。

マイクロビットのボタンBかキーボードの r ボタンを押してゲームを開始してみましょう。




MicroPythonへの書き換え

from microbit import *

uart.init(baudrate=115200)

while True:
    # 移動に関するコード
    roll = accelerometer.get_x()
    if roll < 0:
        uart.write('a')
        sleep(200)
    elif roll > 0:
        uart.write('d')
        sleep(200)

    # ボタンに関すること
    if button_a.was_pressed():
        uart.write('k')
        sleep(100)
    elif button_b.was_pressed():
        uart.write('r')
        sleep(100)
京都の東本願寺で開催されているプログラミング教室で講師をしています。
詳しくはTera schoolを御覧ください。
大阪府高槻市でプログラミング教室を開設しています。
同じカテゴリーの記事
マインクラフト用ビジュアルエディタを開発しています。

詳しくはinunosinsi/mcws_blockly - githubをご覧ください。