Simple Button

A versatile push button. Use it to fire a one-shot action on press, toggle a state on and off, or trigger a stronger action with a long press.

[image] Simple Button on canvas, default green, label « Button »

What it does

Simple Button has two modes. Momentary fires events on press, release, and (optionally) long press. Toggle flips an internal on/off state on each press and reports the new state to your sketch. Your code listens with WHEN_PRESSED, WHEN_RELEASED, WHEN_LONG_PRESSED, and WHEN_TOGGLED(isOn).

When to use it

• Light on/off — Toggle mode, label LED, drive a digital pin from WHEN_TOGGLED(isOn).
• Manual override — Momentary mode, label Hold to override. Run something only while held: start in WHEN_PRESSED, stop in WHEN_RELEASED.

Properties

The Inspector opens as a bottom sheet with a Widget ID field at the top, then these sections in order.

Widget ID

1. Essential

2. Header

3. Button labels

4. Behavior

5. Colors · Default

6. Colors · Pressed

7. Colors · Long press

Momentary mode only.

States and behavior

[image] Three states side by side: Idle / Pressed / Long-pressed

• Idle — Default colors.
• Pressed — Pressed colors.
• Long-pressed — Long press colors (Momentary mode only).

In Toggle mode, the button keeps its visual state on each toggle and emits WHEN_TOGGLED(isOn) with the new boolean state.

In code

The button mirrors what the user does on the dashboard. To react to it in your sketch:

ISimpleButton("btn1") {
  WHEN_TOGGLED(isOn) {
    digitalWrite(LED_PIN, isOn ? HIGH : LOW);
  }
};

That’s the minimum — one event block, one widget mirrored. You can add WHEN_PRESSED, WHEN_RELEASED, WHEN_LONG_PRESSED if you need them. See InstantIoT Library / Receive Command from App for the full event reference.

Working Arduino code example

A complete sketch you can flash. The Widget ID btn1 matches the one you set on your Simple Button in the app.

[gif] Simple Button on the dashboard driving an LED on the ESP32 — tap toggles the relay

Direct Mode

Your phone connects directly to the ESP32’s SoftAP — no router, no server. Best for prototyping and standalone setups.

#include <InstantIoTWiFiAP.hpp>

const char* AP_SSID = "InstantIoT-Greenhouse";
const char* AP_PASS = "12345678";

#define LED_PIN 2

InstantIoTWiFiAP instant(AP_SSID, AP_PASS);

ISimpleButton("btn1") {
  WHEN_TOGGLED(isOn) {
    digitalWrite(LED_PIN, isOn ? HIGH : LOW);
  }
};

void setup() {
  pinMode(LED_PIN, OUTPUT);
  instant.begin();
}

void loop() {
  instant.loop();
}

Server Mode

The ESP32 connects to your self-hosted InstantIoT Server over WiFi. Multiple devices, persistent state, history.

#include <InstantIoTWiFiServer.hpp>

const char*    WIFI_SSID     = "YOUR_WIFI_SSID";
const char*    WIFI_PASS     = "YOUR_WIFI_PASSWORD";
const char*    SERVER_IP     = "192.168.1.42";
const uint16_t SERVER_PORT   = 9001;
const char*    DEVICE_TOKEN  = "YOUR_DEVICE_TOKEN";

#define LED_PIN 2

InstantIoTWiFiServer instant(SERVER_IP, SERVER_PORT, DEVICE_TOKEN);

ISimpleButton("btn1") {
  WHEN_TOGGLED(isOn) {
    digitalWrite(LED_PIN, isOn ? HIGH : LOW);
  }
};

void setup() {
  pinMode(LED_PIN, OUTPUT);
  instant.begin(WIFI_SSID, WIFI_PASS);
}

void loop() {
  instant.loop();
}

The widget code is identical — only the include and constructor change.

Notes

• Long press label, Behavior > Long press duration, and Colors · Long press all auto-hide in Toggle mode.
• Header text and Alignment auto-hide when Show header is off.

Next

→ Advanced Button — Same events, plus icon and three style variants.

→ Switch — When you want a clearer on/off visual.

→ Emergency Button — Safety-critical actions with stricter trigger filters.