この記事は、「UIFlow の toio用ブロック」に関する内容です。

過去のイベントでの LT で触れていたことがあった内容（※ その時のスライドは以下）ですが、記事にはしていなかったので、書いておこうと思います。

ただし掲載するプログラムの内容に関しては、上記の発表スライドの中で話に出しているおもちゃの刀を光らせる仕組みに使ったものではなく、別のシンプルな処理に関するものです。
（まずは、記事としてシンプルな処理を行う事例を書いていければと思います）

扱うプログラムの内容がどのようなものかというと、3種類ある toio との間の処理（「Read、Write、Notify」の 3種類）の中の、toio への書き込みを行う「Write」の処理を行うものです。

UIFlow の toio用ブロックについて

UIFlow の toio用ブロックは、UIFlow の設定で ATOM Matrix か　ATOM Lite を選択した場合に利用可能です。

それらのデバイスを選択した場合、toio用のブロックがメニューの以下の部分に表示されます。

動作している様子とプログラム

動作している様子

まずは、toio用のブロックの Write の処理を使って、toio のサウンド機能を動作させた様子を動画で示します。
動画を見ていただくと、ATOM Matrix のボタンを押した時に、toio側で音が鳴っているのが分かるかと思います。

UIFlow のプログラム

次に、UIFlow で作ったプログラムや補足を記載します。作成したプログラムは以下のとおりです。

プログラムの内容について、少し補足します。

初期化と接続の処理

初期化と接続を行う部分についての補足です。

まず、上記のツイートをした時点では（※ おそらく、この記事執筆時点でも）、UIFlow の toio用ブロックに関する公式ドキュメントがなさそうでした。
そこで、公式ドキュメントのかわりになりそうな情報を参照して、初期化・接続の処理部分を実装しました。具体的には、自分が過去に参加したオンラインイベントで、画面共有で表示されていたプログラムです（以下の画像で出てきていた処理内容）。

自分が作成した UIFlow のプログラムの中で、具体的には以下の部分です。
（参照した元のプログラムとの違いは、繰り返し処理内の待ち時間を「100ミリ秒」から「500ミリ秒」へと、実験的に適当に変えてみた部分のみです）

この処理を実行すると、近くにある toio をスキャンして、その toio に接続した状態になります。

書き込みの処理

上記の内容に加えて、ボタン押下時の処理を UIFlow で作っています。
その処理の中で toio が関係する部分は以下となります。

toio との接続が維持されていることを確認した後で、シンプルに toio で音を鳴らす処理を実行しただけのものです。

なお、初期化の処理やボタン押下時の処理で、プログラムが実行される様子が視覚的に分かりやすくなるように、ATOM Matrix　の LED の色を変える処理も加えています。

おわりに

今回、UIFlow の toio用ブロックで書き込みを扱う処理をシンプルに試しました。

次は、「Read、Write、Notify」の 3種類のうち、Read を用いて読み取りをする話を記事にできればと思います。