ESP32 チュートリアル 52/55 - WS2812 CheerLights MQTT グローバル同期 LCD 付き | SunFounder ESP32 IoT キット
このチュートリアルでは、ESP32を使用してCheerLightsプロジェクトを作成します。このプロジェクトは、MQTTを介して色をグローバルに同期させるものです。このプロジェクトは、他のユーザーからの入力に基づいて色を変更するだけでなく、現在の色とそれが更新された回数をLCDスクリーンに表示します。その結果は、IoTの能力を示す楽しいデモンストレーションとなり、デバイスがどのようにインタラクトし、距離を超えてユーザーをつなげることができるかを示しています。追加の説明が必要な場合は、動画を(動画内の00:00で)ご覧ください。
ハードウェアの説明
このプロジェクトを構築するには、ESP32マイクロコントローラ、WS2812 LEDストリップ、およびLCDディスプレイが必要です。ESP32は操作の中心となり、内蔵のWi-Fi機能を利用してインターネットに接続し、MQTTメッセージを受信します。これにより、他のユーザーからのグローバルな入力に基づいてLEDの色がリアルタイムで更新されます。
WS2812 LEDストリップは、アドレス指定可能なRGB LEDを必要とするプロジェクトに人気の選択肢です。各LEDは独立して制御できるため、豊かな色彩表示が可能です。LCDは現在の色と変更回数の視覚的確認を提供し、ユーザーインタラクションを向上させます。
データシートの詳細
| 製造業者 | サンファウンダー |
|---|---|
| 部品番号 | ESP32 |
| ロジック/IO電圧 | 3.3 V |
| 供給電圧 | 5 V |
| 出力電流(チャネルごと) | 20 mA |
| ピーク電流(チャネルごと) | 60 mA |
| PWM周波数ガイダンス | 400 Hz |
| 入力ロジックの閾値 | 0.15 V(低)、0.8 V(高) |
| 電圧降下 / RDS(on)/ サaturation | 0.2 V |
| 熱的制限 | 85 °C |
| パッケージ | ESP32モジュール |
| メモ / バリアント | 内蔵のWi-FiとBluetoothを搭載しています。 |
- ESP32(5 V)およびWS2812ストリップ(5 V)に適切な電源を供給してください。
- ESP32とLEDストリップの間に共通の接地を使用してください。
- カラー同期のための適切なMQTTブローカーを実装します。
- WS2812のデータピン接続に注意してください(コードに従ってピン14です)。
- LEDの数には注意してください。電力制限を超えると追加の電源が必要になります。
配線手順


コンポーネントを配線するには、まずWS2812 LEDストリップを接続します。LEDストリップのグラウンドピン(通常は黒)をESP32のグラウンドピンに接続します。次に、LEDストリップのVCCピン(通常は赤)をESP32の5V出力に接続します。最後に、データピン(多くの場合黄色)をESP32のGPIOピン14に接続します。
LCDのために、グラウンドピン(多くの場合は黒)をESP32のグラウンドに接続します。VCCピン(通常は赤)は5V出力に接続する必要があります。SDAピン(一般的には灰色)はGPIOピン21に接続され、SCLピン(通常は白)はGPIOピン22に接続されます。この設定により、ESP32はLCDと通信し、必要に応じて情報を表示できます。
コード例とウォークスルー
セットアップ関数では、LCDを初期化し、Wi-Fiに接続します。以下のコードは、必要なライブラリを定義し、LCDを設定する方法を示しています:
#include
#include
LiquidCrystal_I2C lcd(0x27, 16,2); // set the LCD address
void setup() {
Serial.begin(115200);
lcd.init(); // initialize the lcd
lcd.backlight(); // Turns on the LCD backlight.
}これはLCDを使用するために初期化し、メッセージを表示できるようにします。次の抜粋では、Wi-Fi接続の確立方法を示します。
void setup_wifi() {
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
lcdConnect(); //for LCD
delay(500);
}
Serial.println("WiFi connected");
}この機能は指定されたWi-Fiネットワークへの接続を確立し、接続中にLCDにメッセージを表示します。最後に、色の変更ロジックはコールバック関数で処理されます。
void callback(char* topic, byte* message, unsigned int length) {
String messageTemp;
for (int i = 0; i < length; i++) {
messageTemp += (char)message[i];
}
if (String(topic) == "cheerlights") {
setColor(messageTemp);
}
}この関数は「cheerlights」トピックに届くメッセージをリッスンし、それに応じて色を更新します。完全なコードは記事の下に読み込まれるので、完全な実装を確認するためにレビューしてください。
デモンストレーション / 期待すること
プロジェクトが完了すると、LEDストリップはグローバルMQTTフィードからの入力に基づいて色を変えることができます。LCDは現在の色の名前と、どのくらいの回数それが変更されたかを表示します。インターネットを切断すると、LCDには「接続中...」と表示され、接続が再確立されるまで続きます(ビデオの12:30に)。
一般的な落とし穴には、データ接続に正しいピンが使用されていることを確認することや、Wi-Fiの資格情報が正確であることを確認することが含まれます。SSIDやパスワードに不一致がある場合、ESP32は接続に失敗し、LCDは接続中のメッセージを表示し続けます。
ビデオのタイムスタンプ
- 00:00 開始
- 1:59 プロジェクトの紹介
- 6:16 配線の説明
- 8:13 Arduinoコードの説明
- 14:26 Arduino IDEでESP32ボードとCOMポートを選択中
- 16:07 LCDによるCheerLightデモンストレーション
/*
* これはSunFounderのExamples->iot_5_cheerlightからの元のコードです
* フルビデオ指示 https://youtu.be/xEqmxMiF-E8
* 📚⬇️ ダウンロードとリソースページ https://robojax.com/RJT685
*
* 私はLCDを追加して表示します:
* 1- 色名
* 2- 色が更新された回数をカウント
* 3- Wi-Fiが接続されている場合、LCDに表示
* 4- 接続されていないまたは切断された場合は「接続中」と表示
*
* 著者:Ahmad Shamshiri
* www.Robojax.com
* 2023年12月29日
*
* :ref: https://randomnerdtutorials.com/esp32-mqtt-publish-subscribe-arduino-ide/
* https://docs.sunfounder.com/projects/kepler-kit/en/latest/iotproject/5.mqtt_pub.html
*/
#include <Wire.h>
#include <LiquidCrystal_I2C.h>
// SDA->21,SCL->22
LiquidCrystal_I2C lcd(0x27, 16,2); // 16文字と2行のディスプレイ用にLCDアドレスを0x27に設定します。
int colorCount = 0;
int lastColor=0;
byte connected[] = {
B00001,
B00001,
B00011,
B00111,
B00111,
B01111,
B01111,
B11111
};
#include <WiFi.h>
#include <PubSubClient.h>
// #include <Wire.h>
#include <Adafruit_NeoPixel.h>
// 次の変数をあなたのSSID/パスワードの組み合わせに置き換えてください。
const char* ssid = "dars";
const char* password = "5152535455";
// MQTTブローカーのアドレスを追加してください:
const char* mqtt_server = "mqtt.cheerlights.com";
const char* unique_identifier = "sunfounder-client-sdgvsasdda";
WiFiClient espClient;
PubSubClient client(espClient);
long lastMsg = 0;
int value = 0;
// サポートされているCheerLightsの色とそのRGB値を定義してください。
String colorName[] = {"red", "pink", "green", "blue", "cyan", "white", "warmwhite", "oldlace", "purple", "magenta", "yellow", "orange"};
int colorRGB[][3] = { 255, 0, 0, // 赤
255, 192, 203, // ピンク
0, 255, 0, // 緑
0, 0, 255, // 青色
0, 255, 255, // シアン
255, 255, 255, // 白色
255, 223, 223, // 暖白
255, 223, 223, // オールドレース
128, 0, 128, // 紫色
255, 0, 255, // マゼンタ
255, 255, 0, // 黄色
255, 165, 0}; // オレンジ
// 初期化 RGB ストリップ
#define LED_PIN 13
#define NUM_LEDS 8
Adafruit_NeoPixel pixels = Adafruit_NeoPixel(NUM_LEDS, LED_PIN, NEO_GRB + NEO_KHZ800);
void setup() {
Serial.begin(115200);
lcd.init(); // LCDを初期化する
lcd.backlight(); // LCDバックライトをオンにします。
// Wi-Fiのデフォルト設定
setup_wifi();
client.setServer(mqtt_server, 1883);
client.setCallback(callback);
// rgbストリップの開始
pixels.begin();
pixels.show();
}
void setup_wifi() {
delay(10);
// WiFiネットワークに接続することから始めます。
Serial.println();
Serial.print("Connecting to ");
Serial.println(ssid);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
lcdConnect(); // LCD用
delay(500);
Serial.print(".");
}
Serial.println("");
Serial.println("WiFi connected");
Serial.println("IP address: ");
Serial.println(WiFi.localIP());
}
void callback(char* topic, byte* message, unsigned int length) {
Serial.print("Message arrived on topic: ");
Serial.print(topic);
Serial.print(". Message: ");
String messageTemp;
for (int i = 0; i < length; i++) {
Serial.print((char)message[i]);
messageTemp += (char)message[i];
}
Serial.println();
// トピックに関してメッセージが受信された場合、このメッセージを確認します。
// メッセージに応じて出力状態を変更します。
if (String(topic) == "cheerlights") {
Serial.print("Changing color to ");
Serial.println(messageTemp);
setColor(messageTemp);
}
}
void reconnect() {
// 再接続されるまでループします
while (!client.connected()) {
lcdConnect();
Serial.print("Attempting MQTT connection...");
// 接続を試みる
if (client.connect(unique_identifier)) {
Serial.println("connected");
// 購読する
client.subscribe("cheerlights");
} else {
Serial.print("failed, rc=");
Serial.print(client.state());
Serial.println(" try again in 5 seconds");
// 再試行する前に5秒待ってください。
delay(5000);
}
}
}
void setColor(String color) {
// 色のリストをループして、一致する色を見つけます。
for (int colorIndex = 0; colorIndex < 12; colorIndex++) {
if (color == colorName[colorIndex]) {
lastColor = colorIndex; // 最後の色を覚えておいてください。
colorCount++; // カウントを増やす
// ストリップ上の各ネオピクセルの色を設定します。
for (int pixel = 0; pixel < NUM_LEDS; pixel++) {
pixels.setPixelColor(pixel, pixels.Color (colorRGB [colorIndex][0], colorRGB [colorIndex][1], colorRGB [colorIndex][2]));
delay(100);
}
pixels.show();
}
}
}
void lcdConnect()
{
lcd.clear();
lcd.setCursor(0, 0); // 行 0
lcd.print("Connecting...");
lcd.setCursor(0, 1);
lcd.print("SSID:"); // ライン 1
lcd.print(ssid);
}
void loop() {
lcd.clear();
if (!client.connected()) {
reconnect();
}else{
lcd.createChar(0, connected);
lcd.setCursor(15, 0);
lcd.write(byte(0));
}
client.loop();
// 最初の行
lcd.setCursor(0, 0);
lcd.print("Color: ");
lcd.print(colorName[lastColor]);
// 第二列
lcd.setCursor(0, 1);
lcd.print("Changed ");
lcd.print(colorCount);
lcd.print(" times");
delay(1000); // 表示を見るためには遅延が必要です。
}
Common Course Links
Common Course Files
リソースと参考文献
-
ドキュメンテーションESP32 チュートリアル 52/55 - CheerLight 用の SunFounder ドキュメントページdocs.sunfounder.com
ファイル📁
ファイルは利用できません。