早押しボタン

 今回は複数のマイクロビットを使ってクイズ番組などで見られる早押しボタンを作ります。IoT関係でこのような早押しボタンを作成する場合、ボタンとマイクロビットを結線して使うことがあります。ですが、ここではマイクロビットの無線(Bluetooth)を使って早押しボタンを作成してみます。マイクロビットが1つしかない場合は駄目ですが、ボタンとマイクロビットを結線するよりも手軽に早押しボタンを作ることができます。また、教室などで子供が複数いて使う場合には便利です。25人いても誰が一番速く押したかが分かります。

 早押しボタンは受信側は1つで送信側が複数のマイクロビットを使うことになります。送信側には特定の番号を割り当てます。送信するデータは受信側の番号のみとします。

 最初に動作確認用でプログラムを作成した後、問題点を修正し完成させます。

・JavaScript用Microbitエディター
https://makecode.microbit.org/

受信側の作成

 まずは受信側です。先生やクイズの主催者側が使うものになります。無線のグループ番号を設定し、無線で数値を受信したらLEDに表示します。

 ブロックは以下のように組み合わせます。

  • 新規プロジェクトから「無線」カテゴリ、「無線のグループを設定「1」」をクリック
  • 新規プロジェクトから「無線」カテゴリ、「無線のグループを設定「1」」をクリック
  • 新規プロジェクトから「無線」カテゴリ、「無線のグループを設定「1」」をクリック

  • 「最初だけに」ブロックに配置し、数値を「3」に変更する。続いて、「無線」カテゴリから「無線で受信したとき「receivedNumber」」をクリック
  • 「最初だけに」ブロックに配置し、数値を「3」に変更する。続いて、「無線」カテゴリから「無線で受信したとき「receivedNumber」」をクリック
  • 「最初だけに」ブロックに配置し、数値を3に変更する。続いて、「無線」カテゴリから「無線で受信したとき「receivedNumber」」をクリック

  • 「基本」カテゴリから「数を表示「0」」をクリック
  • 「基本」カテゴリから「数を表示「0」」をクリック
  • 「基本」カテゴリから「数を表示「0」」をクリック

  • 図のように「無線で受信したとき「receiverNumber」 に配置する。続いて、「変数」カテゴリから「receiverNumber」をクリックし、
  • 図のように「無線で受信したとき「receiverNumber」 に配置する。続いて、「変数」カテゴリから「receiverNumber」をクリックし、
  • 図のように「数を表示」ブロックにあてはめる

  • 図のように「数を表示」ブロックにあてはめる

    図のように「無線で受信したとき「receiverNumber」 に配置する。続いて、「変数」カテゴリから「receiverNumber」をクリックし、

 JavaScriptコードの場合は以下のようになります。

 radio.onDataPacketReceived( ({ receivedNumber }) =>  {
     basic.showNumber(receivedNumber)
 })
 radio.setGroup(3)
 basic.forever(() => {

 })

 完成したらプログラムをマイクロビットに転送しておきます。転送後、プログラムは動作していますが、無線でデータを受信しないためLEDには何も表示されない状態になります。受信側は、このまま接続するか、モバイルバッテリーと接続して起動し待機させておきます。

送信側の作成

 次に送信側を作成します。送信側はボタンAが押されたら自分の番号を送信します。番号はマイクロビットごとに変える必要があります。

 ブロックは以下のように組み合わせます。なお、以下のブロックでは割り当て番号が1になっていますが、マイクロビットの個数などに応じて2や3などに変更してください。

  • 新規プロジェクトから「無線」カテゴリの「無線のグループを設定「1」をクリック」
  • 新規プロジェクトから「無線」カテゴリの「無線のグループを設定「1」をクリック」
  • 新規プロジェクトから「無線」カテゴリの「無線のグループを設定「1」をクリック」

  • 「最初だけ」ブロックにあてはめ、数値を「3」に変更。続いて、「入力」カテゴリから「ボタン「A」を押されたとき」ブロックを選択
  • 「最初だけ」ブロックにあてはめ、数値を「3」に変更。続いて、「入力」カテゴリから「ボタン「A」を押されたとき」ブロックを選択
  • 「最初だけ」ブロックにあてはめ、数値を「3」に変更。続いて、「入力」カテゴリから「ボタン「A」が押されたとき」ブロックを選択

  • 図のように配置する。続いて、「無線」カテゴリの「無線で数値を送信「1」」をクリック
  • 図のように配置する。続いて、「無線」カテゴリの「無線で数値を送信「0」」をクリック
  • 図のように配置する。続いて、「無線」カテゴリの「無線で数値を送信「0」」をクリック

  • 数値を「1」に変え、「ボタン「A」がおされたとき」カテゴリにあてはめる。ここで送信側のプログラムは完了。送信側マイクロビットの個数に応じて同様のプログラムを複製し、送信する数値を変える
  • 数値を「1」に変え、「ボタン「A」がおされたとき」カテゴリにあてはめる。ここで送信側のプログラムは完了。送信側マイクロビットの個数に応じて同様のプログラムを複製し、送信する数値を変える
  • 数値を「1」に変え、「ボタン「A」がおされたとき」カテゴリにあてはめる。ここで送信側のプログラムは完了。送信側マイクロビットの個数に応じて同様のプログラムを複製し、送信する数値を変える。

  • ここでは3つの送信機を想定しているので、同様の処理のプログラムで送信数値を2、3と変えてそれぞれのマイクロビットにプログラムを入れておこう

    ここでは3つの送信機を想定しているので、同様の処理のプログラムで送信数値を2、3と変えてそれぞれのマイクロビットにプログラムを入れておこう

 input.onButtonPressed(Button.A, () => {
     radio.sendNumber(1)
 })
 radio.setGroup(1)
 basic.forever(() => {

 })

 完成したらプログラムをマイクロビットに転送します。割り当て番号を間違えないようにし、それぞれのマイクロビットに転送してください。

 準備ができたら送信側のマイクロビットのボタンAを押してみましょう。受信側に番号が表示されれば正常に動作しています。なお、無線通信はBluetooth (BLE) なので、あまり遠く離れてしまうと使えません(だいたい5m範囲内)。

  • 上にあるのが受信側のマイクロビットで、下に並ぶ3つが送信側のマイクロビット。送信側のAボタンで
  • 上にあるのが受信側のマイクロビットで、下に並ぶ3つが送信側のマイクロビット。送信側のAボタンで
  • 上にあるのが受信側のマイクロビットで、下に並ぶ3つが送信側のマイクロビット。送信側のAボタンで

  • 設定した数字が受信側に無線で送信され、表示される。Bluetoothでおおよそ5mの範囲での送信が可能だ
  • 設定した数字が受信側に無線で送信され、表示される。Bluetoothでおおよそ5mの範囲での送信が可能だ
  • 設定した数字が受信側に無線で送信され、表示される。Bluetoothでおおよそ5mの範囲での送信が可能だ

問題点を修正

 ここまでのプログラムでも早押しボタンとして機能しますので、十分使うことは可能です。しかし、いくつか改良したい部分もあります。問題点としては最初に受信した番号ではなく後から受信した番号を受信しLEDに表示してしまうことです。このため最初にボタンを押した人の番号が表示されるように修正する必要があります。その場合、次の受信を受け付けるようにするリセット機能も必要になります。リセットされたらLEDにリセットしたことを示すチェックマークを表示するようにします。ボタンを押しても何も反応が無いと不安になるからです。

 次の問題点として送信側の番号を個別に割り当てるため、毎回プログラムを修正して転送しなければならないことです。そこで、ボタンBが押されたら番号を0〜9までの範囲で変更できるようにします。このようにすると受信側は1つのプログラムで済みます。また、番号の管理は変数を使って行います。

 この2つの問題点を改良したのが以下のプログラムになります。受信側、送信側のブロックを間違えないように組み合わせてください。ブロックを配置するのが面倒な場合はJavaScriptのコードをJavaScriptエディタにコピー&ペーストしても構いません。

【受信側のブロック/プログラム】

 let 変数 = 0
 radio.onDataPacketReceived( ({ receivedNumber }) =>  {
     if (変数 == 0) {
         basic.showNumber(receivedNumber)
         変数 = 1
     }
 })
 input.onButtonPressed(Button.A, () => {
     変数 = 0
     basic.showIcon(IconNames.Yes)
     basic.pause(250)
     basic.showLeds(`
         . . . . .
         . . . . .
         . . . . .
         . . . . .
         . . . . .
         `)
 })
 radio.setGroup(3)
 変数 = 0
 basic.forever(() => {

 })

【送信側のブロック/プログラム】

 let 変数 = 0
 input.onButtonPressed(Button.A, () => {
     radio.sendNumber(変数)
     basic.showIcon(IconNames.Yes)
     basic.pause(250)
     basic.showNumber(変数)
 })
 input.onButtonPressed(Button.B, () => {
     変数 += 1
     変数 = 変数 % 10
     basic.showNumber(変数)
 })
 radio.setGroup(3)
 変数 = 1
 basic.showNumber(変数)
 basic.forever(() => {

 })

受信側、送信側のプログラムを転送したら動作を確認してみましょう。送信する前に、マイクロビットごとに番号をボタンBを押して設定してください。設定したらボタンAを押します。すると、設定した番号が受信側のマイクロビットに表示されます。

設定が終わったらテストしてみましょう。最初に送ったマイクロビットの番号だけが表示され、後で押したマイクロビットの番号は表示されません。

再度、番号を受け取るには受信側のマイクロビットのボタンAを押します。押すとチェックマークが表示された後、LEDが消えます。これで再度番号を受信できるようになります。

  • 送信側はBボタンで番号を設定(0から9)しAボタンで自身の番号を確定、「レ(チェックマーク)」が表示される。受信側はAボタンで「レ(チェックマーク)」を表示、何度でも利用できるようになる
  • 送信側はBボタンで番号を設定(0から9)しAボタンで自身の番号を確定、「レ(チェックマーク)」が表示される。受信側はAボタンで「レ(チェックマーク)」を表示、何度でも利用できるようになる
  • 送信側はBボタンで番号を設定(0から9)しAボタンで自身の番号を確定、「レ(チェックマーク)」が表示される。受信側はAボタンで「レ(チェックマーク)」を表示、何度でも利用できるようになる。

 これで早押しボタン完成です。ただ、困ったこともあります。送信側でボタンBを押すと、いつでも好きな番号に変更できてしまうことです。足し算など計算結果、問題の解答番号を先生に送る場合にはいいかもしれませんが、早押しボタンの場合は困ります。

一度設定したら後から変更できないように改良してみましょう。マイクロビットを振ったら設定完了とみなして、以後の番号の変更をできないようにする、といった方法を考えて見ると、よい勉強になります。

著者 古籏一浩
プログラミングをベースにして面白そうなものはとりあえずやってみるというスタンス。複雑なものよりシンプルで楽しめるものが好み。
著者サイト:http://www.openspc2.org/