Arduino Nano ESP32 - DIYables Bluetooth App Slider

Overview

This example provides dual slider controls on the Arduino Nano ESP32 using BLE (Bluetooth Low Energy) via the DIYables Bluetooth STEM app. Control two independent values with configurable range and step from a smartphone. Suitable for LED brightness, motor speed, servo positioning, and any application requiring adjustable numeric input.

Note: The Arduino Nano ESP32 supports BLE only — Classic Bluetooth is not supported. The DIYables Bluetooth App works on both Android and iOS with BLE.

Arduino Nano ESP32 Bluetooth Slider Example - Dual Slider Control via BLE Tutorial

Features

  • Dual Sliders: Two independent slider controls
  • Configurable Range: Set minimum, maximum, and step values
  • Real-Time Updates: Slider values transmitted instantly on change
  • PWM Ready: Map slider values directly to PWM output
  • Android & iOS Support: BLE is compatible with both platforms
  • No Pairing Required: BLE connects without manual pairing
  • Low Power: BLE consumes less power than Classic Bluetooth

Hardware Preparation

1×Arduino Nano ESP32
1×USB Cable Type-A to Type-C (for USB-A PC)
1×USB Cable Type-C to Type-C (for USB-C PC)
1×Breadboard
1×Jumper Wires
1×Recommended: Screw Terminal Expansion Board for Arduino Nano
1×Recommended: Breakout Expansion Board for Arduino Nano
1×Recommended: Power Splitter for Arduino Nano ESP32

Or you can buy the following kits:

1×DIYables Sensor Kit (30 sensors/displays)
1×DIYables Sensor Kit (18 sensors/displays)
Disclosure: Some of the links provided in this section are Amazon affiliate links. We may receive a commission for any purchases made through these links at no additional cost to you.
Additionally, some of these links are for products from our own brand, DIYables .

Arduino Nano ESP32 Code

Detailed Instructions

  • New to the Arduino Nano ESP32? Start with the Arduino Nano ESP32 getting started guide.
  • Connect the Arduino Nano ESP32 to your computer via USB.
  • Open Arduino IDE.
  • Select the Arduino Nano ESP32 board and the correct COM port.
  • Click the Libraries icon in the left sidebar.
  • Search for "DIYables Bluetooth" and select the DIYables Bluetooth library by DIYables.
  • Click Install.
Arduino Nano ESP32 DIYables Bluetooth library
  • When prompted to install dependencies, click Install All.
Arduino Nano ESP32 DIYables Bluetooth dependency

BLE Code

  • In Arduino IDE, open File Examples DIYables Bluetooth ArduinoBLE_Slider, or paste the code into the editor.
/* * 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 * * Tutorial: https://diyables.io/bluetooth-app * Author: DIYables */ #include <DIYables_BluetoothServer.h> #include <DIYables_BluetoothSlider.h> #include <platforms/DIYables_Esp32BLE.h> // BLE Configuration const 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 instances DIYables_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 values int currentSlider1 = 0; int currentSlider2 = 0; // PWM output pins const int PWM_PIN_1 = D6; const int PWM_PIN_2 = D7; void setup() { Serial.begin(115200); delay(1000); Serial.println("DIYables Bluetooth - ESP32 BLE Slider Example"); // Initialize PWM pins pinMode(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..."); } void loop() { bluetoothServer.loop(); delay(10); }
  • Click Upload to flash the sketch to the board.
  • Open the Serial Monitor.
  • The Serial Monitor output should look like:
COM6
Send
DIYables Bluetooth - Slider Example Waiting for Bluetooth connection...
Autoscroll Show timestamp
Clear output
9600 baud  
Newline  

Mobile App

  • Install the DIYables Bluetooth App on your smartphone: Android | iOS

Note: The DIYables Bluetooth App works on both Android and iOS with BLE. No manual pairing is required.

  • Launch the DIYables Bluetooth App.
  • On first launch, grant the following permissions:
    • Nearby Devices (Android 12+) / Bluetooth (iOS) — required to scan and connect to Bluetooth devices
    • Location (Android 11 and below only) — required by older Android versions to scan for BLE
  • Ensure Bluetooth is enabled on your device.
  • Tap Connect on the home screen. The app will scan for BLE devices.
DIYables Bluetooth App - Home Screen with Scan Button
  • Tap "Arduino_Slider" in the scan results.
  • After connecting, return to the home screen and open the Slider app.
DIYables Bluetooth App - Home Screen with Slider App

Tap the settings icon on the home screen to show or hide apps. See the DIYables Bluetooth App User Manual for details.

  • Drag the sliders to change values.
DIYables Bluetooth App - Slider Screen

Now look back at the Serial Monitor on Arduino IDE. You will see:

COM6
Send
Bluetooth connected! Slider 1: 50, Slider 2: 0 Slider 1: 75, Slider 2: 0 Slider 1: 100, Slider 2: 25
Autoscroll Show timestamp
Clear output
9600 baud  
Newline  
  • Adjust the sliders and observe the values update in real time in the Serial Monitor.

Creative Customization - Adapt the Code to Your Project

Configure Slider Range

// Constructor: DIYables_BluetoothSlider(min, max, step) DIYables_BluetoothSlider bluetoothSlider(0, 100, 1); // Change range at runtime bluetoothSlider.setRange(0, 255); // Change step size bluetoothSlider.setStep(5); // Coarser control // Read configuration int minVal = bluetoothSlider.getMin(); int maxVal = bluetoothSlider.getMax(); int step = bluetoothSlider.getStep();

Handle Slider 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 to PWM and control output int pwm1 = map(slider1, 0, 100, 0, 255); analogWrite(PWM_PIN_1, pwm1); });

Send Current Values to App

bluetoothSlider.onGetConfig([]() { bluetoothSlider.send(currentSlider1, currentSlider2); }); // Or send anytime: bluetoothSlider.send(50, 75); // Set both sliders

Handle Connection Events

bluetoothServer.setOnConnected([]() { Serial.println("Bluetooth connected!"); bluetoothSlider.send(currentSlider1, currentSlider2); }); bluetoothServer.setOnDisconnected([]() { Serial.println("Bluetooth disconnected!"); });

Programming Examples

LED Brightness Control

const int LED_PIN_1 = 9; const int LED_PIN_2 = 10; bluetoothSlider.onSliderValue([](int slider1, int slider2) { int brightness1 = map(slider1, 0, 100, 0, 255); int brightness2 = map(slider2, 0, 100, 0, 255); analogWrite(LED_PIN_1, brightness1); analogWrite(LED_PIN_2, brightness2); Serial.print("LED 1: "); Serial.print(brightness1); Serial.print(", LED 2: "); Serial.println(brightness2); });

Servo Control

#include <Servo.h> Servo servo1, servo2; void setup() { servo1.attach(9); servo2.attach(10); bluetoothSlider.onSliderValue([](int slider1, int slider2) { int angle1 = map(slider1, 0, 100, 0, 180); int angle2 = map(slider2, 0, 100, 0, 180); servo1.write(angle1); servo2.write(angle2); Serial.print("Servo 1: "); Serial.print(angle1); Serial.print("°, Servo 2: "); Serial.print(angle2); Serial.println("°"); }); }

Motor Speed with Direction

const int MOTOR_SPEED_PIN = 9; const int MOTOR_DIR_PIN = 8; bluetoothSlider.onSliderValue([](int slider1, int slider2) { // Slider 1: speed (0-100%) // Slider 2: direction threshold (below 50 = reverse, above 50 = forward) int speed = map(slider1, 0, 100, 0, 255); bool forward = (slider2 >= 50); analogWrite(MOTOR_SPEED_PIN, speed); digitalWrite(MOTOR_DIR_PIN, forward ? HIGH : LOW); Serial.print("Speed: "); Serial.print(slider1); Serial.print("%, Direction: "); Serial.println(forward ? "Forward" : "Reverse"); });

Advanced Programming Techniques

Slider with Dead Zone

bluetoothSlider.onSliderValue([](int slider1, int slider2) { // Add dead zone around center (45-55 = stop) if (slider1 >= 45 && slider1 <= 55) { Serial.println("Center - stopped"); analogWrite(MOTOR_PIN, 0); } else { int speed = map(slider1, 0, 100, 0, 255); analogWrite(MOTOR_PIN, speed); } });

Rate Limiting

unsigned long lastSliderAction = 0; const unsigned long SLIDER_COOLDOWN = 50; // 50ms minimum bluetoothSlider.onSliderValue([](int slider1, int slider2) { if (millis() - lastSliderAction >= SLIDER_COOLDOWN) { lastSliderAction = millis(); // Process slider value analogWrite(PWM_PIN, map(slider1, 0, 100, 0, 255)); } });

Troubleshooting

Common Issues

1. Device not visible in the app

  • Confirm the board is powered on and the sketch is uploaded
  • Verify Bluetooth is enabled on your phone
  • On Android 11 and below, enable Location services as well
  • Try restarting Bluetooth on your phone

2. Slider changes not received

  • Check the Bluetooth connection status in the app
  • Confirm the onSliderValue callback is registered correctly
  • Review the Serial Monitor for error messages

3. PWM output not working

  • Confirm the pin supports PWM
  • Check wiring connections
  • Test with a simple analogWrite sketch first

4. Slider resets to 0 on reconnect

  • Implement the onGetConfig callback to send stored values on reconnect
  • Persist slider values in variables across connections

5. Connection drops frequently

  • Reduce distance to the Arduino
  • Check for interference from other BLE devices
  • Ensure a stable USB power supply

6. Upload fails or board not recognized

  • Install the latest Arduino Nano ESP32 board package via Board Manager
  • Try a different USB cable or port
  • Press the reset button before uploading

Project Ideas

Lighting Control

  • Dual LED brightness controller
  • RGB LED color mixer (use two sliders for hue/saturation)
  • LED strip brightness and color temperature
  • Stage lighting dimmer

Motor Control

  • DC motor speed controller
  • Dual servo positioning
  • Pan-tilt camera mount
  • Robot wheel speed

Audio

  • Volume control
  • Tone frequency and duration
  • Equalizer bands

Next Steps

After completing the Bluetooth Slider example, explore:

  1. Bluetooth Joystick — 2D directional control
  2. Bluetooth Rotator — Angular/rotational control
  3. Bluetooth Temperature — Temperature gauge display
  4. Multiple Bluetooth Apps — Combine slider with other app widgets

Support

For additional help:

※ OUR MESSAGES

  • As freelancers, We are AVAILABLE for HIRE. See how to outsource your project to us
  • Please feel free to share the link of this tutorial. However, Please do not use our content on any other websites. We invested a lot of effort and time to create the content, please respect our work!