本記事にはアフィリエイト広告が含まれます。

M5Stack ATOM Matrix をスマホアプリBlynkで無線制御(今回はBLE)してみましたのでご報告します。

BlynkによるLED色制御

まずは動きをご覧ください。
スマホのBlynkアプリのzeRGBaウィジェットから色信号をBLEで M5Stack ATOM Matrix に送信してLEDの色を変えています。

#M5ATOM with #Blynk

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フォントを使用しています。

#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);
}

#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ライブラリとほぼ同じなので以下も参照ください。

Adafruit NeoMatrixライブラリを堪能

Blynk BLE接続

BlynkプロジェクトのBLEウェジットをクリックして設定します。

“Connect BLE device”をクリックして “Blynk”が表示されたら選択しOKをクリックして接続する。

動作

この投稿をInstagramで見る

M5ATOM with Blynk

HomeMadeGarbage(@homemadegarbage)がシェアした投稿 – 2020年 4月月22日午前2時52分PDT

簡単に文字と色情報をBLE送信し、表示することができました♪
色々応用できそうですね！！

M5Stack ATOM Matrix でハンディーバーサライタを製作　～ POV1-ATOM ～

コメントはこちらからコメントをキャンセル

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。

M5Stack ATOM Matrix を Blynk で堪能

BlynkによるLED色制御

Blynkアプリ

プロジェクト設定

Arduinoコード

Blynk BLE接続

動作

次の記事

コメントはこちらからコメントをキャンセル

BlynkによるLED色制御

Blynkアプリ

プロジェクト設定

Arduinoコード

Blynk BLE接続

動作

次の記事

関連記事

コメントはこちらから コメントをキャンセル

コメントはこちらからコメントをキャンセル