M5 Stack UI Flowを使ってみよう (ver 1.2.3)

このページはM5 Stackの開発ツールの1つであるUI Flowを使ってみようという内容です。
なお、このページで使用しているのはスイッチサイエンス社が発売しているM5 Go Starter Kitおよび関連するセンサーモジュールです。
このページで解説しているUI Flowのバージョンは1.2.3です。
*あきらかな間違いやミス、動かないサンプルがありましたらopenspc@alpha.ocn.ne.jpまでメールをください。


Last update:2019/5/8 PM 11:38

設定

  1. M5 StackのAPI Keyを登録する
  2. M5 Stackのファームウェアをアップデートする(Macの場合)

イベント

  1. ボタンが押されたら画面の色を変える

UI

  1. 画面の背景色を変更する
  2. タイトルを配置する
  3. ラベルを配置する
  4. 四角形を配置する
  5. 円を配置する
  6. 画像(イメージ)を配置する
  7. UI部品を削除する

ハードウェア

  1. M5 Stack本体のLEDバーを点灯させる
  2. M5 Stack本体のLEDバーの明るさを変化させる
  3. M5 Stack本体のLEDバーを左右で異なる色で点灯させる
  4. M5 Stack本体のLEDバーの色を個別に指定する
  5. ピッチ角、ロール角、ヨー角の値を表示する
  6. 傾きによって円(●)の位置を制御する
  7. 指定した周波数で音を鳴らす

Units

  1. アングルセンサーの値を表示する
  2. ボタンユニットの状態を表示する
  3. 環境色をリアルタイムに表示する(カラーセンサー)
  4. 土壌水分センサーの値を表示する
  5. 気温、湿度、気圧をリアルタイムに表示する
  6. 赤外線センサー(PIR)からの値(デジタル値)を表示する
  7. ジョイスティックの値を表示する
  8. ライトセンサー(光センサー)の値を表示する
  9. 非接触温度センサー(NCIR)の値を表示する
  10. NeoPixelですべてのLEDを同じ色で点灯させる
  11. NeoPixelでLEDの明るさを変化させる
  12. 人感センサー(PIR)の値を表示する
  13. 3つのLEDを指定した色で光らせる
  14. 物体との距離をリアルタイムに表示する

グラフィック

  1. 画面を用意された色で塗り潰す
  2. ランダムにピクセル(点)を描画する
  3. ランダムにライン(線)を描画する
  4. ランダムに四角形を描画する
  5. ランダムに三角形を描画する
  6. ランダムに正円を描画する

絵文字

  1. 絵文字を表示する

タイマー

  1. タイマーを使って1秒ごとに画面の色を切り替える

実行

  1. ブロックにPythonコードを入れる

その他

  1. Pythonコードを表示する