M5StackでWeb会議システムと電球を操作する
こんにちは、ヨシケンです！
日頃からArduino互換モジュールのM5Stackシリーズを使って、さまざまな電子工作をしていますが、今回はM5Stackを使ってリモートでの勉強や仕事を便利にするデバイスを作っていきます。
第2回となる今回は、M5StackからパソコンにBLE接続し、Web会議システム（今回はZoomを使用します）を操作できるようにします。また、Zoomを使用している間は部屋の外の電球の色を変えるなど、周りの人に自分の状態を知らせることができるようにします。
[M5Stackでリモートワークを便利に！]
今回の記事の流れ
このデバイスを作るのに必要なもの：
| 名前、説明 | デバイス |
|---|---|
| M5Stack Basic ESP32を搭載し、ディスプレイ、センサなども入ったArduino互換機 |
 |
| SwitchBot ボット ボタンを遠隔で押すことができる、SwitchBotスマートデバイス |
 |
| Hueスマートライト、又はSwitchBotスマートライト 外部から接続可能して、色などの変更が可能なスマートライト |
 |
| M5Stackを接続するためのケーブル、外装部品など | 適宜必要に応じて |
これらの部品をそろえて、リモートワーク便利デバイスを作っていきます。
1. M5StackとZoomとの連携
前回の記事で、M5Stackの開発環境の準備と、BLE接続の方法を説明しました。次に、リモート会議でよく使用するZoomをM5Stackから操作し、ミュートや画像オン・オフなどをできるようにします。
ZOOMを操作するためには、M5StackからZoomのショートカットを実行するようにします。パソコン上のZoomの設定メニューからショートカットを確認してください。ここではまずMacでのショートカットを使ってみます。
以下がMacでZoomを操作する方法と、そのM5Stack上でのコマンドです。
Zoomで会議に参加する: Command + J
bleKeyboard.press(KEY_LEFT_GUI);
bleKeyboard.press(‘j’);
Zoomをミュートする: Shift + Command + A
bleKeyboard.press(KEY_LEFT_SHIFT);
bleKeyboard.press(KEY_LEFT_GUI);
bleKeyboard.press(‘a’);
Zoomで画像をオン・オフする: Shift + Command + V
bleKeyboard.press(KEY_LEFT_SHIFT);
bleKeyboard.press(KEY_LEFT_GUI);
bleKeyboard.press(‘v’);
（スケッチ中にはMacの操作を書いていますが、Windowsでも以下のコマンドにする事により、Zoomを操作できます）
Zoomで会議に参加する: CTL+ALT+SHIFT
bleKeyboard.press(KEY_LEFT_CTRL);
bleKeyboard.press(KEY_LEFT_ALT);
bleKeyboard.press(KEY_LEFT_SHIFT);
Zoomをミュートする: ALT + A
bleKeyboard.press(KEY_LEFT_ALT)
bleKeyboard.press(‘a’);
Zoomで画像をオン・オフする: ALT + V
bleKeyboard.press(KEY_LEFT_ALT);
bleKeyboard.press(‘v’);
ではこのコマンドをスケッチM5Stack_Zoomにセットする事にします。
[ M5Stack_Zoom.ino ]
#include <M5Stack.h>
#include <BleKeyboard.h>
BleKeyboard bleKeyboard;
void setup() {
M5.begin();
M5.Lcd.setTextSize(3);
M5.Lcd.println("M5 Remote Work");
M5.Lcd.println("ZOOM Control");
M5.Lcd.setCursor(10, 200);
M5.Lcd.setTextColor(GREEN);
M5.Lcd.print("Focus ");
M5.Lcd.setTextColor(RED);
M5.Lcd.print("Mute ");
M5.Lcd.setTextColor(BLUE);
M5.Lcd.println("Video");
Serial.begin(115200);
Serial.println("Starting BLE work!");
bleKeyboard.begin();
}
void loop() {
M5.update();
M5.Lcd.setCursor(5, 80);
M5.Lcd.setTextColor(YELLOW,BLACK);
if(bleKeyboard.isConnected()) {
if(M5.BtnA.wasPressed()){
M5.Lcd.print("Focus");
Serial.println(" for Mac SHIFT+j...");
bleKeyboard.press(KEY_LEFT_GUI);
bleKeyboard.press('j');
delay(100);
bleKeyboard.releaseAll();
}
if(M5.BtnB.wasPressed()){
M5.Lcd.println("Mute ");
bleKeyboard.press(KEY_LEFT_SHIFT);
bleKeyboard.press(KEY_LEFT_GUI);
bleKeyboard.press('a');
delay(100);
bleKeyboard.releaseAll();
}
if(M5.BtnC.wasPressed()){
M5.Lcd.println("Video");
bleKeyboard.press(KEY_LEFT_SHIFT);
bleKeyboard.press(KEY_LEFT_GUI);
bleKeyboard.press('v');
delay(100);
bleKeyboard.releaseAll();
}
delay(100);
}
delay(100);
}
ここではM5StackのAボタン（下段左側）を押すとZoom会議に参加、Bボタン（下段真ん中）がミュート、Cボタン（下段右側）がZoom画面のオン・オフにしています。これを実行した画像はこのようになります。
真ん中のBボタンでミュート、右側のCボタンで画面のオン・オフになります。
これでZoomをパソコンから離れても、操作できるようになりました。
2. 外部から操作できるスマート電球をセットアップする
M5StackでZoomが操作できるようになったので、次はZoomを始めたら廊下の電気を光らせることにします。こうすることで、会議中にいきなり他の人が部屋に入ってきてしまったりするのを避けることが可能に。
M5Stackから操作するために、こちらのSwitchBotスマートライトを使います。これはWi-Fiが付いた電球で、スマホなどを含め外部から接続、操作することができます。
このSwitchBotを設定するために、まずSwitchBotのアプリをスマホにインストールします。
このアプリから「照明」＞「スマート電球」を選択してください。スマート電球に接続できたら、スマホのアプリから電球をオン・オフしたり、ライトの色を変えることができるようになります。Zoomに接続されたら、それを知らせるように電球の色を青色に変えておきましょう。
またこの電球のスイッチを入れるためのSwitchBot ボットも使います。こちらはスマートライトをオンオフするスイッチのところにセットします。
このボットをアプリに登録後にデバイス情報を取得します。(画面ショット中で赤枠のA1がボット)
設定画面中の「デバイス情報」から、このボットのMAC情報を取得して、コピーしておきます。
3. Zoomが始まったらスマート電球を光らせる
それではこのコマンドをM5Stackにセットして、Zoom会議が始まったら電球を光らせるようにしましょう。ここではM5StackのAボタンを押して会議に参加したら、SwitchBotボットを動かして電源を入れ、電球をオンにするようにします。
元のM5Stack_Zoomスケッチに以下の黄色部分を追加して、ボットを操作するようにします。スケッチ中のMMMM部分に、先ほど確認したMACアドレスをペーストしてください。また、ボットのバーを押して戻す場合は、以下のようなコマンドを追加します。
static uint8_t cmdPress[3] = {0x57, 0x01, 0x00};
これによりAボタンを押したらSwitchBotボットが動いて、バーを一回動かして、また戻る動作をするようになります。
[ M5Stack_Zoom_Bot.ino ]
#include <M5Stack.h>
#include <BleKeyboard.h>
BleKeyboard bleKeyboard;
…
#include "BLEDevice.h"
static String MAC_SWITCHBOT = "MMMM";
static BLEUUID SERV_SWITCHBOT("cba20d00-224d-11e6-9fb8-0002a5d5c51b");
static BLEUUID CHAR_SWITCHBOT("cba20002-224d-11e6-9fb8-0002a5d5c51b");
static uint8_t cmdPress[3] = {0x57, 0x01, 0x00};
bool doScan = true;
BLEScan* pBLEScan;
static BLEAddress *pGattServerAddress;
static BLEAdvertisedDevice* myDevice;
static BLERemoteCharacteristic* pRemoteCharacteristic;
static BLEClient* pClient = NULL;
bool doDetection = false;
bool sendFlg = false;
bool cas = false;
class MyClientCallback : public BLEClientCallbacks {
void onConnect(BLEClient* pclient) {
Serial.println("onConnect");
}
void onDisconnect(BLEClient* pclient) {
Serial.println("onDisconnect");
if (cas) {
esp_restart();
}
}
};
class advdCallback: public BLEAdvertisedDeviceCallbacks {
void onResult(BLEAdvertisedDevice advertisedDevice) {
Serial.printf("Advertised Device: %s \n", advertisedDevice.toString().c_str());
if (advertisedDevice.haveServiceUUID()) {
String addr = advertisedDevice.getAddress().toString().c_str();
Serial.printf("It have service addr: %s \n", advertisedDevice.getAddress().toString().c_str());
if (addr.equalsIgnoreCase(MAC_SWITCHBOT)) {
advertisedDevice.getScan()->stop();
pGattServerAddress = new BLEAddress(advertisedDevice.getAddress());
myDevice = new BLEAdvertisedDevice(advertisedDevice);
doScan = false;
doDetection = true;
}
}
}
};
void setup() {
M5.begin();
…
BLEDevice::init("");
pBLEScan = BLEDevice::getScan();
pBLEScan->setAdvertisedDeviceCallbacks(new advdCallback());
pBLEScan->setActiveScan(true);
pBLEScan->setInterval(100);
pBLEScan->setWindow(99); // less or equal setInterval value
}
void loop() {
M5.update();
M5.Lcd.setCursor(5, 80);
M5.Lcd.setTextColor(YELLOW,BLACK);
if(bleKeyboard.isConnected()) {
if(M5.BtnA.wasPressed()){
…
if (doScan) {
pBLEScan->start(5, false);
}
if (connectAndSendCommand(*pGattServerAddress)) {
sendFlg = false;
doScan = false;
} else {
doScan = true;
delay(3000);
}
}
…
}
…
// Conneccting SwitchBot GATT Server
static bool connectAndSendCommand(BLEAddress pAddress) {
cas = true;
try {
pClient = BLEDevice::createClient();
pClient->setClientCallbacks(new MyClientCallback());
while (!pClient->connect(myDevice)) {
delay(1000);
}
BLERemoteService* pRemoteService = pClient->getService(SERV_SWITCHBOT);
if (pRemoteService == nullptr) {
return false;
}
pRemoteCharacteristic = pRemoteService->getCharacteristic(CHAR_SWITCHBOT);
if (pRemoteCharacteristic == nullptr) {
return false;
}
pRemoteCharacteristic->writeValue(cmdPress, sizeof(cmdPress), false);
cas = false;
delay(3000);
pClient->disconnect();
pClient = NULL;
delay(1000);
}
catch (...) {
if (pClient) {
pClient->disconnect();
pClient = NULL;
}
return false;
}
return true;
}
ではこれを実行してみましょう。Aボタンが押されたらZoomをアクティブにして、同時にSwitchBotのライトを青く光らせます。
このような動きになっています。これでZoomを外から操作したり、廊下の電球を光らせたりする事ができたと思います。
4. まとめ
今回の連載では、M5Stackとセンサを使って、自宅でのリモートワークを快適にするデバイスの製作を紹介しています。
今回は、M5StackとパソコンをつないでZoomをオンしたり、ミュートにしたりと操作できるようになりました。
合わせて、Zoomを使っている時に、SwitchBotと連動させて、部屋の外のライトを青く点灯させて、Webミーティング中なことを外に知らせることができるようになりました。
次はM5Stackにセンサを付けて、リモートでの作業環境をもっと快適にしたいと思います。
お楽しみに！
今回の連載の流れ
第1回：M5Stackでリモートワーク作りに必要なもの
第2回：M5StackでWeb会議システムと電球を操作する（今回）
第3回：M5Stackとセンサーを接続して快適環境作り
第4回：全てを組み合わせてリモートワーク・デバイスを作り上げる
