ESP32 Bluetooth Slider Beispiel - Tutorial für Zwei-Slider-Steuerungsschnittstelle
Überblick
Das Bluetooth Slider-Beispiel bietet zwei unabhängige Slider-Steuerungen, die über die DIYables Bluetooth STEM App zugänglich sind. Entwickelt für ESP32-Boards mit Unterstützung für sowohl BLE (Bluetooth Low Energy) als auch Classic Bluetooth Verbindungen. Jeder Slider bietet Werte von 0-100, was sie perfekt für PWM-Steuerung, Helligkeitseinstellung, Motorgeschwindigkeitskontrolle und jede Anwendung macht, die analog-ähnliche Steuerwerte benötigt.
Dieses Beispiel unterstützt zwei Bluetooth-Modi:
ESP32 BLE (Bluetooth Low Energy): Funktioniert sowohl auf Android als auch iOS
ESP32 Classic Bluetooth: Funktioniert nur auf Android. iOS unterstützt kein Classic Bluetooth. Verwenden Sie BLE, wenn Sie iOS-Unterstützung benötigen.
Funktionen
Zwei Slider: Zwei unabhängige Slider-Steuerungen (jeweils Bereich 0-100)
Echtzeit-Werte: Sofortige Wert-Updates über Bluetooth-Kommunikation
PWM-Kompatibel: Werte (0-100) einfach auf analogWrite()-Funktionen abbildbar
Visuelle Rückmeldung: Echtzeit-Wertanzeige für jeden Slider in der App
BLE & Classic Bluetooth: Wählen Sie den Bluetooth-Modus, der zu Ihrem Projekt passt
Plattformübergreifend: BLE-Modus funktioniert sowohl auf Android als auch iOS; Classic Bluetooth funktioniert auf Android
Niedrige Leistungsaufnahme: BLE-Modus verbraucht weniger Strom als Classic Bluetooth
Konfigurierbarer Bereich & Schritt: Anpassen von Slider-Bereich und Schrittgröße zur Laufzeit
Offenlegung: Einige der in diesem Abschnitt bereitgestellten Links sind Amazon-Affiliate-Links. Wir können eine Provision für Käufe erhalten, die über diese Links getätigt werden, ohne zusätzliche Kosten für Sie. Wir schätzen Ihre Unterstützung.
ESP32 Code
Schnelle Schritte
Folgen Sie diesen Anweisungen Schritt für Schritt:
Verbinden Sie das ESP32-Board über ein USB-Kabel mit Ihrem Computer.
Starten Sie die Arduino IDE auf Ihrem Computer.
Wählen Sie das entsprechende ESP32-Board und den COM-Port aus.
Navigieren Sie zum Bibliotheken-Symbol in der linken Leiste der Arduino IDE.
Suchen Sie "DIYables Bluetooth" und finden Sie die DIYables Bluetooth-Bibliothek von DIYables
Klicken Sie auf den Installieren-Button, um die Bibliothek zu installieren.
Sie werden gefragt, ob Sie weitere Bibliotheksabhängigkeiten installieren möchten
Klicken Sie auf Alle Installieren, um alle Bibliotheksabhängigkeiten zu installieren.
Wählen Sie einen der beiden Bluetooth-Modi unten je nach Ihren Anforderungen:
ESP32 Classic Bluetooth Code (funktioniert nur mit der App auf Android)
Hinweis: Classic Bluetooth wird NICHT auf iOS unterstützt. Falls Sie iOS-Unterstützung benötigen, verwenden Sie den BLE-Code unten.
In der Arduino IDE gehen Sie zu Datei Beispiele DIYables Bluetooth Esp32Bluetooth_Slider Beispiel, oder kopieren Sie den obigen Code und fügen Sie ihn in den Editor der Arduino IDE ein
/* * DIYables Bluetooth Library - ESP32 Classic Bluetooth Slider Example * Works with DIYables Bluetooth STEM app on Android * Note: Classic Bluetooth is NOT supported on iOS. Use BLE examples for iOS support. * * This example demonstrates the Bluetooth Slider feature: * - Control values using sliders (0-100) * - Support for dual sliders * - Configurable range and step * * Compatible Boards: * - ESP32 (all variants with Classic Bluetooth) * - ESP32-WROOM-32 * - ESP32-DevKitC * - ESP32-WROVER * * Note: Select "Huge APP (3MB No OTA/1MB SPIFFS)" partition scheme * in Arduino IDE: Tools > Partition Scheme * * Setup: * 1. Upload the sketch to your ESP32 * 2. Open Serial Monitor (115200 baud) to see connection status * 3. Use DIYables Bluetooth App to connect and control sliders * * Tutorial: https://diyables.io/bluetooth-app * Author: DIYables */#include <DIYables_BluetoothServer.h>#include <DIYables_BluetoothSlider.h>#include <platforms/DIYables_Esp32Bluetooth.h>// Create Bluetooth instancesDIYables_Esp32Bluetooth bluetooth("ESP32_Slider");DIYables_BluetoothServer bluetoothServer(bluetooth);// Create Slider app instance (min=0, max=100, step=1)DIYables_BluetoothSlider bluetoothSlider(0, 100, 1);// Variables to store current slider valuesint currentSlider1 = 0;int currentSlider2 = 0;// PWM output pins (for LED brightness control example)constint PWM_PIN_1 = 16;constint PWM_PIN_2 = 17;// ESP32 LEDC PWM channelsconstint PWM_CHANNEL_1 = 0;constint PWM_CHANNEL_2 = 1;voidsetup() {Serial.begin(115200);delay(1000);Serial.println("DIYables Bluetooth - ESP32 Slider Example");// Initialize PWM using ESP32 LEDC ledcSetup(PWM_CHANNEL_1, 5000, 8); // 5kHz, 8-bit resolution ledcSetup(PWM_CHANNEL_2, 5000, 8); ledcAttachPin(PWM_PIN_1, PWM_CHANNEL_1); ledcAttachPin(PWM_PIN_2, PWM_CHANNEL_2);// Initialize Bluetooth server with platform-specific implementation bluetoothServer.begin();// Add slider app to server bluetoothServer.addApp(&bluetoothSlider);// Set up connection event callbacks bluetoothServer.setOnConnected([]() {Serial.println("Bluetooth connected!");// Send initial slider positions bluetoothSlider.send(currentSlider1, currentSlider2); }); bluetoothServer.setOnDisconnected([]() {Serial.println("Bluetooth disconnected!"); });// Set up slider callback for value changes bluetoothSlider.onSliderValue([](int slider1, int slider2) {// Store the received values currentSlider1 = slider1; currentSlider2 = slider2;// Print slider values (0-100)Serial.print("Slider 1: ");Serial.print(slider1);Serial.print(", Slider 2: ");Serial.println(slider2);// Map slider values (0-100) to PWM range (0-255)int pwm1 = map(slider1, 0, 100, 0, 255);int pwm2 = map(slider2, 0, 100, 0, 255);// Control LED brightness using ESP32 LEDC ledcWrite(PWM_CHANNEL_1, pwm1); ledcWrite(PWM_CHANNEL_2, pwm2);// TODO: Add your control logic here based on slider values// Examples:// - Servo control: myServo.write(map(slider1, 0, 100, 0, 180));// - Motor speed: ledcWrite(MOTOR_CHANNEL, pwm1);// - Volume control: setVolume(slider1);// - Brightness control: setBrightness(slider2); });// Optional: Handle requests for current slider values (when app loads) bluetoothSlider.onGetConfig([]() {// Send the stored slider values back to the app bluetoothSlider.send(currentSlider1, currentSlider2);Serial.print("App requested values - Sent: Slider1=");Serial.print(currentSlider1);Serial.print(", Slider2=");Serial.println(currentSlider2); });// You can change slider configuration at runtime:// bluetoothSlider.setRange(0, 255); // Change range to 0-255// bluetoothSlider.setStep(5); // Change step to 5 (coarser control)Serial.println("Waiting for Bluetooth connection...");}voidloop() {// Handle Bluetooth server communications bluetoothServer.loop();delay(10);}
Klicken Sie auf den Upload-Button in der Arduino IDE, um den Code auf den ESP32 hochzuladen
Öffnen Sie den Serial Monitor
Überprüfen Sie das Ergebnis im Serial Monitor. Es sieht folgendermaßen aus:
Newbiely | Arduino IDE 2.3.8
──
☐
✕
File
Edit
Sketch
Tools
Help
ESP32 Dev Module
Newbiely.ino
···
8Serial.println("Hello World!");
Output
Serial Monitor
Message (Enter to send message to 'ESP32 Dev Module' on 'COM15')
New Line
9600 baud
DIYables Bluetooth - ESP32 Slider Example
Waiting for Bluetooth connection...
Ln 11, Col 1
ESP32 Dev Module on COM15
2
ESP32 BLE Code (funktioniert mit der App auf Android und iOS)
In der Arduino IDE gehen Sie zu Datei Beispiele DIYables Bluetooth Esp32BLE_Slider Beispiel, oder kopieren Sie den obigen Code und fügen Sie ihn in den Editor der Arduino IDE ein
/* * DIYables Bluetooth Library - ESP32 BLE Slider Example * Works with DIYables Bluetooth STEM app on Android and iOS * * This example demonstrates the Bluetooth Slider feature: * - Control values using sliders (0-100) * - Support for dual sliders * - Configurable range and step * * Compatible Boards: * - ESP32-WROOM-32 * - ESP32-DevKitC * - ESP32-WROVER * - ESP32-S3 * - ESP32-C3 * - Any ESP32 board supporting BLE * * Note: Select "Huge APP (3MB No OTA/1MB SPIFFS)" partition scheme * in Arduino IDE: Tools > Partition Scheme * * Setup: * 1. Upload the sketch to your ESP32 * 2. Open Serial Monitor (115200 baud) to see connection status * 3. Use DIYables Bluetooth App to connect and control sliders * * Tutorial: https://diyables.io/bluetooth-app * Author: DIYables */#include <DIYables_BluetoothServer.h>#include <DIYables_BluetoothSlider.h>#include <platforms/DIYables_Esp32BLE.h>// BLE Configurationconst char* DEVICE_NAME = "ESP32BLE_Slider";const char* SERVICE_UUID = "19B10000-E8F2-537E-4F6C-D104768A1214";const char* TX_UUID = "19B10001-E8F2-537E-4F6C-D104768A1214";const char* RX_UUID = "19B10002-E8F2-537E-4F6C-D104768A1214";// Create Bluetooth instancesDIYables_Esp32BLE bluetooth(DEVICE_NAME, SERVICE_UUID, TX_UUID, RX_UUID);DIYables_BluetoothServer bluetoothServer(bluetooth);// Create Slider app instance (min=0, max=100, step=1)DIYables_BluetoothSlider bluetoothSlider(0, 100, 1);// Variables to store current slider valuesint currentSlider1 = 0;int currentSlider2 = 0;// PWM output pinsconstint PWM_PIN_1 = 16;constint PWM_PIN_2 = 17;voidsetup() {Serial.begin(115200);delay(1000);Serial.println("DIYables Bluetooth - ESP32 BLE Slider Example");// Initialize PWM pinspinMode(PWM_PIN_1, OUTPUT);pinMode(PWM_PIN_2, OUTPUT);// Initialize Bluetooth server with platform-specific implementation bluetoothServer.begin();// Add slider app to server bluetoothServer.addApp(&bluetoothSlider);// Set up connection event callbacks bluetoothServer.setOnConnected([]() {Serial.println("Bluetooth connected!"); bluetoothSlider.send(currentSlider1, currentSlider2); }); bluetoothServer.setOnDisconnected([]() {Serial.println("Bluetooth disconnected!"); });// Set up slider callback for value changes bluetoothSlider.onSliderValue([](int slider1, int slider2) { currentSlider1 = slider1; currentSlider2 = slider2;Serial.print("Slider 1: ");Serial.print(slider1);Serial.print(", Slider 2: ");Serial.println(slider2);// Map slider values (0-100) to PWM range (0-255)int pwm1 = map(slider1, 0, 100, 0, 255);int pwm2 = map(slider2, 0, 100, 0, 255);analogWrite(PWM_PIN_1, pwm1);analogWrite(PWM_PIN_2, pwm2);// TODO: Add your control logic here }); bluetoothSlider.onGetConfig([]() { bluetoothSlider.send(currentSlider1, currentSlider2);Serial.print("App requested values - Sent: Slider1=");Serial.print(currentSlider1);Serial.print(", Slider2=");Serial.println(currentSlider2); });Serial.println("Waiting for Bluetooth connection...");}voidloop() { bluetoothServer.loop();delay(10);}
Klicken Sie auf den Upload-Button in der Arduino IDE, um den Code auf den ESP32 hochzuladen
Öffnen Sie den Serial Monitor
Überprüfen Sie das Ergebnis im Serial Monitor. Es sieht folgendermaßen aus:
Newbiely | Arduino IDE 2.3.8
──
☐
✕
File
Edit
Sketch
Tools
Help
ESP32 Dev Module
Newbiely.ino
···
8Serial.println("Hello World!");
Output
Serial Monitor
Message (Enter to send message to 'ESP32 Dev Module' on 'COM15')
New Line
9600 baud
DIYables Bluetooth - ESP32 BLE Slider Example
Waiting for Bluetooth connection...
Ln 11, Col 1
ESP32 Dev Module on COM15
2
Mobile App
Installieren Sie die DIYables Bluetooth App auf Ihrem Smartphone: Android | iOS
Falls Sie den ESP32 Classic Bluetooth Code verwenden, müssen Sie den ESP32 mit Ihrem Android-Telefon vor dem Öffnen der App koppeln:
Gehen Sie zu den Einstellungen > Bluetooth Ihres Telefons
Stellen Sie sicher, dass Bluetooth aktiviert ist
Ihr Telefon sucht nach verfügbaren Geräten
Finden und tippen Sie auf "ESP32_Slider" in der Liste verfügbarer Geräte
Bestätigen Sie die Kopplungsanfrage (keine PIN erforderlich)
Warten Sie, bis "Gekoppelt" unter dem Gerätenamen angezeigt wird
Falls Sie den ESP32 BLE Code verwenden, ist keine Kopplung erforderlich. Fahren Sie einfach mit dem nächsten Schritt fort.
Öffnen Sie die DIYables Bluetooth App
Beim ersten Öffnen der App werden Berechtigungen abgefragt. Gewähren Sie bitte folgende:
Geräte in der Nähe Berechtigung (Android 12+) / Bluetooth Berechtigung (iOS) - erforderlich zum Scannen und Verbinden mit Bluetooth-Geräten
Standort Berechtigung (nur Android 11 und älter) - erforderlich bei älteren Android-Versionen zum Scannen nach BLE-Geräten
Stellen Sie sicher, dass Bluetooth auf Ihrem Telefon aktiviert ist
Tippen Sie auf dem Startbildschirm auf die Verbinden-Schaltfläche. Die App sucht nach sowohl BLE- als auch Classic Bluetooth-Geräten.
Finden und tippen Sie auf Ihr Gerät in den Scan-Ergebnissen, um eine Verbindung herzustellen:
Für Classic Bluetooth: tippen Sie auf "ESP32_Slider"
Für BLE: tippen Sie auf "ESP32BLE_Slider"
Sobald verbunden, kehrt die App automatisch zum Startbildschirm zurück. Wählen Sie die Slider App aus dem App-Menü.
Hinweis: Sie können das Einstellungen-Symbol auf dem Startbildschirm antippen, um Apps auf dem Startbildschirm ein-/auszublenden. Weitere Details finden Sie im DIYables Bluetooth App Benutzerhandbuch.
Bewegen Sie die beiden Slider, um PWM-Werte (0-100) zu steuern
Schauen Sie nun zurück zum Serial Monitor in der Arduino IDE. Sie werden sehen:
Newbiely | Arduino IDE 2.3.8
──
☐
✕
File
Edit
Sketch
Tools
Help
ESP32 Dev Module
Newbiely.ino
···
8Serial.println("Hello World!");
Output
Serial Monitor
Message (Enter to send message to 'ESP32 Dev Module' on 'COM15')
Bewegen Sie die Slider in der App und beobachten Sie die Echtzeit-Rückmeldung im Serial Monitor
Kreative Anpassung - Code an Ihr Projekt anpassen
Standard-Slider-Werte festlegen
Konfigurieren Sie anfängliche Slider-Positionen:
// Aktuelle Slider-Werte (0-100)int currentSlider1 = 25; // Standard 25%int currentSlider2 = 50; // Standard 50%
Slider-Bereich und Schritt anpassen
// Slider-App-Instanz mit angepasstem Bereich erstellen (min=0, max=255, step=5)DIYables_BluetoothSlider bluetoothSlider(0, 255, 5);// Oder zur Laufzeit ändern:bluetoothSlider.setRange(0, 255); // Bereich auf 0-255 ändernbluetoothSlider.setStep(5); // Schritt auf 5 ändern (gröbere Kontrolle)// Aktuelle Konfiguration lesen:int currentMin = bluetoothSlider.getMin(); // Aktuellen Minimalwert abrufenint currentMax = bluetoothSlider.getMax(); // Aktuellen Maximalwert abrufenint currentStep = bluetoothSlider.getStep(); // Aktuellen Schrittwert abrufen
Konfigurationsanfrage von der App verarbeiten
Wenn die App sich verbindet und den Slider-Bildschirm öffnet, fordert sie die Slider-Konfiguration vom ESP32 an. Sie können den onGetConfig()-Callback verwenden, um die aktuellen Slider-Werte zu diesem Zeitpunkt an die App zu senden:
bluetoothSlider.onGetConfig([]() {// Dies wird aufgerufen, wenn die App die Slider-Konfiguration anfordert// Aktuelle Slider-Werte senden, damit sie die App korrekt anzeigt bluetoothSlider.send(currentSlider1, currentSlider2);Serial.println("App requested config - sent current values");});
Werte an die App senden
Sie können Slider-Werte vom ESP32 an die App senden (z.B. um die Slider-Positionen der App zu aktualisieren):
// Beide Slider-Werte an die App sendenbluetoothSlider.send(currentSlider1, currentSlider2);// Einen einzelnen Wert senden (wird auf beide Slider angewandt)bluetoothSlider.send(50);
Verbindungsereignisse verarbeiten
Sie können erkennen, wann sich die App mit dem ESP32 verbindet oder trennt:
// Wird aufgerufen, wenn sich die App mit dem ESP32 verbindetbluetoothServer.setOnConnected([]() {Serial.println("Bluetooth connected!");// Aktuelle Slider-Werte an die App senden bluetoothSlider.send(currentSlider1, currentSlider2);});// Wird aufgerufen, wenn sich die App vom ESP32 trenntbluetoothServer.setOnDisconnected([]() {Serial.println("Bluetooth disconnected!");// Optional: Motoren stoppen, Ausgänge zurücksetzen, etc.});// Verbindungsstatus überall in Ihrem Code überprüfenif (bluetoothServer.isConnected()) {// Etwas nur bei bestehender Verbindung tun}
Slider verwenden
App-Interface-Steuerungen
Das Slider-Interface in der DIYables Bluetooth App bietet:
Slider 1: Erste Steuer-Slider mit Wertanzeige
Slider 2: Zweite Steuer-Slider mit Wertanzeige
Wertanzeige: Echtzeit-Zahlenwerte für beide Slider
Wertbereiche
Jeder Slider bietet:
Standard-Bereich: 0 bis 100
Konfigurierbar: Bereich und Schritt können im Code angepasst werden
PWM-Zuordnung: Einfache Zuordnung zu 0-255 für analogWrite()
Programmierbeispiele
Grundlegender Slider-Handler
voidsetup() {// Slider-Callback für Wertänderungen einrichten bluetoothSlider.onSliderValue([](int slider1, int slider2) {// Empfangene Werte speichern currentSlider1 = slider1; currentSlider2 = slider2;// Slider-Werte ausgebenSerial.println("Slider 1: " + String(slider1) + ", Slider 2: " + String(slider2));// Ihre Steuerungslogik hier hinzufügen });}
Sie können gerne den Link zu diesem Tutorial teilen. Bitte verwenden Sie jedoch unsere Inhalte nicht auf anderen Websites. Wir haben viel Mühe und Zeit in die Erstellung der Inhalte investiert, bitte respektieren Sie unsere Arbeit!