Skip to main content

Widget Overview

VWire provides 29 widget types organized into four categories. Each widget binds to a device + virtual pin and either displays data from the device or sends commands back to it.


Control Widgets

Send values from the dashboard to your device.

WidgetDefault SizeDescription
Button2×2Momentary push or latching toggle
Switch2×2On / Off toggle switch
Slider3×1Continuous range control
Step Control2×2Increment / decrement by a fixed step
Number Input2×2Free numeric entry within min / max bounds
Text Input3×2Send a text string to a pin
Segmented Control3×2Pick one of N labeled values
Color Picker2×2Send RGB color to device
Joystick2×2Dual-axis XY position sender
Keypad2×3Secure numeric entry with lockout

Display Widgets

Read and visualize values from your device.

WidgetDefault SizeDescription
Value Display2×2Large numeric / text readout
Gauge2×2Circular progress gauge
Analog Gauge2×2Needle-style dial with color zones
LED1×1Binary indicator light
LCD3×2Simulated character LCD screen
Icon Status2×2Map values to icons + colors
Signal Strength2×2Wi-Fi / RSSI bar visualization
Progress Bar3×1Horizontal / vertical fill bar
Sparkline2×2Compact recent-value mini-chart
Timer2×2Countdown or count-up display
Image3×3Embed a live image / MJPEG stream

Chart & Data Widgets

Show historical or streaming data.

WidgetDefault SizeDescription
Graph4×3Line/area chart with historical data
Bar Chart4×3Bar chart of discrete values
Table4×3Scrollable data table with timestamps
Terminal3×3Log viewer / serial-style console

Special Widgets

Advanced logic and integration.

WidgetDefault SizeDescription
Map3×3Live GPS position on a map
Location3×3Collect GPS from mobile browser
Alert3×2Threshold-based in-dashboard alert
Bridge4×2Route a pin value to another device/pin

How to add a widget

  1. Open a project and click + Add Widget (top bar or empty canvas area).
  2. Search or browse to the widget type.
  3. Configure the Device, Pin, and type-specific options.
  4. Click Save — the widget appears immediately on the canvas.
  5. Drag to reposition; drag the resize handle (bottom-right corner) to resize.