クリエイター手抜きプロジェクト[618]IoT ATOM Matrix編 LEDパターンを点灯させる(2)
── 古籏一浩 ──

投稿:  著者:



今回はUIFlowを使って、ATOM MatrixのLEDを点灯させます。前回はWiFi接続するところまで説明しました。後は簡単にプログラムを作ることができます。まず、UIFlowにアクセスします。UIFlowのページURLは以下の通りです。

https://flow.m5stack.com/

UIFlowは1.3系、1.4系、1.5系の3バージョンを使用することができます。バージョンによって、対応するデバイスとモジュールなどが異なります。

ATOM Matrixの場合、2020年4月28日時点ではバージョン1.4.5のUIFlowを使用します。1.5系ではATOM Matrixに対応していないためです。

UIFlowのバージョンは、ページの左上のUIFlowのロゴの部分で確認できます。このバージョンが1.5.1や1.3.2になっている場合、右上にあるVERメニューをクリックすることで、バージョンを切り替えることができます。





なお、UIFlowのページにアクセスすると、最初にお知らせのダイアログが表示されます。次に、デバイスキーと使用するデバイスの種類を入力する、ダイアログが表示されます。ダイアログが表示されない場合は、すでにデバイスキーと種類が設定されています。

新たに変更する場合や、ダイアログが表示されない場合は、UIFlow画面左下にある Api Key:xxxxxxxx [ Disconnected ] と表示されているDisconnected文字をクリックし、Api Key、言語、Deviceの3つを入力します。Api Keyは前回取得した値を入力します。言語は日本語、DeviceはAtom-Matrixを選択します。設定したらOKボタンをクリックします。

すると、ATOM Matrixに接続する処理が行われます。ATOM Matrixの上面のLEDが、緑色の点滅(ゆっくりと点滅)します。接続できなかった場合は、UIFlow画面右上にメッセージが表示されます。また、画面左下のApi Key:xxxxxxxxの部分に、Disconnectedと表示されます。

最初は接続できないことが多々あるので、Disconnectedの文字の右側にあるリロードボタンをクリックします。場合によっては、何度かボタンを押さないと接続されないことがあります。Disconnectedの文字が接続済みとなればOKです。

それでは、ATOM Matrixの上面のLEDを点灯させてみます。ATOM MatrixのLEDは5×5のフルカラーRGBです。このため任意の色で点灯させることができます。

点灯させる色を選択するには画面左上、UIFlowのロゴマークがある下の■Colorのボタンをクリックします。するとカラー選択パネル(OSによって異なります)が表示されます。色を選択したら、左側に表示されているATOM Matrixの外観内の■をクリックします。選択した色が表示されます。クリックして5×5のLEDを好きな色にしてください。

点灯させるだけであれば、プログラムは不要です。ただし、このままでは点灯しませんので、ATOM Matrixで実行させる必要があります。UIFlow画面の右上にある▲(RUN)ボタンをクリックします。

プログラムが転送され、ATOM MatrixのLEDが指定した色で点灯します。もし、▲ボタンをクリックしても接続できない旨のメッセージが表示されたり、ATOM Matrixに変化がない場合は、再度▲ボタンをクリックします。それでも駄目な場合は、一度USBケーブルをATOM Matrixから抜いて、再度差し込みます。

UIFlowと接続したのを確認したら、▼ボタンをクリックします。ATOM MatrixのLEDがUIFlowと接続されていることを示す緑色の点滅であっても、コンピューターをスリープさせたり、接続を切ってしまうと駄目です。再度、接続しなおす必要があります。

次に、プログラムを使ってLEDを点滅させてみましょう。プログラムで任意のパターンのLEDを点灯させるには、UIFlowのカテゴリから「ハードウェア」をクリックします。すると「RGBカラー」のカテゴリが表示されます。

Set atom matrixというブロックがあるので、これをクリックします。すると画面にブロックが出るので、Setupブロックの下に連結させます。点灯させたいLEDのマス目をクリックします。

任意の色で点灯させるには、Set atom matrixブロックのSet atom matrixの文字の右側にある■をクリックします。カラーパネルが表示されるので色を選択し、ブロック内のマス目をクリックします。

次に、一定時間待つようにします。これはタイマーのカテゴリにある「[1]秒停止」ブロックを使います。Set atom matrixブロックの下に連結させます。ここでは1秒待つことにしますので、そのままブロックを連結するだけです。

次に、もうひとつSet atom matrixブロックを配置し、同様に点灯させたいLEDパターンを設定します。これで2つのパターンが、ATOM MatrixのLEDに表示されます。▲ボタンをクリックして、実行させてみてください。

LEDパターンが切り替わりましたが、一回だけで終わってしまいます。永遠に繰り返しパターンを切り替えたい場合は、次のようにします。

「イベント」のカテゴリをクリックします。一番上にある「ずっと」のブロックを配置します。先ほど作成したSet atom matrixのブロック一式を、Setupブロックから切り離して「ずっと」のブロック内に入れます。今度は「ずっと」のブロックを「Setup」ブロックの下に連結します。

あと、2番目のSet atom matrixブロックの下に、「[1]秒停止」ブロックを追加しておきます。これで完成です。

▲ボタンをクリックして、実行させてみましょう。交互にLEDパターンが切り替わります。

今回のプログラムを、ブロックではなくPythonで処理する場合は、以下のようになります。なお、このPythonコードは、UIFlowのブロック(Blockly)からPythonに切り替えた際に生成されたものになります。

from m5stack import *
from m5ui import *
from uiflow import *
rgb.set_screen([0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0])
while True:
rgb.set_screen([0xFFFFFF,0,0,0,0,0,0xFFFFFF,0,0,0,0,0,0x00ff22,0,0,0,0,0,0xFFFFFF,0,0,0,0,0,0xFFFFFF])
wait(1)
rgb.set_screen([0,0,0,0,0xFFFFFF,0,0,0,0xFFFFFF,0,0,0,0xff0000,0,0,0,0xFFFFFF,0,0,0,0xFFFFFF,0,0,0,0])
wait(1)
wait_ms(2)

ATOM Matrix単体ではできることは限られていますので、M5Stick/Stackなど他のデバイスと組み合わせるか、Webサービスと連携させるのがよいでしょう。


【古籏一浩】openspc@alpha.ocn.ne.jp
http://www.openspc2.org/

M5StackからM5StickC、そしてATOM Matrxi、Lightと、どんどんサイズが小さくなってます。体どこまで小さくなっていくんでしょうか。でも、ATOM Matrixサイズでフルカラー液晶とか無謀なものを出してきそう...いや、シールタイプという可能性もあるかもしれないなあ。

今年も無事に田植えが終了。一次産業はコロナウイルスとかでも別に休んだりするわけでもなく、通常通りに事が進むだけ。で、テレビとかもアニメ・特撮以外はほとんど見ても意味がないので、たまに見るとコロナ云々とかまったく別世界の話しに…。

・創って学ぼうプログラミング
https://news.mynavi.jp/series/makeprogram

・8K/4K/ハイビジョン映像素材集
http://www.openspc2.org/HDTV/

・クリエイター手抜きプロジェクト
http://www.openspc2.org/projectX/