Inputs
Text
Buttons
Selects
Name
IP-Address
Password
Email
Number
TEXTAREAS
Message with info-box
Message only
BUTTONS
Button
Name
2 Buttons
SELECTS
Select
Combo
MONITORED APPS
CANVAS
Canvas
Info

To draw with the mouse, press/hold the alt key.

To refresh the canvas, press shift and click.

CHECKBOXES & RADIO
Light
Select day
Adjust Radio
COLOR
Color
RANGE
Range
Range (with label)
0 100
Range (with datalist)
0 100
Brightness
Color
Meters
Meter
Meter (multi)
Meter (full)
Meter (with labels)
0 100
-17 37.2
Min Max
Progress
Progress
Progress
Progress (full)
Progress (with labels)
0 100
-17 37.2
Min Max
LISTS
List (unordered)
List (flex)
List (single select)
  1. Milk
  2. Bread
  3. Chocolate
  4. More chocolate
List (multi select)
  1. Coke
  2. Sprite
  3. Juice
  4. Water
  5. Mocktail
  6. Smoothies
  7. Milk
  8. Tea
  9. Coffee
TABLES
Table (no-select)
Table without selection
One Two Three
1.00 2.00 3.00
west east south
Table (single-select)
Table with single selection
Four Five Six
4.00 5.00 6.50
west east south
Table (multi-select)
Table with multi selection
Seven Eight Nine
7.00 8.00 9.99
west east south
DATE/TIME
Date
Date range
Month
Month (with list)
Week
Time
Datetime local
FILE
Select File
GROUPS
Send A Message
Account ID
Message
Grouped Colors
Startcolor
Endcolor
Message
This is some message

Information:

In this area you can type some information to your user.

Click here
DETAILS
Details
Wrapped Details

If you like to show details aligned with other controls, you can simply wrap the details-item into a regular 'sdpi-item-value'

In this case, details are auto-aligned with the sdpi-item-value controls above.

....

More Info

These samples are provided by Elgato Systems 'as is'.

You are encouraged to use these samples (or this plugin) as a starter for your own ideas. (Just keep in mind to read the SDK-documentation and/or - at least - change the UUID in the manifest.json 😉 )

To find out how things are working, just open the 'index_pi.html' included in this plugin and compare to what's shown in StreamDeck

Scripts

There's an index_pi.js file, which makes this sample interactive and sends changes to the Stream Deck plugin.

This is a very convenient (although not optimized) way to communicate from Property Inspector to your plugin. If you think you have a better solution, please feel free to reach out and send your ideas.

Other

We hope you enjoy extending your Stream Deck and are pretty curious what you will do with it.

Enjoy

Your Elgato Gaming chaps

CAROUSEL
Game Capture
Control Center
Green Screen
Key Creator
HD60 Pro
HD60
Stream Deck
CONTEXT MENU
Button
Right click in this input field