M5Stack ATOM Matrix を Blynk で堪能
M5Stack ATOM Matrix をスマホアプリBlynkで無線制御(今回はBLE)してみましたのでご報告します。
目次
BlynkによるLED色制御
まずは動きをご覧ください。
スマホのBlynkアプリのzeRGBaウィジェットから色信号をBLEで M5Stack ATOM Matrix に送信してLEDの色を変えています。
via BLE pic.twitter.com/CErK9mT3SR
— HomeMadeGarbage (@H0meMadeGarbage) April 21, 2020
ここではさらにBlynkアプリから色情報に加えて文字を送ってM5Stack ATOM Matrixにスクロール表示させてみたいと思います。
Blynkアプリ
スマホにBlynkアプリをインストールします。
アカウント登録が必要です。
https://blynk.io/en/getting-started
現在(2020/4/22) Blynkアプリのバージョンは2.27.15です。
プロジェクト設定
新規プロジェクトを作成します。HARDWRE MODELはESP32 Dev Boardを選択。
CONNECTION TYPEはBLEを選択しました。もちろんWiFi通信も可能です。
AUTH TOKENはArduinoコード作成時に使用します(アカウント登録したメールアドレスに送信されます)。
BLEとzeRGBa、Text Inputウィジェットを配置します。
zeRGBaウィジェットでLEDの色を設定できるようにします。
OUTPUTはMERGEを選択。それぞれ最小値0、最大値255とします。
SEND ON RELEASEはOFFにして随時データ送信できるようにします。
ここではヴァーチャルピンV0に出力するようにしました。
Text Inputウィジェットで表示する文字を設定します。
ここではヴァーチャルピンV1に出力するようにしました。
Arduinoコード
以下のBlynkのArduino用ライブラリを使用してプログラムしました。バージョンは0.6.1。
https://github.com/blynkkk/blynk-library
またM5Stack ATOM MatrixのLEDに文字を表示するためにFastLED_NeoMatrixライブラリを使用しました。
FastLED NeoMatrixライブラリを使用するためには Adafruit-GFX なども必要となります。
Arduino IDEのライブラリマネージャでFastLED NeoMatrixをインストールすれば必要なライブラリも同時にインストールされます。
現在(2020/4/22) FastLED NeoMatrixライブラリのバージョンは1.1.0です。
[スケッチの例] -> [Blynk] -> [Boards_Bluetooth]-> [ESP32_BLE]を参考にコードを作成しました。
また表示用のフォントとして Adafruit-GFXライブラリのOrg_01フォント を使用しています。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 |
#define BLYNK_PRINT Serial #define BLYNK_USE_DIRECT_CONNECT #include <FastLED.h> #include <FastLED_NeoMatrix.h> #include <Fonts/Org_01.h> #include <BlynkSimpleEsp32_BLE.h> #include <BLEDevice.h> #include <BLEServer.h> // You should get Auth Token in the Blynk App. // Go to the Project Settings (nut icon). char auth[] = "Blynkアプリで取得したトークン"; #define PIN 27 #define mw 5 #define mh 5 #define NUMMATRIX (mw*mh) #define Bright 20 CRGB matrixleds[NUMMATRIX]; FastLED_NeoMatrix *matrix = new FastLED_NeoMatrix(matrixleds, mw, mh, NEO_MATRIX_TOP + NEO_MATRIX_LEFT + NEO_MATRIX_ROWS + NEO_MATRIX_PROGRESSIVE ); int ledR = 255; int ledG = 0; int ledB = 0; int x = mw; String textIn = "H M G"; //ヴァーチャルピンV0 LED色情報 BLYNK_WRITE(V0) { ledR = param[0].asInt(); ledG = param[1].asInt(); ledB = param[2].asInt(); Serial.print( "ledR: "); Serial.print(ledR); Serial.print( " ledG: "); Serial.print(ledG); Serial.print( " ledB: "); Serial.println(ledB); } //Text Inputデータ受信 BLYNK_WRITE(V1) { textIn = param.asStr(); Serial.println(textIn); } void setup(){ // Debug console Serial.begin(115200); Serial.println("Waiting for connections..."); Blynk.setDeviceName("Blynk"); Blynk.begin(auth); matrix->setFont(&Org_01); FastLED.addLeds<NEOPIXEL,PIN>(matrixleds, NUMMATRIX); matrix->begin(); matrix->setTextWrap(false); matrix->setBrightness(Bright); matrix->setTextColor(matrix->Color(ledR, ledG, ledB)); } void loop(){ Blynk.run(); matrix->fillScreen(0); matrix->setCursor(x, 4); matrix->print(textIn); int len = -6*textIn.length(); if(--x < len) { x = matrix->width(); matrix->setTextColor(matrix->Color(ledR, ledG, ledB)); } matrix->show(); delay(100); } |
LEDの輝度は20設定しました(L. 68)。
ヴァーチャルピンV0でBlynkアプリからのLED色情報を取得して、
ヴァーチャルピンV1でText Inputウィジェットの文字データを受信します。
L. 24~26でLEDマトリクスの設定をしております。
マトリクスの幅や高さ(5 × 5)、構成をここで指定します。
詳細は以下を参照ください。
https://github.com/marcmerlin/FastLED_NeoMatrix
またFastLED NeoMatrixライブラリはAdafruit NeoMatrixライブラリとほぼ同じなので以下も参照ください。
Blynk BLE接続
BlynkプロジェクトのBLEウェジットをクリックして設定します。
“Connect BLE device”をクリックして “Blynk”が表示されたら選択しOKをクリックして接続する。
動作
簡単に文字と色情報をBLE送信し、表示することができました♪
色々応用できそうですね!!