Flowcode Help - User contributions [en]

Component: Popup Message ( Data)

2026-04-28T17:10:18Z

SteveT: added example

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 0.1
|-
| width="20%" style="color:gray;" | Category
| Data
|}

==Popup Message component==
Component to create a popup message dialogue to inform the user or request action from the user.

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_Popup.fcsx FC_Comp_Source_WEBEXP_Popup.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_Popup.fcsx FC_Comp_Source_WEBEXP_Popup.fcsx]

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

===BasicControls example===
This simple example shows how to sue some basic controls in a Web Developer project.

{{Fcfile|BasicControls.fcweb|BasicControls.fcweb}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/BasicControls.html BasicControls Example]

==Macro reference==

===Alert===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Alert'''
|-
| colspan="2" |  
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | sMessage
|-
| colspan="2" |  
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===Confirm===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Confirm'''
|-
| colspan="2" |  
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | sMessage
|-
| colspan="2" |  
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===Prompt===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Prompt'''
|-
| colspan="2" |  
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | sMessage
|-
| colspan="2" |  
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | sDefault
|-
| colspan="2" |  
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|}

Component: Radio Button ( Control)

2026-04-28T17:08:17Z

SteveT: added example

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.2
|-
| width="20%" style="color:gray;" | Category
| Control
|}

==Radio Button component==
Creates a radio button item that can be grouped with other radio buttons to create a user selectable input.

==Version information==

Library Version, Component Version, Date, Author, Info
2, 1.1, 14-06-24, ST, Corrected the id tag of the html element
3, 1.2, 20-04-26, ST, Resizing no longer distorts the circle

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

===BasicControls example===
This simple example shows how to sue some basic controls in a Web Developer project.

{{Fcfile|BasicControls.fcweb|BasicControls.fcweb}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/BasicControls.html BasicControls Example]

==Macro reference==

===GetState===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetState'''
|-
| colspan="2" | Returns true if this radio button is currently selected 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetState===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetState'''
|-
| colspan="2" | Sets this radio button to be selected or unselected 
|-
|-
| width="10%" align="center" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" | bState
|-
| colspan="2" | The state to set this radio button to 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Radio Button
|-
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Checked
|-
| colspan="2" | The default state of the radio button 
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Text
|-
| colspan="2" | The caption text 
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Group Name
|-
| colspan="2" | Set the group name (radio buttons with the same group name will be mutually exclusive) 
|-
| width="10%" align="center" | [[File:Fc9-type-24-icon.png]]
| width="90%" | OnClick Macro
|-
| colspan="2" | The macro to call when the user clicks this radio button 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Style
|-
|-
| width="10%" align="center" | [[File:Fc9-type-3-icon.png]]
| width="90%" | Font
|-
| colspan="2" | Specifies the font style for the item 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Font Size
|-
| colspan="2" | The font size in pixels 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Bold
|-
| colspan="2" | Make the caption text bold 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Italic
|-
| colspan="2" | Make the caption text italicised 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Underline
|-
| colspan="2" | Make the caption text underlined 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Strikethrough
|-
| colspan="2" | Make the caption text crossed-out 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Colour
|-
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Text
|-
| colspan="2" | Specifies the font colour value 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Background
|-
| colspan="2" | Specifies the background colour value 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Advanced
|-
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Custom Attributes
|-
| colspan="2" | Text here will be added to the html tag of this component to allow advanced customisation 
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_Radio.fcsx FC_Comp_Source_WEBEXP_Radio.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_Radio.fcsx FC_Comp_Source_WEBEXP_Radio.fcsx]

Component: Input Text ( Control)

2026-04-28T17:07:43Z

SteveT: added example

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.0
|-
| width="20%" style="color:gray;" | Category
| Control
|}

==Input Text component==
Creates a text field that can be highlighted and edited by the user.

==Version information==

Library Version, Component Version, Date, Author, Info
2, 0.1, 27-01-25, BR, Added extra macros to set and get the value
3, 1.0, 14-02-25, ST, Changed generated CSS to ensure disabled control has grey text

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

===BasicControls example===
This simple example shows how to sue some basic controls in a Web Developer project.

{{Fcfile|BasicControls.fcweb|BasicControls.fcweb}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/BasicControls.html BasicControls Example]

==Macro reference==

===GetFloat===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetFloat'''
|-
| colspan="2" | Returns the floating point numeric value entered into the text field 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-f32-icon.png]] - FLOAT
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===GetText===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetText'''
|-
| colspan="2" | Returns the text currently entered into this text field 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===GetValue===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetValue'''
|-
| colspan="2" | Returns the numeric value entered into the text field 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetFloat===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetFloat'''
|-
| colspan="2" | Sets the numeric floating point value displayed in this text field 
|-
|-
| width="10%" align="center" | [[File:Fc9-f32-icon.png]] - FLOAT
| width="90%" | Value
|-
| colspan="2" | float value to set 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetText===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetText'''
|-
| colspan="2" | Sets the text displayed in this text field 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | sText
|-
| colspan="2" | Text to set 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetValue===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetValue'''
|-
| colspan="2" | Sets the numeric value displayed in this text field 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Value
|-
| colspan="2" | integer value to set 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Text
|-
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Text
|-
| colspan="2" | The initial text of the component 
|-
| width="10%" align="center" | [[File:Fc9-type-12-icon.png]]
| width="90%" | Type
|-
| colspan="2" | Allows the input to be restricted to numbers or hidden 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Limit Length
|-
| colspan="2" | Sets a limit on how many characters can be entered 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Max Length
|-
| colspan="2" | The maximum number of characters 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Style
|-
|-
| width="10%" align="center" | [[File:Fc9-type-3-icon.png]]
| width="90%" | Font
|-
| colspan="2" | Specifies the font style for the text 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Font Size
|-
| colspan="2" | The font size in pixels 
|-
| width="10%" align="center" | [[File:Fc9-type-12-icon.png]]
| width="90%" | Horizontal Alignment
|-
| colspan="2" | Aligns the text entered 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Bold
|-
| colspan="2" | Make the caption text bold 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Italic
|-
| colspan="2" | Make the caption text italicised 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Underline
|-
| colspan="2" | Make the caption text underlined 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Strikethrough
|-
| colspan="2" | Make the caption text crossed-out 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Colour
|-
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Text
|-
| colspan="2" | Specifies the font colour for the item 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Background
|-
| colspan="2" | Specifies the background colour value 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Advanced
|-
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Custom Attributes
|-
| colspan="2" | Text here will be added to the html tag of this component to allow advanced customisation 
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_InputText.fcsx FC_Comp_Source_WEBEXP_InputText.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_InputText.fcsx FC_Comp_Source_WEBEXP_InputText.fcsx]

Component: Combo Box ( Control)

2026-04-28T17:07:09Z

SteveT: added example

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.3
|-
| width="20%" style="color:gray;" | Category
| Control
|}

==Combo Box component==
Creates a user selectable combo box for selecting between various options.

==Version information==

Library Version, Component Version, Date, Author, Info
3, 1.1, 14-06-24, ST, Corrected the select element id tag, and fixed SplitString use
4, 1.2, 18-06-24, ST, Added macros to clear and set entries and fixed TypeIn version
5, 1.3, 02-02-26, ST, Added SetSelectedIndex macro

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

===BasicControls example===
This simple example shows how to sue some basic controls in a Web Developer project.

{{Fcfile|BasicControls.fcweb|BasicControls.fcweb}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/BasicControls.html BasicControls Example]

==Macro reference==

===AddEntry===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''AddEntry'''
|-
| colspan="2" | Adds a text entry to the combobox 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | NewEntry
|-
| colspan="2" | The new text entry to add 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===ClearEntries===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''ClearEntries'''
|-
| colspan="2" | Clears the list of entries in the combobox 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===GetSelectedIndex===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetSelectedIndex'''
|-
| colspan="2" | Returns the index of the selected item 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-s16-icon.png]] - INT
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===GetSelectedText===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetSelectedText'''
|-
| colspan="2" | Returns the text for the currently selected item 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetSelectedIndex===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetSelectedIndex'''
|-
| colspan="2" | Sets the index of the selected item 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | idx
|-
| colspan="2" | The item to select 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | ComboBox
|-
|-
| width="10%" align="center" | [[File:Fc9-type-11-icon.png]]
| width="90%" | Options
|-
| colspan="2" | A list of choices available in the combobox 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Type In
|-
| colspan="2" | Set to allow the user to type directly into this combobox 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Show Lines
|-
| colspan="2" | If this is greater than 1, this many options will be shown as a selectable list 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Style
|-
|-
| width="10%" align="center" | [[File:Fc9-type-3-icon.png]]
| width="90%" | Font
|-
| colspan="2" | Specifies the font style for the item 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Font Size
|-
| colspan="2" | The font size in pixels 
|-
| width="10%" align="center" | [[File:Fc9-type-12-icon.png]]
| width="90%" | Horizontal Alignment
|-
| colspan="2" | Aligns the caption text on the button 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Bold
|-
| colspan="2" | Make the caption text bold 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Italic
|-
| colspan="2" | Make the caption text italicised 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Underline
|-
| colspan="2" | Make the caption text underlined 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Strikethrough
|-
| colspan="2" | Make the caption text crossed-out 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Colour
|-
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Text
|-
| colspan="2" | Specifies the font colour for the item 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Background
|-
| colspan="2" | Specifies the background colour value 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Advanced
|-
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Custom Attributes
|-
| colspan="2" | Text here will be added to the html tag of this component to allow advanced customisation 
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_ComboBox.fcsx FC_Comp_Source_WEBEXP_ComboBox.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_ComboBox.fcsx FC_Comp_Source_WEBEXP_ComboBox.fcsx]

Component: Check Box ( Control)

2026-04-28T17:06:36Z

SteveT: added example

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.2
|-
| width="20%" style="color:gray;" | Category
| Control
|}

==Check Box component==
Creates a checkbox item to allow a user to toggle between on and off.

==Version information==

Library Version, Component Version, Date, Author, Info
2, 1.1, 14-06-24, ST, Corrected the id tag of the html elements
3, 1.2, 20-04-26, ST, Resizing no longer distorts the square shape

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

===BasicControls example===
This simple example shows how to sue some basic controls in a Web Developer project.

{{Fcfile|BasicControls.fcweb|BasicControls.fcweb}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/BasicControls.html BasicControls Example]

==Macro reference==

===GetState===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetState'''
|-
| colspan="2" | Returns the current state of the checkbox (i.e. if it is selected or not) 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetState===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetState'''
|-
| colspan="2" | Sets the current state of this checkbox 
|-
|-
| width="10%" align="center" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" | bState
|-
| colspan="2" | The state to set 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Check Box
|-
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Checked
|-
| colspan="2" | The initial state of the checkbox 
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Text
|-
| colspan="2" | The label for the checkbox 
|-
| width="10%" align="center" | [[File:Fc9-type-24-icon.png]]
| width="90%" | OnClick Macro
|-
| colspan="2" | The macro to call when the user clicks this checkbox 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Style
|-
|-
| width="10%" align="center" | [[File:Fc9-type-3-icon.png]]
| width="90%" | Font
|-
| colspan="2" | Specifies the font style for the item 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Font Size
|-
| colspan="2" | The font size in pixels 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Bold
|-
| colspan="2" | Make the caption text bold 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Italic
|-
| colspan="2" | Make the caption text italicised 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Underline
|-
| colspan="2" | Make the caption text underlined 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Strikethrough
|-
| colspan="2" | Make the caption text crossed-out 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Colour
|-
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Text
|-
| colspan="2" | Specifies the font colour for the item 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Background
|-
| colspan="2" | Specifies the background colour value 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Advanced
|-
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Custom Attributes
|-
| colspan="2" | Text here will be added to the html tag of this component to allow advanced customisation 
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_CheckBox.fcsx FC_Comp_Source_WEBEXP_CheckBox.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_CheckBox.fcsx FC_Comp_Source_WEBEXP_CheckBox.fcsx]

Component: Button ( Control)

2026-04-28T17:05:20Z

SteveT: added an example

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.0
|-
| width="20%" style="color:gray;" | Category
| Control
|}

==Button component==
Creates a momentary or latching button.

==Version information==

Library Version, Component Version, Date, Author, Info
2, 1.0, 14-02-25, ST, Changed generated CSS to ensure disabled button has appropriate features

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

===BasicControls example===
This simple example shows how to sue some basic controls in a Web Developer project.

{{Fcfile|BasicControls.fcweb|BasicControls.fcweb}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/BasicControls.html BasicControls Example]

==Macro reference==

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Caption
|-
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Text
|-
| colspan="2" | The caption displayed on the button 
|-
| width="10%" align="center" | [[File:Fc9-type-12-icon.png]]
| width="90%" | Horizontal Alignment
|-
| colspan="2" | Aligns the caption text on the button 
|-
| width="10%" align="center" | [[File:Fc9-type-3-icon.png]]
| width="90%" | Font
|-
| colspan="2" | Specifies the font style for the item 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Font Size
|-
| colspan="2" | The font size in pixels 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Colour
|-
| colspan="2" | Specifies the font colour for the item 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Bold
|-
| colspan="2" | Make the caption text bold 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Italic
|-
| colspan="2" | Make the caption text italicised 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Underline
|-
| colspan="2" | Make the caption text underlined 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Strikethrough
|-
| colspan="2" | Make the caption text crossed-out 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Shape
|-
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Colour
|-
| colspan="2" | Specifies the fill colour of the button 
|-
| width="10%" align="center" | [[File:Fc9-type-12-icon.png]]
| width="90%" | Style
|-
| colspan="2" | The shape of the button 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Outline Size
|-
| colspan="2" | The outline size in pixels 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Colour
|-
| colspan="2" | The outline colour of the button 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Shadow
|-
| colspan="2" | Add a shadow to the button to provide a 3d look 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Shadow Colour
|-
| colspan="2" | Specifies the fill colour of the shadow 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Interaction
|-
|-
| width="10%" align="center" | [[File:Fc9-type-24-icon.png]]
| width="90%" | OnClick Macro
|-
| colspan="2" | The macro to call when the user clicks this button 
|-
| width="10%" align="center" | [[File:Fc9-type-12-icon.png]]
| width="90%" | Cursor
|-
| colspan="2" | The cursor shape when the user hovers the mouse over the button 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Show Press
|-
| colspan="2" | Offset the button when the user presses it 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Auto-colour
|-
| colspan="2" | Use default colour changes when the user hovers and presses the button 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Hover Colour
|-
| colspan="2" | The colour of the button when the user hovers the mouse over it 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Click Colour
|-
| colspan="2" | The colour of the button when the user presses it 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Advanced
|-
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Custom Attributes
|-
| colspan="2" | Text here will be added to the html tag of this component to allow advanced customisation 
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_Button.fcsx FC_Comp_Source_WEBEXP_Button.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_Button.fcsx FC_Comp_Source_WEBEXP_Button.fcsx]

File:BasicControls.fcweb

2026-04-28T17:04:05Z

SteveT:

A simple Web Developer project

Component: Location ( Data)

2026-04-27T15:52:16Z

SteveT:

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.0
|-
| width="20%" style="color:gray;" | Category
| Data
|}

==Location component==
Component that provides the mobile device's physical location.

==Version information==

Library Version, Component Version, Date, Author, Info
1, 1.0, 23-04-26, ST, Created

==Detailed description==

Many mobile devices have the capability of reporting the physical location of the device (e.g. by using an internal GPS sensor).

This component allows access to this information.

==Examples==

===Plotting geolocation data===
This example regularly plots the current location of the device onto a canvas object.

{{Fcfile|GeolocationPlotter.fcweb|GeolocationPlotter.fcweb}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/GeolocationPlotter.html GeolocationPlotter Example]

==Macro reference==

===Cancel===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Cancel'''
|-
| colspan="2" | Cancels any continuous retrieval of location information. 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===GetPosition===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetPosition'''
|-
| colspan="2" | Asks the device to return position information. The OnSuccess callback will be called with appropriate location information is successful. If unsuccessful, the OnFailure callback will provide the reason for failure. Returns false if geolocation is not supported by the browser. 
|-
|-
| width="10%" align="center" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" | Continuous
|-
| colspan="2" | Set to true to continually monitor the position and receive a callback whenever the location has changed 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" | [[File:Fc9-type-24-icon.png]]
| width="90%" | OnSuccess
|-
| colspan="2" | Called when position info is successfully found. Latitude, longitude and altitude are provided as parameters. The raw object is also provided for advanced information. 
|-
| width="10%" align="center" | [[File:Fc9-type-24-icon.png]]
| width="90%" | OnFailure
|-
| colspan="2" | Called when position info is not returned successfully 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Options
|-
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | MaximumAge
|-
| colspan="2" | Maximum age (in ms) of a possible cached position that is acceptable to return. A value of 0 means the device must always attempt to retrieve to actual current position. 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Timeout
|-
| colspan="2" | The maximum time (in ms) that the device can take when trying to retrieve a position. 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | HighAccuracy
|-
| colspan="2" | Using High Accuracy will provide a more accurate position, but may be slower and increase power consumption. 
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_Geolocation.fcsx FC_Comp_Source_WEBEXP_Geolocation.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_Geolocation.fcsx FC_Comp_Source_WEBEXP_Geolocation.fcsx]

Component: Vibrate ( Data)

2026-04-27T15:46:46Z

SteveT:

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.0
|-
| width="20%" style="color:gray;" | Category
| Data
|}

==Vibrate component==
Component that causes the mobile device to vibrate.

==Version information==

Library Version, Component Version, Date, Author, Info
1, 1.0, 21-04-26, ST, Created

==Detailed description==

Many mobile devices such as mobile phones have internal hardware which can cause the device to vibrate.

This component provides access to this and allows the device to be vibrated using a pattern of vibrations and pauses.

==Examples==

===Vibration example===
This simple example shows how to vibrate a mobile device using a set of buttons.

{{Fcfile|VibrationTest.fcweb|VibrationTest.fcweb}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/VibrationTest.html VibrationTest Example]

==Macro reference==

===Cancel===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Cancel'''
|-
| colspan="2" | Cancels any ongoing vibration 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===Vibrate===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Vibrate'''
|-
| colspan="2" | Send the preset vibration pattern to the mobile device 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===VibrateCustom===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''VibrateCustom'''
|-
| colspan="2" | Send a custom vibration pattern to the mobile device 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Pattern
|-
| colspan="2" | An array of values describing the vibration pattern period 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" | [[File:Fc9-type-16-icon.png]]
| width="90%" | Count
|-
| colspan="2" | The number of vibrations in the sequence 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Length 1
|-
| colspan="2" | The length of the 1st vibration (in ms) 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Pause 1
|-
| colspan="2" | The length of the pause between the 1st and 2nd vibrations (in ms) 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Length 2
|-
| colspan="2" | The length of the 2nd vibration (in ms) 
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_Vibrate.fcsx FC_Comp_Source_WEBEXP_Vibrate.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_Vibrate.fcsx FC_Comp_Source_WEBEXP_Vibrate.fcsx]

Component: Orientation ( Data)

2026-04-27T15:40:32Z

SteveT:

File:DeviceOrientationWithCallback.fcweb

2026-04-27T15:29:18Z

SteveT:

File:DeviceOrientation.fcweb

2026-04-27T15:28:57Z

SteveT:

Component: Motion ( Data)

2026-04-27T15:27:51Z

SteveT:

File:DeviceMotionWithCallback.fcweb

2026-04-27T15:18:42Z

SteveT:

File:GeolocationPlotter.fcweb

2026-04-27T15:16:30Z

SteveT:

File:DeviceMotion.fcweb

2026-04-27T15:15:01Z

SteveT:

File:VibrationTest.fcweb

2026-04-27T15:14:36Z

SteveT:

Component: Motion ( Data)

2026-04-27T15:04:14Z

SteveT: /* Examples */

Component: Speech ( Data)

2026-04-27T14:46:25Z

SteveT: /* Speech Component Test Example */

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.0
|-
| width="20%" style="color:gray;" | Category
| Data
|}

==Speech component==
Component that utilises the SpeechSynthesis module of the browser to convert text to audio.

==Version information==

Library Version, Component Version, Date, Author, Info
1, 1.0, 18-06-24, ST, Created

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

===Speech Component Test Example===
This example lists the available voices and tests the capabilities of the Speech component.

{{Fcfile|Speech component test.fcsx|Speech component test.fcsx}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/Speech%20component%20test.html Speech component test.html]

==Macro reference==

===Cancel===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Cancel'''
|-
| colspan="2" | Cancels the current speech and removes all speech fro the queue 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===GetVoiceCount===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetVoiceCount'''
|-
| colspan="2" | Returns the number of available voices. 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===GetVoiceName===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetVoiceName'''
|-
| colspan="2" | Gets the name of the voice from the list of available voices 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Index
|-
| colspan="2" | The index of the voice (from 0 to the count of available voices) 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===IsPaused===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''IsPaused'''
|-
| colspan="2" | Returns true if speech synthesis is currently paused 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===IsPending===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''IsPending'''
|-
| colspan="2" | Returns true if there is queued text waiting to be spoken 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===IsSpeaking===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''IsSpeaking'''
|-
| colspan="2" | Returns true if there is text currently being spoken, even if speech is currently paused 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===Pause===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Pause'''
|-
| colspan="2" | Puts the speech synthesis into a paused state 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===Resume===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Resume'''
|-
| colspan="2" | Puts the speech synthesis into a non-paused state 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetLanguage===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetLanguage'''
|-
| colspan="2" |  
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | Language
|-
| colspan="2" |  
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetProperties===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetProperties'''
|-
| colspan="2" | Sets the rate, pitch and volume of the speech 
|-
|-
| width="10%" align="center" | [[File:Fc9-f32-icon.png]] - FLOAT
| width="90%" | Pitch
|-
| colspan="2" | Pitch of speech (0.0 to 2.0, or -1 to keep unchanged) 
|-
| width="10%" align="center" | [[File:Fc9-f32-icon.png]] - FLOAT
| width="90%" | Rate
|-
| colspan="2" | Speed of speech (0.1 to 10.0, or -1 to keep unchanged) 
|-
| width="10%" align="center" | [[File:Fc9-f32-icon.png]] - FLOAT
| width="90%" | Volume
|-
| colspan="2" | Volume of speech (0.0 to 1.0, or -1 to keep unchanged) 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetVoice===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetVoice'''
|-
| colspan="2" | Sets the voice to use for speech 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Index
|-
| colspan="2" | The index of the voice to use (0 to voice count, or -1 for default voice) 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===Speak===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Speak'''
|-
| colspan="2" | Sends text to the speech synthesis queue to be spoken. It will be spoken once any other queued speech has been spoken. 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | sText
|-
| colspan="2" |  
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_Speech.fcsx FC_Comp_Source_WEBEXP_Speech.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_Speech.fcsx FC_Comp_Source_WEBEXP_Speech.fcsx]

Component: Speech ( Data)

2026-04-27T14:44:58Z

SteveT: Added an example

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.0
|-
| width="20%" style="color:gray;" | Category
| Data
|}

==Speech component==
Component that utilises the SpeechSynthesis module of the browser to convert text to audio.

==Version information==

Library Version, Component Version, Date, Author, Info
1, 1.0, 18-06-24, ST, Created

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

===Speech Component Test Example===
This example lists the available voices and tests the capabilities of the Speech component.

{{Fcfile|File:Speech component test.fcsx|Speech component test.fcsx}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/Speech%20component%20test.html Speech component test.html]

==Macro reference==

===Cancel===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Cancel'''
|-
| colspan="2" | Cancels the current speech and removes all speech fro the queue 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===GetVoiceCount===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetVoiceCount'''
|-
| colspan="2" | Returns the number of available voices. 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===GetVoiceName===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''GetVoiceName'''
|-
| colspan="2" | Gets the name of the voice from the list of available voices 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Index
|-
| colspan="2" | The index of the voice (from 0 to the count of available voices) 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===IsPaused===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''IsPaused'''
|-
| colspan="2" | Returns true if speech synthesis is currently paused 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===IsPending===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''IsPending'''
|-
| colspan="2" | Returns true if there is queued text waiting to be spoken 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===IsSpeaking===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''IsSpeaking'''
|-
| colspan="2" | Returns true if there is text currently being spoken, even if speech is currently paused 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===Pause===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Pause'''
|-
| colspan="2" | Puts the speech synthesis into a paused state 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===Resume===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Resume'''
|-
| colspan="2" | Puts the speech synthesis into a non-paused state 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetLanguage===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetLanguage'''
|-
| colspan="2" |  
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | Language
|-
| colspan="2" |  
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetProperties===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetProperties'''
|-
| colspan="2" | Sets the rate, pitch and volume of the speech 
|-
|-
| width="10%" align="center" | [[File:Fc9-f32-icon.png]] - FLOAT
| width="90%" | Pitch
|-
| colspan="2" | Pitch of speech (0.0 to 2.0, or -1 to keep unchanged) 
|-
| width="10%" align="center" | [[File:Fc9-f32-icon.png]] - FLOAT
| width="90%" | Rate
|-
| colspan="2" | Speed of speech (0.1 to 10.0, or -1 to keep unchanged) 
|-
| width="10%" align="center" | [[File:Fc9-f32-icon.png]] - FLOAT
| width="90%" | Volume
|-
| colspan="2" | Volume of speech (0.0 to 1.0, or -1 to keep unchanged) 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetVoice===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetVoice'''
|-
| colspan="2" | Sets the voice to use for speech 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Index
|-
| colspan="2" | The index of the voice to use (0 to voice count, or -1 for default voice) 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===Speak===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Speak'''
|-
| colspan="2" | Sends text to the speech synthesis queue to be spoken. It will be spoken once any other queued speech has been spoken. 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | sText
|-
| colspan="2" |  
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_Speech.fcsx FC_Comp_Source_WEBEXP_Speech.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_Speech.fcsx FC_Comp_Source_WEBEXP_Speech.fcsx]

File:Speech component test.fcsx

2026-04-27T14:43:16Z

SteveT:

An example for the Web Developer Speech component

Component: SevenSeg ( Indicator)

2026-04-27T14:35:23Z

SteveT: /* Examples */

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.1
|-
| width="20%" style="color:gray;" | Category
| Indicator
|}

==SevenSeg component==
A single 7 segment web component.

==Version information==

Library Version, Component Version, Date, Author, Info
1, 1.0, 20-06-24, ST, Created
2, 1.1, 19-02-26, ST, Set colOn and colOff during Ev_Initialising

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

===7 Segment from a Slider===
This example takes an input from a slider and outputs the number to a seven segment display. The display prints Err if the number is out of range.

{{Fcfile|SevenSegSlider.fcweb|SevenSegSlider.fcweb}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/SevenSegSlider.html SevenSegSlider Example]

===7 Segment - set individual segments===
This uses switches to control each individual segment. The hex value displayed is the value that can be passed to the SetRawValue macro to show that pattern.

{{Fcfile|SevenSegTest.fcweb|SevenSegTest.fcweb}}

The web app created by this example can be viewed here: [https://www.flowcode.co.uk/example/WebComps/SevenSegTest.html SevenSegTest Example]

==Macro reference==

===SetDigit===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetDigit'''
|-
| colspan="2" | Sets the 7seg to display a digit (0-9) with an optional decimal point 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Digit
|-
| colspan="2" | The digit to display (0-9) 
|-
| width="10%" align="center" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" | ShowDP
|-
| colspan="2" | Set true to show the decimal point 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetOffColour===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetOffColour'''
|-
| colspan="2" | Sets the 'off' colour of the segments 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | Colour
|-
| colspan="2" | A string defining the colour (e.g. "maroon" or "#ff0099") 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetOnColour===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetOnColour'''
|-
| colspan="2" | Sets the 'on' colour of the segments 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | Colour
|-
| colspan="2" | A string defining the colour (e.g. "maroon" or "#ff0099") 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetRawValue===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetRawValue'''
|-
| colspan="2" | Sets the raw byte value for the 7seg (0 - 255), allowing each segment to be individually set 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Value
|-
| colspan="2" | The raw byte value for the display (0-255) 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Digit
|-
|-
| width="10%" align="center" | [[File:Fc9-type-1-icon.png]]
| width="90%" | On colour
|-
| colspan="2" |  
|-
| width="10%" align="center" | [[File:Fc9-type-1-icon.png]]
| width="90%" | Off colour
|-
| colspan="2" |  
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Background
|-
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Back colour
|-
| colspan="2" | Specifies the fill colour of the shape 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Outline size
|-
| colspan="2" | The outline size in pixels 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Outline colour
|-
| colspan="2" | The outline colour of the shape 
|-
| width="10%" align="center" | [[File:Fc9-type-18-icon.png]]
| width="90%" | Value
|-
| colspan="2" |  
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_7SEG1.fcsx FC_Comp_Source_WEBEXP_7SEG1.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_7SEG1.fcsx FC_Comp_Source_WEBEXP_7SEG1.fcsx]

Component: SevenSeg ( Indicator)

2026-04-27T12:24:54Z

SteveT: Fixed the example and added another

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.1
|-
| width="20%" style="color:gray;" | Category
| Indicator
|}

==SevenSeg component==
A single 7 segment web component.

==Version information==

Library Version, Component Version, Date, Author, Info
1, 1.0, 20-06-24, ST, Created
2, 1.1, 19-02-26, ST, Set colOn and colOff during Ev_Initialising

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

===7 Segment from a Slider===
This example takes an input from a slider and outputs the number to a seven segment display. The display prints Err if the number is out of range.

{{Fcfile|SevenSegSlider.fcweb|SevenSegSlider.fcweb}}

[https://www.flowcode.co.uk/example/WebComps/SevenSegSlider.html SevenSegSlider Example]

===7 Segment - set individual segments===
This uses switches to control each individual segment. The hex value displayed is the value that can be passed to the SetRawValue macro to show that pattern.

{{Fcfile|SevenSegTest.fcweb|SevenSegTest.fcweb}}

[https://www.flowcode.co.uk/example/WebComps/SevenSegTest.html SevenSegTest Example]

==Macro reference==

===SetDigit===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetDigit'''
|-
| colspan="2" | Sets the 7seg to display a digit (0-9) with an optional decimal point 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Digit
|-
| colspan="2" | The digit to display (0-9) 
|-
| width="10%" align="center" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" | ShowDP
|-
| colspan="2" | Set true to show the decimal point 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetOffColour===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetOffColour'''
|-
| colspan="2" | Sets the 'off' colour of the segments 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | Colour
|-
| colspan="2" | A string defining the colour (e.g. "maroon" or "#ff0099") 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetOnColour===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetOnColour'''
|-
| colspan="2" | Sets the 'on' colour of the segments 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | Colour
|-
| colspan="2" | A string defining the colour (e.g. "maroon" or "#ff0099") 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetRawValue===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetRawValue'''
|-
| colspan="2" | Sets the raw byte value for the 7seg (0 - 255), allowing each segment to be individually set 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Value
|-
| colspan="2" | The raw byte value for the display (0-255) 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Digit
|-
|-
| width="10%" align="center" | [[File:Fc9-type-1-icon.png]]
| width="90%" | On colour
|-
| colspan="2" |  
|-
| width="10%" align="center" | [[File:Fc9-type-1-icon.png]]
| width="90%" | Off colour
|-
| colspan="2" |  
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Background
|-
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Back colour
|-
| colspan="2" | Specifies the fill colour of the shape 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Outline size
|-
| colspan="2" | The outline size in pixels 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Outline colour
|-
| colspan="2" | The outline colour of the shape 
|-
| width="10%" align="center" | [[File:Fc9-type-18-icon.png]]
| width="90%" | Value
|-
| colspan="2" |  
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_7SEG1.fcsx FC_Comp_Source_WEBEXP_7SEG1.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_7SEG1.fcsx FC_Comp_Source_WEBEXP_7SEG1.fcsx]

File:SevenSegTest.fcweb

2026-04-27T12:23:25Z

SteveT:

Shows how to set individual segments on a 7 seg component

File:SevenSegSlider.fcweb

2026-04-27T12:16:49Z

SteveT:

An example using the 7 segment Web Developer component

Component: ImageUrl ( Web Primitives)

2026-04-27T10:32:06Z

SteveT: Removed the incorrect into about fonts

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 0.1
|-
| width="20%" style="color:gray;" | Category
| Web Primitives
|}

==ImageUrl component==
Creates an image that opens a web page when clicked.

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

''No additional examples''

==Macro reference==

===SetParameters===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetParameters'''
|-
| colspan="2" | Set the parameters to append to the target URL link. (e.g. "?param1=5&param2=red") 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | s
|-
| colspan="2" | Text to set 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetURL===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetURL'''
|-
| colspan="2" | Set the target URL for the link 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | s
|-
| colspan="2" | Text to set 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" | [[File:Fc9-type-13-icon.png]]
| width="90%" | Filename
|-
| colspan="2" | The location of an external image file 
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | AltText
|-
| colspan="2" |  
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | URL
|-
| colspan="2" | The target URL for this image 
|-
| width="10%" align="center" | [[File:Fc9-type-7-icon.png]]
| width="90%" | Open in new tab
|-
| colspan="2" | Select true if the link should open in a new tab 
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Advanced
|-
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Custom Attributes
|-
| colspan="2" |  
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_ImageUrl.fcsx FC_Comp_Source_WEBEXP_ImageUrl.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_ImageUrl.fcsx FC_Comp_Source_WEBEXP_ImageUrl.fcsx]

Component: Bluetooth ( Comms)

2026-04-27T10:27:03Z

SteveT: Removed incorrect example

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 0.1
|-
| width="20%" style="color:gray;" | Category
| Comms
|}

==Bluetooth component==
Allows connection to a bluetooth device from the browser.

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

''No additional examples''

==Macro reference==

===Disconnect===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Disconnect'''
|-
| colspan="2" | Disconnects from the remote BLE device 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===RequestDevice===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''RequestDevice'''
|-
| colspan="2" | Attempts to connect with a Bluetooth BLE device. 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===WriteString===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''WriteString'''
|-
| colspan="2" | Writes a string value to GATT Characteristic on a connected BLE device 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | sText
|-
| colspan="2" |  
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" | [[File:Fc9-type-11-icon.png]]
| width="90%" | Filters
|-
| colspan="2" | Limits the list of available Bluetooth devices, for example: filters: [ { services: [0x1802, 0x1803] } ] filters: [ { name: "My Cool Device" } ] filters: [ { namePrefix: "Mtx" } ] filters: [ { services: ["heart_rate"] } ], optionalServices: ["battery_service"] (leave blank for all devices)  
|-
| width="10%" align="center" | [[File:Fc9-type-24-icon.png]]
| width="90%" | OnDisconnect
|-
| colspan="2" | Called when the Bluetooth device is disconnected 
|-
| width="10%" align="center" | [[File:Fc9-type-24-icon.png]]
| width="90%" | OnValueChanged
|-
| colspan="2" | Called when the Bluetooth characteristic value changes 
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Service
|-
| colspan="2" | The Primary Service of the Bluetooth GATT Server 
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Characteristic
|-
| colspan="2" | The Bluetooth GATT Characteristic 
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_Bluetooth.fcweb FC_Comp_Source_WEBEXP_Bluetooth.fcweb]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_Bluetooth.fcweb FC_Comp_Source_WEBEXP_Bluetooth.fcweb]

Component: SevenSeg ( Indicator)

2026-04-27T10:26:46Z

SteveT: added the example (was in Bluetooth for some reason)

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 1.1
|-
| width="20%" style="color:gray;" | Category
| Indicator
|}

==SevenSeg component==
A single 7 segment web component.

==Version information==

Library Version, Component Version, Date, Author, Info
1, 1.0, 20-06-24, ST, Created
2, 1.1, 19-02-26, ST, Set colOn and colOff during Ev_Initialising

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

Example takes an inpt from a slider and outputs the number to a seven segment display. The display prints Err if the number is out of range.

{{Fcfile|7segtest.fcsx|Web 7 Segment Display Example}}

[https://www.flowcode.co.uk/wiki/WebDevExamples/7segtest.html Web 7 Segment Display Example]

==Macro reference==

===SetDigit===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetDigit'''
|-
| colspan="2" | Sets the 7seg to display a digit (0-9) with an optional decimal point 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Digit
|-
| colspan="2" | The digit to display (0-9) 
|-
| width="10%" align="center" | [[File:Fc9-bool-icon.png]] - BOOL
| width="90%" | ShowDP
|-
| colspan="2" | Set true to show the decimal point 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetOffColour===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetOffColour'''
|-
| colspan="2" | Sets the 'off' colour of the segments 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | Colour
|-
| colspan="2" | A string defining the colour (e.g. "maroon" or "#ff0099") 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetOnColour===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetOnColour'''
|-
| colspan="2" | Sets the 'on' colour of the segments 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | Colour
|-
| colspan="2" | A string defining the colour (e.g. "maroon" or "#ff0099") 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===SetRawValue===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''SetRawValue'''
|-
| colspan="2" | Sets the raw byte value for the 7seg (0 - 255), allowing each segment to be individually set 
|-
|-
| width="10%" align="center" | [[File:Fc9-s32-icon.png]] - LONG
| width="90%" | Value
|-
| colspan="2" | The raw byte value for the display (0-255) 
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Digit
|-
|-
| width="10%" align="center" | [[File:Fc9-type-1-icon.png]]
| width="90%" | On colour
|-
| colspan="2" |  
|-
| width="10%" align="center" | [[File:Fc9-type-1-icon.png]]
| width="90%" | Off colour
|-
| colspan="2" |  
|-
| width="10%" align="center" style="background-color:#EAE1EA;" | [[File:Fc9-conn-icon.png]]
| width="90%" style="background-color:#EAE1EA; color:#4B008D;" | Background
|-
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Back colour
|-
| colspan="2" | Specifies the fill colour of the shape 
|-
| width="10%" align="center" | [[File:Fc9-type-21-icon.png]]
| width="90%" | Outline size
|-
| colspan="2" | The outline size in pixels 
|-
| width="10%" align="center" | [[File:Fc9-type-2-icon.png]]
| width="90%" | Outline colour
|-
| colspan="2" | The outline colour of the shape 
|-
| width="10%" align="center" | [[File:Fc9-type-18-icon.png]]
| width="90%" | Value
|-
| colspan="2" |  
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_7SEG1.fcsx FC_Comp_Source_WEBEXP_7SEG1.fcsx]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_7SEG1.fcsx FC_Comp_Source_WEBEXP_7SEG1.fcsx]

Components

2026-04-27T10:17:39Z

SteveT: Removed hidden "WebDeveloper->Creation->Primitives" section

In Flowcode IDE, a component is a predefined module or building block that represents a physical or logical element, which can be added to your project to simplify the process of designing and simulating embedded systems. These components can range from hardware elements like sensors, actuators, and communication devices, to software elements like variables, timers, or logic gates.

Each component typically comes with its own properties, methods, and events, which allow users to configure and interact with the component in a graphical way. For example:

Hardware components: These include microcontrollers, LEDs, motors, displays, or communication interfaces like I2C, SPI, and UART.
Software components: These are functional blocks such as delays, counters, or decision-making constructs like conditionals or loops.
Flowcode simplifies embedded programming by allowing you to drag and drop these components into your design, and then connect and configure them without the need to write low-level code manually. However, it still offers the flexibility to add custom code when needed.

Each component can also be simulated, allowing you to test and debug your design before deploying it to the actual hardware.
__TOC__

==Embedded Components==

<tabs>

<tab name="Inputs">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | General Input
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 0e4cb9c6_10d4_416f_bc27_5f8f7bc746b4|Grey Code Encoder]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9dba6468_db7d_4eae_8b94_7bd35fd115b1|Grey Code Encoder 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 76bb1b8c_43da_48d3_b53f_a9907f03a528|IO Expander (MCP23017)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 331daac0_653d_4f45_9822_6408a8258bda|IO Expander (MCP23S17)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d43a1c1f_8ad6_4271_9f62_20e1bdf529f0|IO Expander (PCF8574)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4616b658_531f_4c5e_981a_4d9fc04f9a36|IO Expander (PCF8575)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 3531a68d_7686_44b7_a3a5_67afda8467dc|Quadrature Encoder]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 50d58a97_3208_4ff3_bcd4_0d2b1c22dc1c|Quadrature Encoder]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Analog Input
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 937e425e_21c0_4b08_8d8f_0bf80a6391d2|ADC (AD7680)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 235fd689_bfd1_4c4a_a918_6c3c36e9a49f|ADC (MCP356X)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ee11c499_8a22_4987_ba57_c7d5d2224a39|ADC 24bit ADS1220]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fd24f205_3750_4324_8c2c_94a6c0377475|ADC ADS1256]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e65e5368_af24_44a9_897e_cb0422fcea27|ADC QUAD + DAC (PCF8591)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7aad74d6_b24e_4dab_91eb_5d72a973f12d|ADC Template]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9b845489_48f5_4fa5_aace_2c97efdcede3|ADC Template 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f788c9e7_2e69_4be9_b41e_5fdced777c2e|ADC16bit ADS111x]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 74571cdc_4f94_4e9a_b56b_376f36424996|Joystick (Sparkfun Quiic)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 94c78e1b_f580_4105_a223_7e40b75d134c|Joystick (Sparkfun Quiic) 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 11ca2f38_de81_4812_9338_4b5a7a89a658|Potentiometer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3d8f329f_3bf9_4c90_8797_05100f6419f8|Potentiometer (Slider)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Switch
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 9306f758_06af_49f8_8b09_d10d2b4374dd|Rotary Switch]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 6f2c4205_6a87_46ba_a8b4_8c869e144fcd|Switch (Microswitch)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e2698f3e_1168_4f25_9c50_24a74ea7e34a|Switch Push Button]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 58b37280_d90e_4a23_941d_26f34ccff410|Switch Rotary 0 - 1]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e5dbdd14_0308_4a22_bacd_765215a4df45|Switch Rotary 0 - 15]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1df1ea9a_6983_4014_aba5_f5144ea4e053|Switch Slide]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d43ac17c_2ec0_4277_95f9_fbc339456fab|Switch User Images]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Switches
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 208101fb_f735_4e83_980b_c1d2b4be28ff|Switch Array (Push)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cd8da0fe_80cf_4532_bb50_69f0d1730e70|Switch Array (Push)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 4ac72986_ad7d_49ce_afe5_9128831debc9|Switch Array (Slide)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 975b2770_cfa8_4c76_b8ca_c008735e366d|Switch Array (Slide)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Keypad
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6c74b9ee_2907_4b1e_8a9b_80fc192b6027|Keypad]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1d24df27_423c_4d91_b2bb_e6ad3e121f14|Keypad (Cursor 3x3)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 287e2f0b_8869_4994_a958_c8f851091322|Keypad (Hex 4x4)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Outputs">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | General Output
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 76bb1b8c_43da_48d3_b53f_a9907f03a528|IO Expander (MCP23017)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 331daac0_653d_4f45_9822_6408a8258bda|IO Expander (MCP23S17)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d43a1c1f_8ad6_4271_9f62_20e1bdf529f0|IO Expander (PCF8574)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4616b658_531f_4c5e_981a_4d9fc04f9a36|IO Expander (PCF8575)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 444fb704_814c_4707_a15c_759ba088505c|PWM (Internal)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5bd41be2_1b9c_4f30_ba78_84cb29d61ced|PWM 16CH 12Bit (PCA9685)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2f95990b_1dc6_4cb4_a6b1_e000a487b702|Relay (Grove 103020005)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Analog Output
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e65e5368_af24_44a9_897e_cb0422fcea27|ADC QUAD + DAC (PCF8591)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3d87ffe9_97c1_4013_a2cd_82c24d0ccb48|DAC (AD5662)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 09222494_fbef_455b_9651_9e9e46592eb5|DAC (Internal)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e78d88a0_e132_4f82_988d_59353009b669|DAC (MCP4725)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 70a3bead_e66d_4a76_bc7b_fb1baa86d2e6|DAC (MCP47x6)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fab5cf20_8686_4397_8a21_cc936659d5f6|DAC (MCP48x1)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b6de5668_e0ae_4c1a_9c16_b16aa3f58024|DAC (MCP49x1)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f484e96a_af4f_434e_a002_70d3f4315dfb|DAC Dual (MCP48x2)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b66f5769_5e9d_40e7_9159_c6a0552ff86e|DAC Dual (MCP49x2)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID adb523db_db13_4d19_bfa3_0fbc177e4d3f|DAC Quad (MCP4728)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a4c8e3f2_9b7d_4e1a_8c5f_3d6e9a2b4c7d|DDS DAC (AD9834/AD9833)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID a3bfda42_750b_4baf_8428_3536dcfc72cd|DDS DAC Synth (AD9851)]]
| width="20%" align="center" style="background-color:#FFFFFF;" | both
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b48a8c76_b62d_4b52_9368_237e5a2dbd4a|Digital Potentiometer (AD528X)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 37025734_a84d_46ad_9078_925beb81f38b|Digital Potentiometer (MCP41XX / MCP42XX)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID aba8b3ce_e71c_49c8_a961_d59b36338afa|Digital Potentiometer (MCP41XXX / MCP42XXX)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3a3a0802_42b6_4c31_8983_4d043b70b443|Digital Potentiometer (MCP44XX)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a69bf9b3_272e_44b3_a47d_22f53c3c0804|Digital Potentiometer (MCP45XX / MCP46XX)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0a0819d2_73b7_4bc2_bc11_f3139972d224|Digital Potentiometer (X9Cx0x)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Audio Output
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 04bbd3b8_ee11_40eb_91e8_1bbbd6f65b8c|Buzzer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2061d38d_0cca_440c_a842_f9c84ca55f90|DFPlayer (MP3 / WAV)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 70ec3aee_f273_4b0e_8ee6_e2b3a8b693af|Piezo Sounder]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 01fd689c_985c_4b10_bc98_99de5f9b41a8|Speech (Phoneme)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eaee384d_6b16_4988_b1aa_8628231a7128|WAV Library File]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | LED
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 44f82374_a417_40d5_bd42_23a177a390d2|LED Mono]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ce086f9b_c365_4471_b6e4_1760a53a7bfb|LED Mono Custom]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b562ceda_0ae0_4c50_bbcd_38a4b7e77829|LED Mono User Images]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 67271369_4b2e_4126_a5d0_a93142ac71b9|LED MultiColour Bi (5mm, PCB)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID a5c2033e_8639_4de3_80eb_58c02b44bd96|LED MultiColour Tri (5mm, PCB)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | LEDs
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID bbfc7c9f_fa05_4257_849d_8601ff7dc1de|Chainable RGB LED v2.0 (Grove 104020048)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b07ae733_c144_4558_979a_be737044519c|LED Array]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 6664b695_2a8f_4247_ae55_110b38270877|LED Bar v2.0 (Grove 104020006)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fef1acfd_e19f_4af2_9593_ba341240ce4f|LED Charlieplex]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID ef9cb184_0167_4d3e_a63b_6e0faad72391|LED Matrix]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 24bef796_e0e3_4195_a76d_920fdba5ea79|LED Matrix (Parallel)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 5a88c882_0396_44f3_a67b_f236244800d1|LED Matrix (Serial)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID 0161e243_0ca0_497d_88be_76351cf4dfa1|RGB LED APA102C]]
| width="20%" align="center" style="background-color:#FFFFFF;" | both
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID 12a23e2a_0b1e_427e_975a_f0b56d4a9483|RGB LED LP5030 LP5036]]
| width="20%" align="center" style="background-color:#FFFFFF;" | both
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID 284bf38b_0fe1_4a0b_ae43_e1784445821b|RGB LED SK6812 RGBW]]
| width="20%" align="center" style="background-color:#FFFFFF;" | both
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID d814cb36_0d04_4eeb_b5b3_da8276ad8bdf|RGB LED WS2801]]
| width="20%" align="center" style="background-color:#FFFFFF;" | both
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID d977c3ef_c7dc_4683_a1be_76e17e6ba12b|RGB LED WS2811 / WS2812 / APA106]]
| width="20%" align="center" style="background-color:#FFFFFF;" | both
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Mechatronics
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 83c095cc_fefc_4854_a7c5_7fe867753bf4|Coupling]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4b0e5196_0db2_45a9_bcb9_b172f71f9c4d|DC Motor]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID bfa45502_f9d6_4b53_a239_b5731f9288d5|Gearbox]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 50eddda0_73c3_4514_b2e0_7e33abeaa162|Grove I2C Motor Driver]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 2e8c4276_d81c_4dd6_a70f_aad25e8bbf1e|Kinematics Arm]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 15921536_cf92_4cd3_88e4_207c251ab775|Linear Actuator]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7b03c836_c1f9_4ab5_8bf2_787a55e792e0|ST3215 Servo Motor]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 02668c1b_013c_43b8_a5b3_4f9d73412137|Servo Motor]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9202a62e_0a42_4780_adce_16b701e5ec53|Servo Motor Controller]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1ac8ae8b_bcd2_493f_b516_36dacb3695f9|Solenoid DC]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b331ed08_2a01_466e_9816_df3342019892|Stepper Motor]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Displays">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Segment
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID d9e86781_7fa0_4e64_9f82_ef49152611b0|4-Digit Display (Grove 104030003)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3299d5f9_92a6_414a_af9f_f7fe29b3e6ed|4-Digit Display (Grove 104030003) 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID e2c3165d_8020_4e52_bc7e_7022ff459129|7Segment]]
| width="20%" align="center" style="background-color:#FFFFFF;" | both
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID bddc472f_59dc_4705_997e_662768d643cd|7Segment (74HC595)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 727806c8_26a4_489a_a11e_4ef0306694f5|7Segment (74HC595) 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 4de4697e_2de3_432e_a0fe_97ef8c79dfc0|7Segment (Hex TM1637)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5c1232f7_2af1_4ce9_9124_1ad038ac09d8|7Segment (Hex TM1637) 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e6bd0a57_6bf2_42bb_b05e_6b6cdad2ce0e|7Segment (Quad TM1637)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID f4400e36_dd95_4472_86da_4bba68d68d5d|7Segment (Quad)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 71f200a6_153f_4984_8928_850523305e02|7Segment (Quad) 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 52c5383b_4f48_4029_8b75_c3633f7cf892|7Segment (Single)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6a9e9265_e261_4604_8dc3_252ea3ccf02c|7Segment (Single)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 5015c7e1_2166_4f1a_b9b1_9bd181784cea|Starburst Display]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ae5688c5_6bfc_4e62_aaf4_e9a56fb068f9|Starburst Display]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Alphanumeric
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 672cb410_6026_403b_aff7_0628fe9e8140|LCD (Adafruit, 16x2)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 913991df_9bcb_475a_ae49_d9eb611b0d71|LCD (Adafruit, 20x4)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f8c9b53d_0bf2_469f_8f0a_34caa93749ba|LCD (Generic, 16x2)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a2b40602_5421_4e2f_ba82_96db1be51d69|LCD (Generic, 20x4)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 51677753_5eaf_4e3a_a3c8_71c49a142171|LCD (Generic, Configurable)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f45468b8_5731_4bfb_b5c0_4042ef1dd1da|LCD (Grove - I2C)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 31326041_9339_4cf4_b609_c14cc66318b3|LCD (Grove - UART)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 24a7a014_0ad0_44a7_b63b_61dac014eee7|LCD (ST7032i)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID bcd6a955_12c6_4ed4_a22f_f16eb62e0762|LCD I2C (Backpack)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3cf64267_8c56_47b0_84a1_a933a77716bc|LCD I2C (LCM1602)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c198e346_6b0f_4309_973c_78d7207e0b96|LCD SPI (MiniClick)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Graphical Color
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ac3375c7_acf3_4160_8c3e_3011735116aa|GLCD (E-BLOCKS 3)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3167b57a_5a41_4a91_bd6c_e0a8cc23cf56|GLCD (GC9A01A SPI)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 79f105db_3eb0_45cb_b3fb_e4b6d6e94358|GLCD (ILI9163C)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7bd84555_ae51_40cc_8e1a_a7bcba661e52|GLCD (ILI9341 SPI)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID bc0a0612_ef85_48fb_8960_5e78f4083df1|GLCD (ILI9341)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3408fde0_f512_487b_8902_74cd56623191|GLCD (ILI9488 SPI)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b5148d9e_884c_488e_8536_741e7fc4306c|GLCD (ILI9488)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 641b19bc_b941_46de_843d_229ca347466d|GLCD (LS020)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0a432f5f_d9a0_4726_9b42_18de4eeddfd8|GLCD (SSD1289)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e635704b_9d69_466c_be7f_a03543f011a6|GLCD (SSD1331)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8af7f5ec_2e7a_4080_9566_b816c24ebbfa|GLCD (SSD1351 SPI)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fd1a193b_149f_4ba8_b1ce_ce39ca863975|GLCD (SSD1351)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9d414a42_fd9b_4afd_9493_dbf80eece14a|GLCD (SSD1963) Parallel]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 37f69c17_886a_4b13_9daf_8dde9a1cce40|GLCD (ST7735)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4e30b15e_2507_4583_995d_b2056e04a286|GLCD (ST7789V)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b8541d78_44db_43c3_961a_a96141da67e9|GLCD (ST7796 SPI)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a00b9a94_9608_4208_af26_68a94dab336b|GLCD (STM32F429ZI)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5bd73e47_8060_4677_a1a3_6191ceb924b7|GLCD (STM32F469NI)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6a2520bc_d8dd_4001_937e_21925253291a|GLCD (STM32F746NG)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 756045fb_388b_4dbb_8f10_5136de8bfacb|Nextion Display]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7c3895d3_0359_4b4c_8fa4_ab6314cd5fbf|Raspberry Pi HDMI]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Graphical Monochrome
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8a7a90d2_3274_4433_8609_699e976e0719|GLCD (Grove OLED)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c9d3b357_b914_4301_a741_0d13819e441c|GLCD (KS0108)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a1edc3df_71d0_4ec5_a511_05818570696f|GLCD (PDC8544)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ebf9c18e_044e_41e2_b845_da14e744b25f|GLCD (SH1106) I2C]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 91c1b7f5_6974_4ea3_84b3_4e24a9784631|GLCD (SH1106) SPI]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5ed21fc4_3979_4825_8c8e_95944d1101d9|GLCD (SSD1305)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8fccb5eb_1664_4dd5_9d2e_5c62294a7151|GLCD (SSD1305) Buffered]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID dfe103f9_ef5c_4554_85be_7519ec274609|GLCD (SSD1305) I2C]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7b1ef6f5_5c39_4b7f_9faf_eed122ff2b3e|GLCD (SSD1306)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9e067700_36d1_4697_a165_9e8d60b45399|GLCD (SSD1306) Buffered]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f6ab6074_68ba_4cd4_9274_f973102f8518|GLCD (SSD1306) I2C]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f0f2f410_3216_4a3f_a2dc_db35f4a2821d|GLCD (SSD1322) Buffered]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID dba19ea1_efe2_46e4_90be_18ee41930d1e|GLCD (SSD1322) Parallel]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6548a7da_7e0b_4d45_ad92_f61bf5713442|GLCD (SSD1327) I2C]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID deade808_da0a_4530_8cf4_7c7894fdb6a3|GLCD (SSD1327) SPI]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 496cf2f0_4220_4f70_9219_7c67c672e36e|GLCD (ST7036) I2C]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 889a6ac6_12d0_40c0_9882_075ce9801eeb|GLCD (ST7565R) Parallel]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2149fdef_84e9_407d_b68d_fc7f39e6f41e|GLCD (ST7565R) SPI]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7e19b0ee_6cfd_49d3_8efb_67e7b145dfba|GLCD (ST7567) SPI]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 022045f0_7e41_4385_a79f_7cdbd9b71c6a|GLCD (ST7567) SPI NOBUFF]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 804de427_4b97_4468_9ea9_b5adf7b98771|GLCD (ST7920)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c9d3b357_b914_4301_a741_0d13819e452e|GLCD (T6963C)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 71ba0cdd_e003_4f6d_9dae_8eecffd1774b|GLCD (TLS8201)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ebd426a3_c694_42bb_8611_320e27c6ea65|GLCD (UC1701)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 65f9d966_4d43_498f_b6ca_2e66e49a2379|GLCD eINK (IL3829)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2c2a1a7c_bd81_4327_9902_dc1b2f6156d0|GLCD eINK (SSD1681)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Display Plugins">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Graphical Library
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cbfb3c21_f13d_488d_9b90_400c8d4fc605|Display Manager]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b02b7c75_53cb_4be4_871f_61be633d898c|GLCD Bitmap Drawer FAT]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 52dd90bd_fec9_4ee5_934c_e4b2297168a5|GLCD Bitmap Drawer ROM]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d4994410_ca95_4d1c_8d57_542d48a21d58|GLCD Graph Creator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7b198227_81d6_404c_a2d4_ce1e59ef84f8|GLCD Graph Creator XY]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0df0d376_b9dd_4c40_8102_1b0203980c3c|GLCD QR Code Generator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9e0fa7e4_0c8c_485d_98c4_6f0ef8e57d40|GLCD Textfield]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 90c9f255_b526_4288_b0b6_26736e6db2e2|Touch Screen (FT6X06)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3c28ab9b_d363_402e_a99b_ff109b8729e3|Touch Screen (GT911)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fe5255ed_0613_4e5b_b011_9f432531832e|Touch Screen (Resistive)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ab872cc0_e6fe_4d30_a7cb_a1efc6ae87a6|Touch Screen (XPT2046)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Graphical Manager Primitives
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID 30e9f969_f18c_45c4_bac0_5ec85a48120f|Bitmap]]
| width="20%" align="center" style="background-color:#FFFFFF;" | wysiwyg
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID 42949d26_33e7_4a67_bc39_4969cd287c2b|Ellipse]]
| width="20%" align="center" style="background-color:#FFFFFF;" | wysiwyg
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID 07faadd6_e3af_4802_b101_baf82838d103|Hidden]]
| width="20%" align="center" style="background-color:#FFFFFF;" | wysiwyg
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID d478e9ec_2929_4b85_b226_427f079f1873|Line]]
| width="20%" align="center" style="background-color:#FFFFFF;" | wysiwyg
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID d13b1e7c_32a2_4117_9b76_8cd03399dc3c|Rectangle]]
| width="20%" align="center" style="background-color:#FFFFFF;" | wysiwyg
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID 852ae874_e901_47e9_977b_5e2f3af0bef1|Rounded Rectangle]]
| width="20%" align="center" style="background-color:#FFFFFF;" | wysiwyg
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID 471eab69_d1c0_45eb_88f8_d01bd7167b23|Slider]]
| width="20%" align="center" style="background-color:#FFFFFF;" | wysiwyg
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID 81f24c15_ab7c_49ba_b55f_62d3cbfee92a|Text]]
| width="20%" align="center" style="background-color:#FFFFFF;" | wysiwyg
|-
|}

</tab>

<tab name="Sensors">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Audio
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0a5d4625_78e6_4bf3_a802_925c655ef718|Heelight Sensor (Grove 101020312)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3bb0eba4_8ae3_442b_8653_507d1bde8be0|Sound Sensor (Grove 101020023)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c5d9ffa3_5a7d_4fb2_b9ba_ec855ad7b25c|Ultrasonic]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 06c52475_f44f_41f3_aae7_9ddeee44fc06|Ultrasonic Ranger (Grove 101020010)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Electrical
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d5f0360d_ba69_4cc4_af4a_c2621fd2d77d|Battery Cell Fuel Gauge (MAX17043 MAX17044)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID aa85a268_ba47_4a33_bdad_04f51b716cdf|Current Sensor (ACS7xx)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 09d2a023_0199_4c73_a737_14228973ddc5|Current Sensor (ILA260)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ef2427ea_7767_43be_a0c5_6f705e3c2668|Energy Monitor (PZEM-004T)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 29b4cd01_9dd8_43ad_b5b4_895358321a89|LTSR Current Transducer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Environmental
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c416a604_834b_48ba_a5e8_a47cad4f08de|Air Quality (BME688)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ea4894d0_fb58_4cfc_bae6_2502eb3e68d0|Air Velocity Sensor (FS3000)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 69a2ca78_26f3_47df_a402_b5a7c1ff73f2|Analogue Temp Sensors]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a9eb79b0_1d24_4acf_aade_d3639aa800c7|Barometer (BME280)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 38f89887_af35_470e_8c6f_c91f3c99e88d|Barometer (BMP180)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b52758bf_4466_48c0_8054_33ee4b11e82b|Barometer (BMP280 / Grove 101020192)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ca60c1d2_fb77_4e3e_9d01_c4496d35db1e|Barometer (DPS310)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b8c43425_121c_4dfc_8a70_665973e9938b|Barometer (MS5637)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2755f2ee_60e0_4e4d_9bce_8bffb3a6a730|Humidity AHT10]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 36175036_08af_4bcf_8dd2_1c46f6761385|Magnetometer (BMM150)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID caa29480_5f50_4c3b_8dac_22cfb8e36999|Pulse Oximeter (Max30100)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e3b5f8d2_6f4a_4fbc_a4f9_9c7f5a1a3b65|RTD (MAX31865)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 40785d28_4fe3_4aec_a5d9_ba30b2d58760|Temp / Humidity (DHT11)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 95a1525b_7e03_4836_8c09_59bf174f603b|Temp / Humidity (DHT22)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0689100f_8b13_45a6_98a2_b9833b02eed5|Temp / Humidity (Grove 101020019)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eca89720_1386_4589_ab75_6c0425162b91|Temp / Humidity (Grove 101020212)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 66e6f00d_d894_49de_a768_02997eaf45e1|Temp / Humidity (HTS221)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 75d7da2a_c682_4622_ac86_b6eb9ed7a88e|Temp / Humidity (SHT21)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4475d8e8_4f60_48be_8a27_e91d85fbabae|Temp / Humidity (SHT31)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cc6a9919_31de_480e_91c9_2a59254a5bbd|Temp / Humidity (SHT41 / BL0144)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID df4eca75_779f_47ce_9495_56d3233be5e1|Temperature (DS1822)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 783b7689_0c71_44fb_9dde_673e4b7455ba|Temperature (DS18B20)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b42d9405_a751_4622_8fbe_ce512da391ba|Temperature (DS18S20)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID bbf0ab46_623e_44c6_9402_3acfcd9d0006|Temperature (LM75B)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ca3bcd05_64e6_4daf_8b9f_71751c16a22a|Temperature (TMP117)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 05acf53c_0b2e_4d26_8d5d_f112d4ce4c68|Temperature Infrared (Grove 101020062)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID de8dcab3_c23b_48b4_a88e_3eb8b584109f|Temperature Sensor (Grove 101020015)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 93ab1895_66cf_4fd8_a04f_79f09acc19e6|Thermistor]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1dac9b91_e842_40a6_9826_890f2d6f7a79|Thermistor Using Beta]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 97e631c7_51d9_4482_9b65_481b390a686d|Thermocouple (MAX31855 / BL0126)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cbedb7e1_22c3_4edc_80f8_0501f7f9e398|Thermocouple (MAX31856)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 60de8264_7faf_4f77_904e_69bb19909ba8|Thermocouple (MCP960X)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4b57ccb5_9e55_4d0e_8961_43f6fcaec2d7|Water Sensor (Grove 101020018)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Force
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e8ec17bd_a898_44d2_83af_968c96826948|Bridge Amplifier (HX711 / BL0122 / BL0132)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Light
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e08872a7_6962_4b61_bcca_71389f8ed8d7|Ambient Light]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID d79f7da1_0e33_4fba_b4a0_ac127b5a4812|Beam Breaker]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID d8b85f99_8de3_41dd_9bab_f8bfc19e74af|Colour Sensor]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID a1ea988c_88c9_4f96_ac26_1684e918a3de|Colour Sensor (Grove 101020341)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID ee2e1541_45ee_492c_a47d_014627e6b9b6|Colour Sensor V3 (Grove 101021133)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e1d52efb_00d4_4e19_ba4c_29b292535ea1|Infrared Array AMG88xx]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID f3b8eed1_fef6_4c1b_b62d_8efc84b1be35|Infrared Reflective Sensor (Grove 101020174)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9c5b7454_e67d_4111_b220_bf8e5ff8b174|Light Sensor (Grove 101020132)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ccbd6829_44c8_4011_954b_c39dd93adbed|PIR Motion (Grove 101020020)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 20a48db1_d91d_4c51_a49f_f878d0bcbad3|Photo Reflector]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3d1bbeb7_0fb3_4356_a2a6_e1b4cd28e0ff|Photo Reflector 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 6e5b4f6f_e2d9_4272_a854_749a762f55c1|Photo Transistor]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID bb2fcffe_6f54_412e_adaf_bdebea1f83d2|Photo Transistor 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 488c3a77_9ff2_4e60_9bfd_cf074405e294|Range Time of Flight (VL53L0X)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Magnetic
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c14492da_a844_40e6_ae29_50e58864b237|Hall Effect Analog]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 655234db_5700_4206_934f_56e499edbff9|Hall Effect Digital]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 594f7ca0_ca51_4c94_8d49_42cc77c81a92|Magnetic Encoder (AS5600)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 1c8bc72f_4944_4456_af99_9686c237d6b3|Reed Switch]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Movement Orientation
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 20699a0c_0925_40c4_8aa1_35f294e225e6|Accel / Gyro / Mag 9-Axis (LSM9DS1 / BL0135)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5d2c6406_e3aa_46bd_8144_57f60194a1e9|Accel / Gyro / Mag 9-Axis (MPU9250)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 940ad7e9_abab_434f_a5e3_ff50e2fdf962|Accel / Gyro 6-Axis (Grove 105020012)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 75a362f4_d74d_48e7_9790_530f4d0e78b6|Accel / Gyro 6-Axis (MPU-6050)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d950cf7c_f9fc_49ba_a486_0d45b6afd1aa|Accel / Gyro 6-Axis (MPU-6886)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID db2c91d9_4fd5_42b8_98f4_76dfb160dece|Accel / Mag 6-Axis (LSM303D)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d61dd6a6_231e_4244_9e8d_4f15e7ea10d5|Accel / Mag 6-Axis (LSM303DLHC)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 788b85c9_21ae_4fad_ada1_9f118fc8023c|Accelerometer 3-Axis (LIS3DHTR) ]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 72f0a8c3_2b8f_4723_b22a_4a81873e5151|Accelerometer 3-Axis (LIS3LV02DQ)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2c716005_e9b5_46e3_86f9_30e5268341a9|Accelerometer 3-Axis (MMA8452Q)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 447dabf8_4e39_46a5_a3d6_a02341bef0f0|Gyroscope 3-Axis (L3G4200D)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8e4553f8_fce7_4fed_80c1_33de9590a678|Gyroscope 3-Axis I2C (L3GD20)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 593b7216_0a11_465c_9cf5_3b809503a72c|Gyroscope 3-Axis SPI (L3GD20)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e4f1697e_5571_475a_a2b1_aa7243920422|Magnetometer (SM324)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4c2256c0_4453_4369_8c36_09770d223a09|Magnetometer 3-Axis (HMC5883L)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 03b98e89_8fee_466f_87b9_42b3b3e1cb41|Magnetometer 3-Axis (QMC5883L)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8c4c9db2_8c42_458d_b071_001acd191c49|Wii Nunchuk]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Storage">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Buffer
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 201d99f7_acf8_481d_a703_61860c2ba3ea|Circular Buffer (16-bit)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c34f9b8a_a915_4f75_ad0c_87f2ad670a8a|Circular Buffer (8-bit)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ed491c82_9f85_4627_93ce_d2b588352539|Circular Buffer (Float)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | EEPROM
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID dcbf571f_a6fa_402d_bdd4_be00cca4070f|EEPROM]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d96f06b4_e7cc_4222_831e_520b53cfa278|EEPROM (DS28E07)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a1b2c3d4_e5f6_7890_abcd_ef1234567890|FRAM MB85RC]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 06829bc6_9e27_4353_9d95_3ba9dabc3384|Flash EEPROM]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7bbc8b49_5f3d_419e_8b25_4ea4c93467b6|IButton (DS1990)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fdb712e0_3861_4e64_9c68_67eade64b089|Serial EEPROM (24C01 - 24C16)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 35934f36_5cda_49e7_b1a0_05c85722d858|Serial EEPROM (24C32)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4d9912c0_0f17_4fbe_9c76_09331167a886|Serial EEPROM (24LC512)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b92e8950_9c7f_4769_abc0_be85f2b1452d|Serial EEPROM (93C46)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c8b6350e_b89a_4ad0_8669_e9387e24599e|Serial Flash (W25)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | File
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7d0c33a1_0aaa_4250_84bb_f96fc113abac|CSV Read/Write]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 42f3f8ef_ff5b_44e6_9be8_8c43d9ab5b08|Embed File]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a61211f1_3718_4d37_b4a4_c6193646ccfd|File (ESP32 SDMode)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 900b40e1_a72c_445c_9ec4_eff95cd6c377|File (RPI)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0b61bd39_05a3_46ee_a2a5_da7bffb583c5|File (SD/SDHC Card)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Real Time Clock
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 920175dd_ace8_49e2_9208_ec548563c9c0|Real Time Clock (ESP32)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f0e01201_8951_4748_87c3_d1f8423bb6e4|Real Time Clock (Internal, DS1307, DS3231, DS3232)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c48dfdeb_1177_4381_86dd_d7a98fefeb7a|Real Time Clock (MCP7940N)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a920e6a6_272e_47e3_92f5_fc06016b418b|Real Time Clock (PCF8563)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Utility
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 34f258e1_5c8c_4519_b29d_aba7cbf41faf|Advanced String Functions]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1911d96c_78dd_414a_b23c_6691fb19f63f|Auto Version Identifier]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID dfb4d07a_3d70_45d5_83ef_07e3c95d86ab|Lookup tables]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a8abdc98_224c_4c8a_8311_2921cb3dbe46|String Initialiser]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 306b3759_a92f_4779_b15f_93a9e35a75bf|String Translator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Math">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Calculation
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a78483e1_b293_47e7_984c_55984fc93571|Base 64]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6faf9c4d_ae2d_4997_840d_ce51c9a31498|CRC]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9a2a044c_10f5_437c_b5fa_0ec949130f36|Linear Feedback Shift Register]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ccdce31d_a1a3_437a_88ba_5431745ddf6e|Map Function]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b3061d15_325b_4a8f_863a_a059fab79caf|Median 16-bit]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f2e05e6d_1864_465b_8d1d_0fc9238a7535|Median 32-bit]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c211fc8f_6f17_461f_a44b_01dbc2368fbe|Median Float]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2e0f3546_f0f7_4644_b126_545f4c32984c|Modified Moving Average 16-bit]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 118ff995_d306_4ae3_8d5e_454a85a77750|Modified Moving Average 32-bit]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8062437d_88e1_459f_81de_d51162f7c654|Modified Moving Average Float]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a6ee9d2e_b26c_43ca_9478_15c3c338922e|Running Average 16-bit]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID de7d4dbc_e93f_4b5e_b6f2_b7d035992206|Running Average Float]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e4dbf608_6521_4e08_a1f5_46b012fc8cc1|Standard Deviation]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6508c7be_063a_4f9f_bae5_4a41cf977a86|Type Conversions]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Timing
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ec64c307_3099_485b_bd55_052a5da95128|PIC32 Core Timer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a871ac1d_7a58_4474_a08b_c9c9017cd2ed|STM32 Timer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d7633558_54a4_47ff_8c00_95170632c57e|Timed Interval]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 24ad2718_c70b_4088_aeda_3949dfdba740|Timer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="DSP">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | DSP Inputs
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fdef1c85_689b_4e44_81dc_7ab15dec21a6|Data Queue to Bits]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3420d1ea_bc10_4727_8419_746101b8dc13|Input ADC]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 73c1c565_8d04_44dd_ab78_1997d5e3c641|Input CSV]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c73d493a_b6a0_4dbe_b4b5_79648f67d11e|Input Digital]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8d6ffd33_4087_46b5_8dfd_f43513748755|Input Digital Pin]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c7648111_2a14_475e_980d_c7106ff9d3d0|Quadrature Generator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cbe42abc_5955_44da_a6d0_03e7cbcdcaca|Waveform Generator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | DSP Outputs
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 44e22c6d_4e79_4eb3_b2e1_7ff2fecb3e08|Bits to Data Queue]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e648c3de_ec39_4a3f_bbd9_46e45cce4a63|Level]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5142bd81_abad_444b_b6db_36a87dce5835|Output CSV]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4483da18_fa5a_4436_9edb_0cfb55a4bce1|Output DAC]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1392d5c3_35ba_4c7f_a539_7f30a09758e4|Output Digital]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0d048c7d_18d5_4bce_83f1_7e429c0d86b6|Output Digital Pin]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 649f4bc2_1360_4629_82aa_62e2fc32d4e4|Output PWM]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e79a4b4d_cb5a_4e46_a0d5_d23479e90036|Output Port]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | DSP Operators
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 104899e2_8b2e_4854_923c_5a614c1b8a3c|Adder]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d347e8eb_a0f2_45d5_8f31_7aba7f4e56b7|Averager]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0b1d97c1_ee89_45a5_8c39_114cd6d552ad|Deinterlace]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e0ddc704_6bab_4d08_8f10_19a14c6683ef|Delay]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f804a7bd_0280_4ff7_ab75_63be77fb2af3|Fast Fourier Transform (FFT)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 317efb6a_2bad_4f83_a0bc_4ada0f4cd51e|Filter]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 23b8de7f_5214_4f77_9bac_4982123b8d4b|Interlace]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 83fac7ac_b7b5_4cc4_890a_394cbf16cf71|Kalman Filter]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 82872714_f0f0_4758_91ec_bd39d2cdddc8|Math]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID facc8c89_963a_408e_985e_ed768a52b01a|Median]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a9e01aa0_f224_4902_a558_6a199fc039c5|Multiplex]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 88a7dbc4_af92_4205_8943_abaa77504462|Offset]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 34b6f31b_7e33_4beb_891e_defacbee8587|On/Off Control]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e6dd1315_4acf_4fb5_abd9_5743d3715cbe|PID Control]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 939a5d54_28c7_488d_af39_46f7c5d2c429|Rectifier]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f1af5256_1dee_491c_b43f_fdc8f33279fb|Scale]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 907f24e9_a8a3_46ea_942d_67dc55f7eb44|Simulated Control Load]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Comms">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Comms: Interface
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID da332928_6342_4c2c_afc7_eaf33917d33e|CAN (Internal, MCP2515)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 24219805_113d_4b12_b6bd_e1b0b0c33981|I2C Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 17c77397_9882_41a7_9aa8_05850854417e|I2C Multiplexer (TCA9548A)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eac43fda_0bc5_4b08_881c_6d3e364f2eff|I2C Slave]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 081af1a1_da0b_426d_9ca6_58d8313d1499|I2S Master/Slave ESP32]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 63de6312_8008_46d2_8a0c_bb66e56674e2|LIN Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 822ce79d_3339_4d92_bd2b_abae0ba3b780|LIN Slave]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 43861adb_8a59_492d_8f9f_a08775800bc1|MULTIUART]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 64b26b13_68cf_4a92_8616_e882b7c71023|One Wire]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 55831e22_7885_4e0f_a9de_73ebda9d7fe9|One Wire (DS2482)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 96862c4d_debc_45fa_9433_74711a4b9a3b|SPI Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e2955f6c_d724_4ab0_afca_d62093a77248|SPI Slave]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c73616d1_7ad0_45d9_aada_69ccfa4c5efc|UART (RS232)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 743ea495_34e7_47ee_bd79_3bfdc067b01c|UART Software (Timer)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Comms: System
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5aefac05_ee5e_4d51_9f31_05281900a97e|DALI Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c714f39e_c8fb_413f_afda_2d169e655134|DALI Slave]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b4e10f9e_4ea9_4fbc_a584_a4d7d4d8fba6|DMX-512 Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1be0ac44_3521_402e_a8b7_1faf86c09560|DMX-512 Slave]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5915b437_6925_4d90_a0f8_f91702837bdb|I2C Multiplexer (TCA9548A)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d04f4385_497d_4e46_a71d_2c0ccb4b0421|J1939 Automotive Node]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a9b43242_9ccc_4f1c_b2d1_acdfbe420fc1|MIDI]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 47f6b39b_ead7_40f5_9931_8a79aa54014a|Modbus Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 687f8ad4_59f2_4079_bb84_7713dcb57a13|Modbus Slave]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2bff9939_f404_4915_8a51_59db53e5470e|Modbus Slave USB]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 019e3dbb_2bfa_44a7_baf0_17b672d9b8f4|Modbus TCP Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1ecb9b0a_53e7_45c9_ab6f_7a0d4a0c47e1|Modbus TCP Slave]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 69c3c380_182a_4ba7_8043_9c9732b498fa|OBD2 ECU (Server)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6436a040_ccc8_46e5_82c1_68f8d87b16c5|Visi (4DSystems)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Comms: IoT/Cloud
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 72cd9559_26f7_4ffd_984c_cf3a82a6db16|BBC News]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID df96ffa1_4d36_453a_8877_758f68a2676c|BBC Weather Forecast]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID bf90426c_1763_4a7a_be5c_b3e442e3f6d8|BBC Weather Observation]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 947089aa_ca9f_4e6f_9f86_7d49a1ae6f86|EtherCAT Slave (EasyCAT)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2740a93b_32a9_48d1_8fc3_089d13b50bb5|IoT Made Easy]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6af7744a_76aa_4522_8cf1_05c8bd34859c|JSON Decoder]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f2ad060d_0ae3_43d2_9d82_f49eb4215240|JSON Encoder]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e50536ca_0cc0_4cdc_b0af_8cf3b393fa27|LoRaWAN (Seeed WIO-E5)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 459c9cfb_82e3_40ad_9456_54fc40ba5e6c|MQTT Client]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Comms: Networking
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c2322067_51ae_4560_abcc_6469b1bdcccb|Hydro Encryption]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 91049bf5_2436_42dc_947a_c30c86463d98|Network Communications]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8aab4b54_a912_449c_b11a_7c1a5db8d591|TCP/IP (ENC28J60)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a1820de1_8cfe_4675_b185_a62ce44e2a6f|TCP/IP (NM7010A)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0341d84f_f7fd_473c_8076_b38b2d563e13|TCP/IP (Raspberry Pi)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e18e39d3_2e05_4a15_b8aa_e8ada16cd3ef|TCP/IP (W5500)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d6db973b_a543_4743_91b5_176f9c6613df|TCP/IP (WIZ810MJ W5100)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 73973401_ddc0_46a9_ba3b_baf5e877ce07|WLAN (E-Blocks 3)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 66990164_3c50_4960_916d_327737a7a093|WLAN (ESP-12S)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f0f54e46_0848_4930_9bb6_eff9a34ed229|WLAN (ESP32)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e1bb4679_58ef_40dc_8d09_306ada46f7bf|WLAN (ESP8266)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a1c9b843_a641_4b9c_b762_26995b8f9464|Webserver (GENERIC - Flash / File)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ff377ede_2c09_4a83_99a0_5e11c7ae16d9|Webserver (NM7010A)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f77f2b22_6a7c_4ae6_9f5f_724660cc6c93|Webserver (W5500)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9e68a715_edc2_4a98_be64_c0d02f700135|Webserver (WIZ810MJ)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Comms: USB
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 06a0a9b3_dd23_4592_a781_537a31b97c2a|USB HID]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fdceef06_919a_405b_8d0b_6118cd0e104c|USB MIDI]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3e28ac22_2855_410a_9660_0b0a4731e545|USB Serial]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 26cbc2df_5ef0_47db_ab2f_c2425b14462f|USB Slave]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Wireless
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4993deaa_590b_4015_b110_0115a42dc968|Bluetooth (E-Blocks 3)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cff93310_545b_4948_a8fa_12b119c5f7a7|Bluetooth (EB024, Generic AT)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8be2ce64_4860_468a_aa8a_eac443274da3|Bluetooth (ESP32 SPP)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a8dbe015_0985_4581_abd5_1cc44f576fab|Bluetooth (HC05 / HC06)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0c7df3fc_a46f_4712_8cd3_77079978f4fc|Bluetooth (RN4677)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d178f336_576c_4bd3_b632_cdfcc238f811|Bluetooth BLE (ESP32 SPP Client)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a9fd95ee_27f4_42ef_8abb_3e810ec9711f|Bluetooth BLE (ESP32 SPP Server)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 76b3eb5c_2d23_4c8d_bde8_505032bc886a|Bluetooth v2 (EB024, Generic AT)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 575a3a3f_09b8_46be_8069_c4d1894d7e7e|GPS (EB056, Generic NMEA)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0d02ccfd_4cda_42b8_91d8_5392f491f9af|GSM (EB066, Generic AT)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2bfc8781_9817_4e0c_89f3_28dac37e9a62|IrDA (EB012, MCP1250, MCP2120)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ea261653_86e2_4c37_94f6_4151b318c6f5|LoRa (LAMBDA SX1272)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 81e90a9f_1594_4b34_8aef_5dd671dddc30|RC5 (EB060, Generic 36KHz)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 45bd9065_b6f7_42be_b96f_28c3df2c0a22|RF ISM (EB063, MRF49XA)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 882b6951_9944_48cc_8989_6ebd3d91956f|RF Transceiver (nRF24L01)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 74423151_1bf4_48b8_8ba8_a70c170ef2de|RFID (EB052, RWD-MICODE)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3f8d29a6_40a6_4d5e_a254_190c86d9ebb7|RFID (MFRC522)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 055a7ab6_78df_47ca_b967_143485c4d706|RFID (Sparkfun Quiic / ID-12LA)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cd5898bf_3a23_455e_b4e0_cddc1eec1d62|SRF (WirelessThings)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 53548cbe_cd57_471c_8ac1_3205d0e9da38|Zigbee (EB051, XBEE)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Hardware">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | E-blocks 3
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4993deaa_590b_4015_b110_0115a42dc968|Bluetooth (E-Blocks 3)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e4eb4f03_eaa4_4f2e_9920_3cbe11e4acab|E-Blocks 3 (USB Comms)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 73973401_ddc0_46a9_ba3b_baf5e877ce07|WLAN (E-Blocks 3)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | E-blocks 3 Sensors
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 20699a0c_0925_40c4_8aa1_35f294e225e6|Accel / Gyro / Mag 9-Axis (LSM9DS1 / BL0135)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e8ec17bd_a898_44d2_83af_968c96826948|Bridge Amplifier (HX711 / BL0122 / BL0132)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cc6a9919_31de_480e_91c9_2a59254a5bbd|Temp / Humidity (SHT41 / BL0144)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 97e631c7_51d9_4482_9b65_481b390a686d|Thermocouple (MAX31855 / BL0126)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | E-blocks 2
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cb3aa82e_81d7_491d_bab1_3fb7ee39c6af|Actuators]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 52399314_2f77_4acc_b9a2_c17b302f268c|Analogue]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5f9d5a58_6c01_4588_afa0_df4c01ce161a|Bluetooth]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID af9061e8_7f2b_475e_844f_66ab76823d07|CAN_Bus_BL0140]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 25db03ef_5393_4fb8_9b34_87a506428296|Colour GLCD (BL0157)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d4c04ac8_bbcd_4981_8ce6_9d6c9bb1e26a|Combo]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7ae74a71_a424_452f_8d71_618cf50cff98|E-block 2 Helper]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4d50e925_93e7_43ff_9c9f_8e958b9d714c|GLCD Monochrome]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e735f6a0_13c3_4ca3_9084_bdd19e21b8f8|GSM (BL0131)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e565ab5d_bf80_4911_938a_75b226ca6f93|IO Expander]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c92d41d3_e747_4d41_81d9_a6d3d23e8f07|Isolated Input]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b904b771_a7bc_47ec_a1ea_9d4c77afccf2|Keypad (BL0138)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ee697d50_7fb5_4074_8cd6_996e5c386722|LCD]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 103aab27_2ea3_483c_9710_fc3c495288a7|LED]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c2cb94bb_4cba_40ba_bd8a_1134bbd3e081|Micro SD Card]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#FFFFFF;" | [[Component: ID 5d0e397b_8c3d_448e_a322_4a2cb1a6468c|Power Board (BL0110)]]
| width="20%" align="center" style="background-color:#FFFFFF;" | both
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 05b6159b_1572_4c0d_8ddf_705d9741955a|RFID (BL0197)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5ed3d626_7e86_4df8_881a_c326a2b932ec|Relay (BL0183)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9202a62e_0a42_4780_adce_16b701e5ec53|Servo Motor Controller]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3bb0eba4_8ae3_442b_8653_507d1bde8be0|Sound Sensor (Grove 101020023)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b3a7287a_4070_49d1_9122_bf6169f67cd1|Switch]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fcb6b4c9_7010_4058_aee8_6211ffbf3e26|SysBlocks]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7ea86aa3_ef65_4e41_80ea_ed33c0e1baa6|TCP/IP]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ea9c0946_5f88_4f9a_ae5f_8ba9b981b389|WIFI]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0326308c_6e94_4bd7_bb0c_d6e882d8bbfc|Zigbee]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | E-blocks 2 Sensors
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 940ad7e9_abab_434f_a5e3_ff50e2fdf962|Accel / Gyro 6-Axis (Grove 105020012)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b52758bf_4466_48c0_8054_33ee4b11e82b|Barometer (BMP280 / Grove 101020192)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID a1ea988c_88c9_4f96_ac26_1684e918a3de|Colour Sensor (Grove 101020341)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID ee2e1541_45ee_492c_a47d_014627e6b9b6|Colour Sensor V3 (Grove 101021133)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID f3b8eed1_fef6_4c1b_b62d_8efc84b1be35|Infrared Reflective Sensor (Grove 101020174)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ccbd6829_44c8_4011_954b_c39dd93adbed|PIR Motion (Grove 101020020)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 27104eb6_255f_486e_ad25_b8512b2cc2d4|Rotary Angle Sensor (BL0622)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eca89720_1386_4589_ab75_6c0425162b91|Temp / Humidity (Grove 101020212)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 06c52475_f44f_41f3_aae7_9ddeee44fc06|Ultrasonic Ranger (Grove 101020010)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4b57ccb5_9e55_4d0e_8961_43f6fcaec2d7|Water Sensor (Grove 101020018)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Raspberry Pi Hat
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 165242cb_b40c_416e_a435_1fe7e724c5b8|Sense Hat]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Misc Circuit
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID b5665f5d_809d_4bd8_a79b_411f893bec16|GameCode]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID b4f41fb0_9335_4a8f_a41d_284a8cfc31b5|LED Cube]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 144a220f_7bc3_4b73_bc56_f9c7203bf204|RGB Xmas Tree]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Robotics
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID e3be641a_8808_4138_bee5_805fbbce468c|Formula AllCode]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 9d5300ab_57ae_4483_8f18_04ec2007b406|Formula Flowcode]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | MIAC Module
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 463bfc0e_2a04_414c_bf85_10718fa2ca08|MIAC (Arduino-Compatible)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 596e6f4d_d87a_4e8b_b108_c0501127c382|MIAC (dsPIC)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f9109442_8b0f_47d6_b563_d085588af222|MIAC NXT / ECU]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="API">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | API Slave Devices
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c7edc169_d417_46ec_ad9b_983ee0326e29|API (Arduino Mega)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2b53c2f2_b5d4_4e36_a647_6f9238744a75|API (Arduino Uno)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 556754b4_bed5_4bcd_88dd_fb13f92020d6|API (BL0032)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c9197106_edf6_4dcc_9654_ea56ad26f370|API (ECIO28P)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 40d5f2e2_3fb5_479a_91e1_f8ec3aae9e3a|API (ECIO40P)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e52b2356_d8b7_458b_8583_71f208bfd572|API (ESP32)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ed171d42_05fd_4946_9bf1_e59a9c98c5b8|API (Interface Board)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ec492589_4787_4b79_96df_718f9a2b46f1|API (RPI)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Test Injectors
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 927d2882_ab2f_43e9_8690_d1d6891001ee|Injector (API Analog Input)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID dbc62603_09e5_4a5e_8df3_22b921d9e9e9|Injector (API Digital Input)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 916e4f8c_ea50_4d16_bcbb_60492d600217|Injector (API Digital Output)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5a237757_52e5_414b_b6e4_79c7b784c3ba|Injector (AT)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 002be1ac_efff_4c07_95de_1eab087cb25e|Injector (COM)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 50738af3_82a5_4074_a9b8_9f8f80be2b87|Injector (File)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b81ab4d7_be8f_4ddd_b5dc_937bda03dc82|Injector (Flowcode vNet)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2ed54982_ef92_4509_a67c_7b3a72f91279|Injector (Human Interface)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="System">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Scenarios
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 62b6ca37_eb0a_4b5f_b2e1_9a732c4e05ce|3D Printer]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID a05022fd_6fa1_499d_b885_a7d983e7bfdf|Airplane Landing Gear]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 93252f96_a8e5_4d65_8c40_11614bb15b52|CNC Machine]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID fde30de0_35ed_40ca_937a_88da6409c1d2|Car Seat]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 264eadac_6fe5_43e0_bfb6_969175aaab93|Daytona Racetrack]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID fc012d2f_082a_4f6f_a61b_314c46477eb2|Maze Generator]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6d87ff3b_ffd8_4720_92cc_363be1e8be6e|Oven Simulation]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID c46023c5_27e5_4122_bf3e_4519f23cfa0c|Pedestrian Crossing]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fd273e86_49bd_4ee5_8f36_9562cd3645af|Pedestrian Crossing]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d7160810_b896_4568_ac21_18897236a80e|Traffic Light]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 0c6b22fc_6e81_4406_aabd_5feb928e6aee|Traffic Light 1-Way]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID dbf602c1_cb49_4149_bcd3_4a5afeae9a7a|Traffic Light 2-Way]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
|}

</tab>

<tab name="Runtime">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Matrix Tools
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e2ed1829_6967_4339_98e1_3806650297c5|Device Helper]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fc3c670c_502a_418f_a123_649179752383|FCD helper]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3e5cc6d0_3e36_46b8_bc40_f238a5735b6e|IntOsc Helper]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5f7b77e5_e979_4010_93f1_e6d98f83bd71|Is Sim]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Indicators
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 995fa4f2_71ce_4d91_aa62_87f731ae7e7d|Circular Gauge]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 940e39a6_d035_4e43_8dbb_455ee4679066|Console Writer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 05e09581_b11d_46ae_b32d_c6414a6a922d|LinearGauge]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 9f9ffa92_a20d_4ba8_94e1_04e45bdea154|Logo Indicator]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 64f3c8ad_21a4_4e15_b9aa_c32a2edca893|Numeric Display]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4b055fcf_06dd_471b_8736_d2a089e0dbe5|On / Off Indicator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4ae66a67_562d_4d77_8417_9cd652f4f103|Speech (RealSpeak)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Controls
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a11aa47b_7c82_4dad_b62d_b1a263e2a4fe|Circular Knob]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 29e63c23_636f_4f9a_b691_ba1a717e3503|Joystick]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 22ca7f47_0b00_453a_a5ae_75f999cdee2d|Joystick 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b6909b43_7bfb_433f_8fdb_3b7d457ea73d|LinearSlider]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 53a15e07_4dcd_4dd6_96a9_d96164d63574|Number Pad]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 73611f11_f97d_4e6e_88e6_2d59b39c0a4a|RadioButton]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Charts
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a907d905_5879_48f3_9add_369a2f4e164f|Area Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 60b296cd_5b02_4c9c_9239_cca36238f480|Bar Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5d52e8a2_f248_4318_a0ac_e7b9503237cf|Bubble Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ba8897fe_8349_47b3_9072_e823e74131af|Column Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c725ba0c_0763_4bb1_ad0e_1217467c2d21|Historic Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3a68ebf7_1225_4b29_87da_a734c0720591|Line Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 77e27287_6ca9_44f7_a160_d338d87b68de|Pie Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 64f4811d_e83f_4e82_be8a_9e857f6ec6e6|Polar Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b49da131_faf9_4bd7_bcdf_323016e64ffd|Radar Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 387b4d2c_fc0f_44c0_a2ad_5fa05ed7db82|Ternary Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0187d13d_8822_4e75_ab22_474c7058ebe4|XY Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Runtime Tools
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cbb3c28e_2d73_4442_ac52_23a3b45d9870|COM Port]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a1da060c_e74a_4e12_bb90_3ddb43265592|Console Debugger]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3bf29e52_ebb4_4528_8d19_b2860c8ab80c|Console User Input]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 33b1e2c6_5509_40bf_a464_167edcbcf571|Data Recorder Setup]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3022653d_9f9f_4981_b558_9ed8d265c931|Event Log]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6ed9452d_1ae7_4f70_991c_6d8085a2d923|Input Message Box]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eb9025a7_acec_455c_9033_bd4dd2586e05|Keyboard]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d2a7fe23_7dd2_43ca_ad55_185eec92fdd8|Message Box]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 82a800d4_8620_4386_8ba3_25af2768f24e|Mouse]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 06db27a4_c20a_4371_b05e_7cdb55556859|Panel Console Viewer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 819d0c05_aaa2_4431_84dc_d40f3eee1b54|Property Manager]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b86179cb_b561_4be4_9d12_e51da4248807|Serial Monitor]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b9cd8fbe_d082_4fe3_b1a0_d6f33f8af028|Simulation External Input]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a96ddf9d_631d_4db7_a66e_c709e2de7164|Time Stamp]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f137a538_3ebf_42e7_a941_b8f628802070|Timed Event Trigger]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 51ad4fb4_3b45_4cd0_a74c_87311de8d3a2|Tone Generator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f54fa744_5af4_4c08_bdb9_fb31848a2b63|XML JSON Parser]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Creation">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Primitives (2d)
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiButton|Button]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiCanvas|Canvas]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiComboBox|ComboBox]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiComplexShape|Complex Shape]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiConnection|Connection]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiEditBox|EditBox]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiGauge|Gauge]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiImage|Image]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiLine|Line]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiNumericIndicator|Numeric Indicator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiRichText|RichText]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiShape|Shape]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiSwitch|Switch]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiText|Text]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Primitives (3d)
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID ec0b30b2_e817_4d34_b227_25ce8b4f46e5|3D Panel Measurement Tool]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID component:text|Label]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID component:shape|Shape]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID component:textbox|Text box]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
|}

</tab>

</tabs>

==App Developer Components==

<tabs>

<tab name="Controls ">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Digital Control
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eb9025a7_acec_455c_9033_bd4dd2586e05|Keyboard]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 53a15e07_4dcd_4dd6_96a9_d96164d63574|Number Pad]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fd273e86_49bd_4ee5_8f36_9562cd3645af|Pedestrian Crossing]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 73611f11_f97d_4e6e_88e6_2d59b39c0a4a|RadioButton]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cd8da0fe_80cf_4532_bb50_69f0d1730e70|Switch Array (Push)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 975b2770_cfa8_4c76_b8ca_c008735e366d|Switch Array (Slide)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e2698f3e_1168_4f25_9c50_24a74ea7e34a|Switch Push Button]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 58b37280_d90e_4a23_941d_26f34ccff410|Switch Rotary 0 - 1]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1df1ea9a_6983_4014_aba5_f5144ea4e053|Switch Slide]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d43ac17c_2ec0_4277_95f9_fbc339456fab|Switch User Images]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Analog Control
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a11aa47b_7c82_4dad_b62d_b1a263e2a4fe|Circular Knob]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 29e63c23_636f_4f9a_b691_ba1a717e3503|Joystick]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 22ca7f47_0b00_453a_a5ae_75f999cdee2d|Joystick 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b6909b43_7bfb_433f_8fdb_3b7d457ea73d|LinearSlider]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 82a800d4_8620_4386_8ba3_25af2768f24e|Mouse]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Dialogue Control
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3bf29e52_ebb4_4528_8d19_b2860c8ab80c|Console User Input]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6ed9452d_1ae7_4f70_991c_6d8085a2d923|Input Message Box]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Indicators ">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Digital Indicator
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6a9e9265_e261_4604_8dc3_252ea3ccf02c|7Segment (Single)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b07ae733_c144_4558_979a_be737044519c|LED Array]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 44f82374_a417_40d5_bd42_23a177a390d2|LED Mono]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ce086f9b_c365_4471_b6e4_1760a53a7bfb|LED Mono Custom]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b562ceda_0ae0_4c50_bbcd_38a4b7e77829|LED Mono User Images]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 9f9ffa92_a20d_4ba8_94e1_04e45bdea154|Logo Indicator]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 64f3c8ad_21a4_4e15_b9aa_c32a2edca893|Numeric Display]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4b055fcf_06dd_471b_8736_d2a089e0dbe5|On / Off Indicator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d7160810_b896_4568_ac21_18897236a80e|Traffic Light]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Analog Indicator
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 995fa4f2_71ce_4d91_aa62_87f731ae7e7d|Circular Gauge]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 05e09581_b11d_46ae_b32d_c6414a6a922d|LinearGauge]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4ae66a67_562d_4d77_8417_9cd652f4f103|Speech (RealSpeak)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Dialogue Indicator
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 940e39a6_d035_4e43_8dbb_455ee4679066|Console Writer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d2a7fe23_7dd2_43ca_ad55_185eec92fdd8|Message Box]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 06db27a4_c20a_4371_b05e_7cdb55556859|Panel Console Viewer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Audio Indicator
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 51ad4fb4_3b45_4cd0_a74c_87311de8d3a2|Tone Generator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eaee384d_6b16_4988_b1aa_8628231a7128|WAV Library File]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Charts ">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a907d905_5879_48f3_9add_369a2f4e164f|Area Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 60b296cd_5b02_4c9c_9239_cca36238f480|Bar Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5d52e8a2_f248_4318_a0ac_e7b9503237cf|Bubble Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ba8897fe_8349_47b3_9072_e823e74131af|Column Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c725ba0c_0763_4bb1_ad0e_1217467c2d21|Historic Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3a68ebf7_1225_4b29_87da_a734c0720591|Line Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 77e27287_6ca9_44f7_a160_d338d87b68de|Pie Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 64f4811d_e83f_4e82_be8a_9e857f6ec6e6|Polar Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b49da131_faf9_4bd7_bcdf_323016e64ffd|Radar Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 387b4d2c_fc0f_44c0_a2ad_5fa05ed7db82|Ternary Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0187d13d_8822_4e75_ab22_474c7058ebe4|XY Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Storage ">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Buffer
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 201d99f7_acf8_481d_a703_61860c2ba3ea|Circular Buffer (16-bit)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c34f9b8a_a915_4f75_ad0c_87f2ad670a8a|Circular Buffer (8-bit)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ed491c82_9f85_4627_93ce_d2b588352539|Circular Buffer (Float)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | File
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7d0c33a1_0aaa_4250_84bb_f96fc113abac|CSV Read/Write]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 42f3f8ef_ff5b_44e6_9be8_8c43d9ab5b08|Embed File]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3022653d_9f9f_4981_b558_9ed8d265c931|Event Log]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9cb6d9da_5555_4e1c_a65c_93b299b6011c|File Access]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f54fa744_5af4_4c08_bdb9_fb31848a2b63|XML JSON Parser]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Utility
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 34f258e1_5c8c_4519_b29d_aba7cbf41faf|Advanced String Functions]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID dfb4d07a_3d70_45d5_83ef_07e3c95d86ab|Lookup tables]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 819d0c05_aaa2_4431_84dc_d40f3eee1b54|Property Manager]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a8abdc98_224c_4c8a_8311_2921cb3dbe46|String Initialiser]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 306b3759_a92f_4779_b15f_93a9e35a75bf|String Translator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Math">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Calculation
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a78483e1_b293_47e7_984c_55984fc93571|Base 64]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6faf9c4d_ae2d_4997_840d_ce51c9a31498|CRC]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9a2a044c_10f5_437c_b5fa_0ec949130f36|Linear Feedback Shift Register]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ccdce31d_a1a3_437a_88ba_5431745ddf6e|Map Function]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b3061d15_325b_4a8f_863a_a059fab79caf|Median 16-bit]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f2e05e6d_1864_465b_8d1d_0fc9238a7535|Median 32-bit]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c211fc8f_6f17_461f_a44b_01dbc2368fbe|Median Float]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2e0f3546_f0f7_4644_b126_545f4c32984c|Modified Moving Average 16-bit]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 118ff995_d306_4ae3_8d5e_454a85a77750|Modified Moving Average 32-bit]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8062437d_88e1_459f_81de_d51162f7c654|Modified Moving Average Float]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a6ee9d2e_b26c_43ca_9478_15c3c338922e|Running Average 16-bit]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID de7d4dbc_e93f_4b5e_b6f2_b7d035992206|Running Average Float]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e4dbf608_6521_4e08_a1f5_46b012fc8cc1|Standard Deviation]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6508c7be_063a_4f9f_bae5_4a41cf977a86|Type Conversions]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Timing
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID bad20af2_3911_414d_8523_46895726e2bf|Stopwatch]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a96ddf9d_631d_4db7_a66e_c709e2de7164|Time Stamp]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f137a538_3ebf_42e7_a941_b8f628802070|Timed Event Trigger]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 08f4483b_47a4_4ba2_bf41_9527908f77da|Timer Interrupt]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="DSP">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | DSP Inputs
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fdef1c85_689b_4e44_81dc_7ab15dec21a6|Data Queue to Bits]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 73c1c565_8d04_44dd_ab78_1997d5e3c641|Input CSV]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c73d493a_b6a0_4dbe_b4b5_79648f67d11e|Input Digital]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c7648111_2a14_475e_980d_c7106ff9d3d0|Quadrature Generator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cbe42abc_5955_44da_a6d0_03e7cbcdcaca|Waveform Generator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | DSP Outputs
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 44e22c6d_4e79_4eb3_b2e1_7ff2fecb3e08|Bits to Data Queue]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e648c3de_ec39_4a3f_bbd9_46e45cce4a63|Level]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5142bd81_abad_444b_b6db_36a87dce5835|Output CSV]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1392d5c3_35ba_4c7f_a539_7f30a09758e4|Output Digital]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | DSP Operators
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 104899e2_8b2e_4854_923c_5a614c1b8a3c|Adder]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d347e8eb_a0f2_45d5_8f31_7aba7f4e56b7|Averager]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0b1d97c1_ee89_45a5_8c39_114cd6d552ad|Deinterlace]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e0ddc704_6bab_4d08_8f10_19a14c6683ef|Delay]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f804a7bd_0280_4ff7_ab75_63be77fb2af3|Fast Fourier Transform (FFT)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 317efb6a_2bad_4f83_a0bc_4ada0f4cd51e|Filter]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 23b8de7f_5214_4f77_9bac_4982123b8d4b|Interlace]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 83fac7ac_b7b5_4cc4_890a_394cbf16cf71|Kalman Filter]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 82872714_f0f0_4758_91ec_bd39d2cdddc8|Math]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID facc8c89_963a_408e_985e_ed768a52b01a|Median]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a9e01aa0_f224_4902_a558_6a199fc039c5|Multiplex]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 88a7dbc4_af92_4205_8943_abaa77504462|Offset]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 34b6f31b_7e33_4beb_891e_defacbee8587|On/Off Control]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e6dd1315_4acf_4fb5_abd9_5743d3715cbe|PID Control]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 939a5d54_28c7_488d_af39_46f7c5d2c429|Rectifier]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f1af5256_1dee_491c_b43f_fdc8f33279fb|Scale]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 907f24e9_a8a3_46ea_942d_67dc55f7eb44|Simulated Control Load]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Comms">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Comms: Interface
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 55fa09f1_703e_4400_b2b5_8391f161a368|BLE GATT SPP]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cbb3c28e_2d73_4442_ac52_23a3b45d9870|COM Port]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 17c77397_9882_41a7_9aa8_05850854417e|I2C Multiplexer (TCA9548A)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 63de6312_8008_46d2_8a0c_bb66e56674e2|LIN Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Comms: System
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d04f4385_497d_4e46_a71d_2c0ccb4b0421|J1939 Automotive Node]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 97647329_1e06_46dc_ba11_9d721038294d|Modbus Master (SCADA)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a93b1f52_b96d_4a14_806e_63f73d2654b2|Modbus Slave (SCADA)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 019e3dbb_2bfa_44a7_baf0_17b672d9b8f4|Modbus TCP Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1ecb9b0a_53e7_45c9_ab6f_7a0d4a0c47e1|Modbus TCP Slave]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 69c3c380_182a_4ba7_8043_9c9732b498fa|OBD2 ECU (Server)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Comms: IoT/Cloud
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 72cd9559_26f7_4ffd_984c_cf3a82a6db16|BBC News]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID df96ffa1_4d36_453a_8877_758f68a2676c|BBC Weather Forecast]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID bf90426c_1763_4a7a_be5c_b3e442e3f6d8|BBC Weather Observation]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2740a93b_32a9_48d1_8fc3_089d13b50bb5|IoT Made Easy]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6af7744a_76aa_4522_8cf1_05c8bd34859c|JSON Decoder]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f2ad060d_0ae3_43d2_9d82_f49eb4215240|JSON Encoder]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 459c9cfb_82e3_40ad_9456_54fc40ba5e6c|MQTT Client]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Comms: Networking
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 91049bf5_2436_42dc_947a_c30c86463d98|Network Communications]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a1c9b843_a641_4b9c_b762_26995b8f9464|Webserver (GENERIC - Flash / File)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Hardware">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | E-blocks 3
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e4eb4f03_eaa4_4f2e_9920_3cbe11e4acab|E-Blocks 3 (USB Comms)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | E-blocks 3 Sensors
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 20699a0c_0925_40c4_8aa1_35f294e225e6|Accel / Gyro / Mag 9-Axis (LSM9DS1 / BL0135)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cc6a9919_31de_480e_91c9_2a59254a5bbd|Temp / Humidity (SHT41 / BL0144)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 97e631c7_51d9_4482_9b65_481b390a686d|Thermocouple (MAX31855 / BL0126)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | E-blocks 2 Sensors
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 940ad7e9_abab_434f_a5e3_ff50e2fdf962|Accel / Gyro 6-Axis (Grove 105020012)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b52758bf_4466_48c0_8054_33ee4b11e82b|Barometer (BMP280 / Grove 101020192)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID a1ea988c_88c9_4f96_ac26_1684e918a3de|Colour Sensor (Grove 101020341)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID ee2e1541_45ee_492c_a47d_014627e6b9b6|Colour Sensor V3 (Grove 101021133)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eca89720_1386_4589_ab75_6c0425162b91|Temp / Humidity (Grove 101020212)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="API">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | AllCode
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID bd23228f_b173_4135_ab3b_a4c3c4caa7a8|Control]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c3e5eb13_e03d_4ca6_be4d_1c63ad107a35|Electrical Machines]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4182ece3_6ad5_41d3_a0e2_31bc570806db|Formula AllCode API]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 482486a9_7207_4b46_9e63_5c459534ab19|MIAC AllCode API (dsPIC)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a34ee78a_4a97_4e95_a5f6_3a9fa3de7167|MIAC NXT AllCode API]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eabeda20_432c_4554_80b3_5851d675a9e7|MIAC USB Slave API (PIC)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 76e989d0_a2ed_457f_a293_3025b804f433|Robot Arm v2]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | API Slave Devices
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c7edc169_d417_46ec_ad9b_983ee0326e29|API (Arduino Mega)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2b53c2f2_b5d4_4e36_a647_6f9238744a75|API (Arduino Uno)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 556754b4_bed5_4bcd_88dd_fb13f92020d6|API (BL0032)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c9197106_edf6_4dcc_9654_ea56ad26f370|API (ECIO28P)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 40d5f2e2_3fb5_479a_91e1_f8ec3aae9e3a|API (ECIO40P)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e52b2356_d8b7_458b_8583_71f208bfd572|API (ESP32)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ed171d42_05fd_4946_9bf1_e59a9c98c5b8|API (Interface Board)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ec492589_4787_4b79_96df_718f9a2b46f1|API (RPI)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Test Equipment
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 66309a73_20da_4f2f_bb92_c4749cfad84c|PicoScope]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8c08bf29_be7e_4408_92bc_91c476fb70db|TTI Power Supply - PL155-P]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3c01caaa_b732_49a0_b15e_7c9d98878b19|TTI TG5011 Signal Generator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Third Party
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eedbc87c_0433_4f67_86c5_a106439fc603|FTDI (FTD2XX)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="API Library">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | API Audio
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2061d38d_0cca_440c_a842_f9c84ca55f90|DFPlayer (MP3 / WAV)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0a5d4625_78e6_4bf3_a802_925c655ef718|Heelight Sensor (Grove 101020312)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | API Comms
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID da332928_6342_4c2c_afc7_eaf33917d33e|CAN (Internal, MCP2515)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e4eb4f03_eaa4_4f2e_9920_3cbe11e4acab|E-Blocks 3 (USB Comms)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 24219805_113d_4b12_b6bd_e1b0b0c33981|I2C Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d04f4385_497d_4e46_a71d_2c0ccb4b0421|J1939 Automotive Node]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 43861adb_8a59_492d_8f9f_a08775800bc1|MULTIUART]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 69c3c380_182a_4ba7_8043_9c9732b498fa|OBD2 ECU (Server)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 55831e22_7885_4e0f_a9de_73ebda9d7fe9|One Wire (DS2482)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 055a7ab6_78df_47ca_b967_143485c4d706|RFID (Sparkfun Quiic / ID-12LA)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 96862c4d_debc_45fa_9433_74711a4b9a3b|SPI Master]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c73616d1_7ad0_45d9_aada_69ccfa4c5efc|UART (RS232)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | API Display
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ac3375c7_acf3_4160_8c3e_3011735116aa|GLCD (E-BLOCKS 3)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8a7a90d2_3274_4433_8609_699e976e0719|GLCD (Grove OLED)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ebf9c18e_044e_41e2_b845_da14e744b25f|GLCD (SH1106) I2C]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID dfe103f9_ef5c_4554_85be_7519ec274609|GLCD (SSD1305) I2C]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f6ab6074_68ba_4cd4_9274_f973102f8518|GLCD (SSD1306) I2C]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 6548a7da_7e0b_4d45_ad92_f61bf5713442|GLCD (SSD1327) I2C]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 496cf2f0_4220_4f70_9219_7c67c672e36e|GLCD (ST7036) I2C]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f45468b8_5731_4bfb_b5c0_4042ef1dd1da|LCD (Grove - I2C)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 31326041_9339_4cf4_b609_c14cc66318b3|LCD (Grove - UART)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID bcd6a955_12c6_4ed4_a22f_f16eb62e0762|LCD I2C (Backpack)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3cf64267_8c56_47b0_84a1_a933a77716bc|LCD I2C (LCM1602)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c198e346_6b0f_4309_973c_78d7207e0b96|LCD SPI (MiniClick)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | API Environmental
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c416a604_834b_48ba_a5e8_a47cad4f08de|Air Quality (BME688)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a9eb79b0_1d24_4acf_aade_d3639aa800c7|Barometer (BME280)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 38f89887_af35_470e_8c6f_c91f3c99e88d|Barometer (BMP180)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b52758bf_4466_48c0_8054_33ee4b11e82b|Barometer (BMP280 / Grove 101020192)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ca60c1d2_fb77_4e3e_9d01_c4496d35db1e|Barometer (DPS310)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b8c43425_121c_4dfc_8a70_665973e9938b|Barometer (MS5637)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2755f2ee_60e0_4e4d_9bce_8bffb3a6a730|Humidity AHT10]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 36175036_08af_4bcf_8dd2_1c46f6761385|Magnetometer (BMM150)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID caa29480_5f50_4c3b_8dac_22cfb8e36999|Pulse Oximeter (Max30100)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e3b5f8d2_6f4a_4fbc_a4f9_9c7f5a1a3b65|RTD (MAX31865)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID eca89720_1386_4589_ab75_6c0425162b91|Temp / Humidity (Grove 101020212)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 66e6f00d_d894_49de_a768_02997eaf45e1|Temp / Humidity (HTS221)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 75d7da2a_c682_4622_ac86_b6eb9ed7a88e|Temp / Humidity (SHT21)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4475d8e8_4f60_48be_8a27_e91d85fbabae|Temp / Humidity (SHT31)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cc6a9919_31de_480e_91c9_2a59254a5bbd|Temp / Humidity (SHT41 / BL0144)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID df4eca75_779f_47ce_9495_56d3233be5e1|Temperature (DS1822)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 783b7689_0c71_44fb_9dde_673e4b7455ba|Temperature (DS18B20)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b42d9405_a751_4622_8fbe_ce512da391ba|Temperature (DS18S20)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID bbf0ab46_623e_44c6_9402_3acfcd9d0006|Temperature (LM75B)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 97e631c7_51d9_4482_9b65_481b390a686d|Thermocouple (MAX31855 / BL0126)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cbedb7e1_22c3_4edc_80f8_0501f7f9e398|Thermocouple (MAX31856)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 60de8264_7faf_4f77_904e_69bb19909ba8|Thermocouple (MCP960X)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | API Electrical
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fd24f205_3750_4324_8c2c_94a6c0377475|ADC ADS1256]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d5f0360d_ba69_4cc4_af4a_c2621fd2d77d|Battery Cell Fuel Gauge (MAX17043 MAX17044)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ef2427ea_7767_43be_a0c5_6f705e3c2668|Energy Monitor (PZEM-004T)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | API IO
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 937e425e_21c0_4b08_8d8f_0bf80a6391d2|ADC (AD7680)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 235fd689_bfd1_4c4a_a918_6c3c36e9a49f|ADC (MCP356X)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e65e5368_af24_44a9_897e_cb0422fcea27|ADC QUAD + DAC (PCF8591)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3d87ffe9_97c1_4013_a2cd_82c24d0ccb48|DAC (AD5662)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e78d88a0_e132_4f82_988d_59353009b669|DAC (MCP4725)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 70a3bead_e66d_4a76_bc7b_fb1baa86d2e6|DAC (MCP47x6)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID fab5cf20_8686_4397_8a21_cc936659d5f6|DAC (MCP48x1)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b6de5668_e0ae_4c1a_9c16_b16aa3f58024|DAC (MCP49x1)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f484e96a_af4f_434e_a002_70d3f4315dfb|DAC Dual (MCP48x2)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b66f5769_5e9d_40e7_9159_c6a0552ff86e|DAC Dual (MCP49x2)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID adb523db_db13_4d19_bfa3_0fbc177e4d3f|DAC Quad (MCP4728)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a4c8e3f2_9b7d_4e1a_8c5f_3d6e9a2b4c7d|DDS DAC (AD9834/AD9833)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID b48a8c76_b62d_4b52_9368_237e5a2dbd4a|Digital Potentiometer (AD528X)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 37025734_a84d_46ad_9078_925beb81f38b|Digital Potentiometer (MCP41XX / MCP42XX)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID aba8b3ce_e71c_49c8_a961_d59b36338afa|Digital Potentiometer (MCP41XXX / MCP42XXX)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3a3a0802_42b6_4c31_8983_4d043b70b443|Digital Potentiometer (MCP44XX)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a69bf9b3_272e_44b3_a47d_22f53c3c0804|Digital Potentiometer (MCP45XX / MCP46XX)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 50eddda0_73c3_4514_b2e0_7e33abeaa162|Grove I2C Motor Driver]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 76bb1b8c_43da_48d3_b53f_a9907f03a528|IO Expander (MCP23017)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 331daac0_653d_4f45_9822_6408a8258bda|IO Expander (MCP23S17)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d43a1c1f_8ad6_4271_9f62_20e1bdf529f0|IO Expander (PCF8574)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4616b658_531f_4c5e_981a_4d9fc04f9a36|IO Expander (PCF8575)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID 74571cdc_4f94_4e9a_b56b_376f36424996|Joystick (Sparkfun Quiic)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 94c78e1b_f580_4105_a223_7e40b75d134c|Joystick (Sparkfun Quiic) 2D]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5bd41be2_1b9c_4f30_ba78_84cb29d61ced|PWM 16CH 12Bit (PCA9685)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | API Light
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e08872a7_6962_4b61_bcca_71389f8ed8d7|Ambient Light]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID a1ea988c_88c9_4f96_ac26_1684e918a3de|Colour Sensor (Grove 101020341)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID ee2e1541_45ee_492c_a47d_014627e6b9b6|Colour Sensor V3 (Grove 101021133)]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e1d52efb_00d4_4e19_ba4c_29b292535ea1|Infrared Array AMG88xx]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 488c3a77_9ff2_4e60_9bfd_cf074405e294|Range Time of Flight (VL53L0X)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | API Movement Orientation
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 20699a0c_0925_40c4_8aa1_35f294e225e6|Accel / Gyro / Mag 9-Axis (LSM9DS1 / BL0135)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 5d2c6406_e3aa_46bd_8144_57f60194a1e9|Accel / Gyro / Mag 9-Axis (MPU9250)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 940ad7e9_abab_434f_a5e3_ff50e2fdf962|Accel / Gyro 6-Axis (Grove 105020012)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 75a362f4_d74d_48e7_9790_530f4d0e78b6|Accel / Gyro 6-Axis (MPU-6050)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d950cf7c_f9fc_49ba_a486_0d45b6afd1aa|Accel / Gyro 6-Axis (MPU-6886)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID db2c91d9_4fd5_42b8_98f4_76dfb160dece|Accel / Mag 6-Axis (LSM303D)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d61dd6a6_231e_4244_9e8d_4f15e7ea10d5|Accel / Mag 6-Axis (LSM303DLHC)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 788b85c9_21ae_4fad_ada1_9f118fc8023c|Accelerometer 3-Axis (LIS3DHTR) ]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 72f0a8c3_2b8f_4723_b22a_4a81873e5151|Accelerometer 3-Axis (LIS3LV02DQ)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2c716005_e9b5_46e3_86f9_30e5268341a9|Accelerometer 3-Axis (MMA8452Q)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 447dabf8_4e39_46a5_a3d6_a02341bef0f0|Gyroscope 3-Axis (L3G4200D)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8e4553f8_fce7_4fed_80c1_33de9590a678|Gyroscope 3-Axis I2C (L3GD20)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 593b7216_0a11_465c_9cf5_3b809503a72c|Gyroscope 3-Axis SPI (L3GD20)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e4f1697e_5571_475a_a2b1_aa7243920422|Magnetometer (SM324)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4c2256c0_4453_4369_8c36_09770d223a09|Magnetometer 3-Axis (HMC5883L)]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name="Creation">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Primitives (2d)
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiButton|Button]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiCanvas|Canvas]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiComboBox|ComboBox]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiComplexShape|Complex Shape]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiConnection|Connection]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiEditBox|EditBox]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiGauge|Gauge]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiImage|Image]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiLine|Line]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiNumericIndicator|Numeric Indicator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiRichText|RichText]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiShape|Shape]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiSwitch|Switch]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID component:GdiText|Text]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Primitives (3d)
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID ec0b30b2_e817_4d34_b227_25ce8b4f46e5|3D Panel Measurement Tool]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID component:text|Label]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID component:shape|Shape]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
| width="80%" style="background-color:#e8fcff;" | [[Component: ID component:textbox|Text box]]
| width="20%" align="center" style="background-color:#e8fcff;" | 3d
|-
|}

</tab>

</tabs>

==Web Developer Components==

<tabs>

<tab name=" Controls">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Control
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c68e35f2_92e3_4a48_abd9_4a1818aa1023|Button]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 21cdfa0f_51ac_48a5_9448_53d3460fed47|Check Box]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 46df05de_0544_4c2f_b70a_3d5e40074a0c|Choose Colour]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3d8ea96e_c2b7_4160_87c2_0b17d0511ddc|Choose File]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 9d2842d2_c72d_4631_94b3_1186cb496fff|Combo Box]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c9c426b0_29da_406a_afa3_aa4bd66f785f|Input Text]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1aadf780_b159_4970_8c1a_6af1ec49335b|Radio Button]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7e6b63bd_8cda_4b3d_bf64_ec66e9055a25|Slider]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID add0cf83_9484_4047_8048_40f00c95972e|Switch]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name=" Indicators">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Indicator
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 4fc7c04c_c105_4a2b_ba78_27f11d8b2320|Canvas]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f43a5e51_dae4_4d71_803d_27e56a7b25b2|Gauge]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1b25bcf6_4e20_4646_9eda_8565971d5724|Indicator]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cfb27e2a_028f_4b18_844c_048de6c2d7ee|SevenSeg]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name=" Charts">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID c0afb39c_50ed_44c3_91cc_b15bb0baa6f6|Area Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 33bed1e4_f05f_4a12_a934_a511c24913b9|Bar Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 42f80fc0_5172_44ef_850c_d42d28ef0bd8|Column Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 724dc5b4_8519_41ff_a96d_413275961305|Line Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d2449868_8378_45f5_a9b2_12ed71762d7d|Pie Chart]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name=" Helper">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Comms
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cb997a87_2257_4fed_917f_89732d879150|Bluetooth]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 209c214a_3fdf_4a09_9354_e2f146dbdedc|HTTP Fetch]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1ea0baab_69f8_45a5_9eda_aba35d8de3e8|HTTP Params]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 872dba99_b369_457e_b6f1_914a9f35ad19|JSON Decoder]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 0e2759dd_5335_4769_bdb4_5ddea30a6236|JSON Encoder]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID ac5ba24f_d4c3_48e7_9147_e5197de7f7b5|MQTT Client]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 23c1be0a_4c1e_4d83_9de5_47a82d4e4950|SerialPort]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Data
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID a1612734_3758_43e9_b5f1_2b1a35304d19|Array Helper]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID e822511e_30d7_4aaa_a34d_93b7796cc82b|Create File]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 45ce3fab_d9df_40fe_8ef5_04d8e6e590e5|Location]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID f29b1d3f_7cb2_4585_bd19_f502759b66ac|Motion]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2e5d477d_7e43_4691_95e1_becf96fed02d|Object Helper]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 32333e38_5975_4078_a873_efdf2975a04e|Orientation]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 15f033b8_7422_4475_9e3a_35e5731fb589|Popup Message]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 80045c63_20e3_46df_8a8c_b47985d737a0|Speech]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 58f727d6_1ff6_4e68_80dd_395bdb2143b7|Storage]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 30f0236a_7777_4c6f_8ceb_a29b8d5294d1|Timer]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 7124e995_9c63_405b_8324_0ab23d49a5cc|Timestamp]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 435108f4_b1f8_4050_b4d1_310d0726e8f0|Vibrate]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

<tab name=" Creation">

{| class="wikitable" style="width: 600px; background-color:#FFFFFF;"
|-
| colspan="3" align="center" style="background-color:#EAE1EA;" | Web Primitives
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID cf57b83c_426c_4db7_964e_7c99643f5bc7|Complex Shape]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID d8bcae4d_437d_4252_bdc7_d8132145f18e|Image]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 1812403e_8a44_4e02_843e_b5c58a6f9646|ImageUrl]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 8572e90c_bb9d_4d3c_8350_a68d412af899|Label]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 2b8bf5a1_2d66_44fe_8023_cb41c33d1add|Shape]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3bd55a33_d9ed_44a0_80d9_76a8d954a335|Text Block]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
| width="80%" style="background-color:#e8ffec;" | [[Component: ID 3dd46a25_45e9_4e03_a4f6_2c2fbd06d4ca|TextUrl]]
| width="20%" align="center" style="background-color:#e8ffec;" | 2d
|-
|}

</tab>

</tabs>

Main Page

2026-03-24T12:09:26Z

SteveT: updated version

{| cellpadding="4" style="border: 1px solid darkgray; float:right; width:300px"
|+ '''Flowcode'''
|-
| colspan="2"|[[File:fc-v9-thumb.png|center]]
|-
|width="40%"|'''Developer'''
|[http://matrixtsl.com Matrix TSL]
|-
|'''Website'''
|[http://www.flowcode.co.uk www.flowcode.co.uk]
|-
|'''Current version'''
|v11.0.1.14
|-
|'''Initial v11 release'''
|17/10/25
|-
|'''Previous versions'''
|
* v10 (2023)
* v9 (2020)
* v8 (2018)
* v7 (2016)
* v6 (2013)
* v5 (2011)
* v4 (2009)
* v3 (2006)
* v2 (2003)
* v1 (2001)
|-
|'''Operating system'''
|[http://en.wikipedia.org/wiki/Microsoft_Windows Windows 10,11]
|-
|'''Platform'''
| [http://en.wikipedia.org/wiki/IA-32 IA-32] and [http://en.wikipedia.org/wiki/X86-64 x86-64]
|-
|'''Available in'''
|English, French, German, Spanish, Italian, Chinese (Traditional)
|-
|'''Type'''
|Advanced graphical programming software
|-
|'''License'''
|[http://en.wikipedia.org/wiki/Proprietary_software Proprietary]
|}
__NOTOC__

[[File:fc-v9-mainlogo-01.png|center]]

[[File:Fc10 what is flowcode1.jpg]] &ensp;&ensp; [[File:Web Barometer Web App.jpg]]

 

==Old Versions==
This page is current for Flowcode v11 and later. Earlier versions can be found below:
{| class="wikitable"
|-
| [[Special:PermanentLink/41232|Flowcode v10]]
|-
| [[Special:PermanentLink/24519|Flowcode v9]]
|-
| [[Special:PermanentLink/23678|Flowcode v8]]
|}

 

==[[About_Flowcode|About Flowcode]]==

Flowcode is a graphical programming Integrated Development Environment (IDE) that allows you to develop highly functional electrical, 
electronic and electromechanical systems for microcontroller based systems and for Windows PCs and tablets.

==[[Flowcode Embedded]]==
Flowcode Embedded allows you to easily create highly functional programs for popular microcontrollers.

==[[App Developer|Flowcode App Developer]]==
Flowcode App Developer allows you to create great Human Machine Interfaces for PCs, tablets and mobile phones using low cost 
input output boards - locally (USB/Buetooth) or remotely (Wi-Fi, LAN, Internet) using Windows or web browsers.

==[[Flowcode Help Overview|Using Flowcode]]==
Detailed glossary style overview of the aspects of the Flowcode environment broken down into relevant sections to aid in finding the knowledge you require to use Flowcode effectively.

==[[Exercises|Examples and Tutorials]]==
This page contains structured exercises used throughout Flowcode Help section, and further exercises 
which are not featured in the Flowcode Help structure these additional exercises range from expanded exercises 
on camera control and panel navigation to creating, testing, exporting and importing components.

==[[Components|Component Library]]==
List of components which provide detailed information about individual components as well as examples of them in use. 
The information provided includes component and simulation macro references as well as property references and component functionality.

==[[Flowcode_Debugging|Flowcode Debugging]]==
Learn how Flowcode can help you debug your programs with a variety of tools and technologies designed to streamline the debugging process.

==[[Simulation_Functionality|Simulation Library]]==
Structured overview of the library of Simulation Event macros and Simulation Functions. 
The information provided includes simulation macro references as well as event triggers and functionality.

==[[Component_Creation|Component Creation]]==
Creating your own components in Flowcode gives you massive amounts of flexibility in your projects, this section covers how to create your own components and has some working examples to help.

==[[What's New|What's New]]==
This page contains all the new exciting features introduced in this latest version of Flowcode.

==[[Glossary|Glossary]]==
This glossary helps general programmers understand Flowcode-specific terms and concepts.

Traffic Light 1-Way

2026-03-04T12:36:30Z

SteveT: removed bad link in Component Details

Traffic lights are essential in modern road networks to help control and maintain the flow of traffic.

The lights must be clear to read and follow a regular pattern to allow motorists and other road users to know without any chance of confusion what the lights mean and what will come next in the sequence.

[[File:TL1.jpg]]

==Exercise 1==

Setup and analyse the light patterns of a traffic light.

===Tasks===

* Create a new flowchart, and select ‘No chip’ as the target device. We choose no chip as this is a simulation only exercise.
* Add the ‘Traffic Light 1-Way’ component to the 3D Panel, from the ’Simulation -> Scenarios’ category.
* Adjust the 3D Panel so that you can see the traffic light, The [[PresetViews|Preset Views]] button or clicking the arrows at the top left of the 3D Panel window can be very helpful.
* Add a component macro ‘AutomaticMode’ to start the lights moving through its pre-programmed light patterns.
* Add a loop to your program to loop forever until the simulation stop button is pressed.
* Run the simulation by clicking the Play button on the top toolbar.
* Take note of the different states the lights can be in.

===Working Example===

Below you will see a working example to monitor the light sequence of a simple 1-way traffic light.

{{Fcfile|TrafficLight1-WayWorksheet1.fcfx|Traffic Light 1-Way - Worksheet 1}}

[[File:TL2.jpg]]

==Exercise 2==

Recreate the automatic light sequence by directly controlling the states of each of the indicators on the traffic light.

===Tasks===

* Open the flowchart from Ex1 and continue working from there.
* Remove the component macro call to the AutomaticMode function to disable this from running.
* Add component macro calls in your loop to call the SetLights component macro, add one for each state.
* Add delay icons between the component macros to recreate the automatic mode flow and transition timings.

==Exercise 3==

Recreate the automatic light sequence using the pre-programmed light states.

===Tasks===

* Open the flowchart from Ex1 and continue working from there.
* Remove the component macro call to the AutomaticMode function to disable this from running.
* Add component macro calls in your loop to call the SetLightState component macro, add one for each state.
* Add delay icons between the component macros to recreate the automatic mode flow and transition timings.
* Can you think of reasons why this way of coding is better or worse than in Exercise 2?

===What to do next===

Add a call to the GetStopGo function and assign the return value to a LED to indicate if it is safe to go through the light or not.

==Component Details==

A full listing of the macros and properties available in this component are available from the [[Component:_ID_0c6b22fc_6e81_4406_aabd_5feb928e6aee|Components Section]].

Component: Bluetooth ( Comms)

2026-02-26T11:59:05Z

SteveT: Made the filters section more readable

{| style="width:50%"
|-
| width="20%" style="color:gray;" | Author
| MatrixTSL
|-
| width="20%" style="color:gray;" | Version
| 0.1
|-
| width="20%" style="color:gray;" | Category
| Comms
|}

==Bluetooth component==
Allows connection to a bluetooth device from the browser.

==Detailed description==

''No detailed description exists yet for this component''

==Examples==

Example takes an inpt from a slider and outputs the number to a seven segment display. The display prints Err if the number is out of range.

{{Fcfile|7segtest.fcsx|Web 7 Segment Display Example}}

[https://www.flowcode.co.uk/wiki/WebDevExamples/7segtest.html Web 7 Segment Display Example]

==Macro reference==

===Disconnect===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Disconnect'''
|-
| colspan="2" | Disconnects from the remote BLE device 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===RequestDevice===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''RequestDevice'''
|-
| colspan="2" | Attempts to connect with a Bluetooth BLE device. 
|-
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

===WriteString===
{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" align="center" | [[File:Fc9-comp-macro.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''WriteString'''
|-
| colspan="2" | Writes a string value to GATT Characteristic on a connected BLE device 
|-
|-
| width="10%" align="center" | [[File:Fc9-string-icon.png]] - STRING
| width="90%" | sText
|-
| colspan="2" |  
|-
| width="10%" align="center" style="border-top: 2px solid #000;" | [[File:Fc9-void-icon.png]] - VOID
| width="90%" style="border-top: 2px solid #000;" | ''Return''
|}

==Property reference==

{| class="wikitable" style="width:60%; background-color:#FFFFFF;"
|-
| width="10%" align="center" style="background-color:#D8C9D8;" | [[File:Fc9-prop-icon.png]]
| width="90%" style="background-color:#D8C9D8; color:#4B008D;" | '''Properties'''
|-
|-
| width="10%" align="center" | [[File:Fc9-type-11-icon.png]]
| width="90%" | Filters
|-
| colspan="2" | Limits the list of available Bluetooth devices, for example:
* filters: [ { services: [0x1802, 0x1803] } ]
* filters: [ { name: "My Cool Device" } ]
* filters: [ { namePrefix: "Mtx" } ]
* filters: [ { services: ["heart_rate"] } ], optionalServices: ["battery_service"]
* (leave blank for all devices)  
|-
| width="10%" align="center" | [[File:Fc9-type-24-icon.png]]
| width="90%" | OnDisconnect
|-
| colspan="2" | Called when the Bluetooth device is disconnected 
|-
| width="10%" align="center" | [[File:Fc9-type-24-icon.png]]
| width="90%" | OnValueChanged
|-
| colspan="2" | Called when the Bluetooth characteristic value changes 
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Service
|-
| colspan="2" | The Primary Service of the Bluetooth GATT Server 
|-
| width="10%" align="center" | [[File:Fc9-type-10-icon.png]]
| width="90%" | Characteristic
|-
| colspan="2" | The Bluetooth GATT Characteristic 
|}

==Component Source Code==

Please click here to download the component source project: [https://www.flowcode.co.uk/wiki/componentsource/FC_Comp_Source_WEBEXP_Bluetooth.fcweb FC_Comp_Source_WEBEXP_Bluetooth.fcweb]

Please click here to view the component source code (Beta): [https://www.flowcode.co.uk/FlowchartView/?wfile=componentsource/FC_Comp_Source_WEBEXP_Bluetooth.fcweb FC_Comp_Source_WEBEXP_Bluetooth.fcweb]

Embedded Getting Started Guide

2026-02-23T16:18:47Z

SteveT: Updated to v11

[[File:Embedded Getting Started a.png]]

===Introduction===

Flowcode is an Integrated Development Environment (IDE) for programming microcontrollers such as 8, 16 and 32bit PIC, Arduino, ESP32, PICO and ARM devices.

It achieves this by using flowcharts instead of text based languages, thus making programming simpler and faster.

Flowcode also contains hundreds of pre-made component libraries, allowing users to interface with a host of sensors, inputs and outputs and electromechanical components with ease.

Despite its simplicity and ease of use, Flowcode is a powerful tool allowing users to develop even the most complex of embedded systems.

===Old Versions===
This page is current for Flowcode v11 and later. Earlier versions can be found below:
{| class="wikitable"
|+
|-
| [[Special:PermanentLink/39734|Flowcode v10]]
|}

===Prerequisites===

• A Windows based PC with a copy of Flowcode 11 installed

===What we'll cover in this guide===

This guide will be split into two main sections:

In section 1 we will provide an overview of the Flowcode IDE.

How users interact with the environment, add components to the simulation panel and create flowcharts.

In section 2 we will run through three examples which will increase in complexity and teach you how to create
microcontroller programs.

Flowcode supports both Matrix and 3rd party hardware. In this guide we will create examples
based on three different sets of hardware:
# Matrix BL0011 or BL0082 PICmicro board and BL0114 combo board
# Arduino Uno and Matrix BL0114 combo board
# Microchip Xpress board

===Section 1: The Flowcode IDE===

In this section we will provide an overview of Flowcode, detailing the programming interface and how users interact
with it to create microcontroller programs.

===Creating a project===
When you first launch Flowcode you will be presented with the following screen.

[[File:Flowcode - openning screen.png]]

For the first run through we want to start a new project as this gives us a blank canvas to go over the IDE.

If you select "New Project" then you will see:

[[File:Flowcode - new wizard step 1.png]]

The top three choices allow you to create one of 3 types of new project:
* Flowcode Embedded,
* Flowcode Web Developer, or
* Flowcode PC Developer.

The lower row are Quickstart options, and left-to-right these allow you to:
* Select a new Embedded project for the last hardware option you selected,
* Start a new Embedded project for the hardware that has been detected (if any), or
* Open an example or template.

If you select the bottom-right "Open an example or template" button, you will be presented with this screen:

[[File:Flowcode - new wizard step 2.png]]

There are curriculum packs for students on the Flowcode website which are useful to reference when first learning to use Flowcode. Most of the curriculum worksheets ask students to load a pre-written example and then modify it.

The examples are written for PIC, Arduino and ESP32 microcontroller variants and each are slightly different. Students should select the appropriate example from the relevant sub folder inside Flowcode as you can see from the screenshot above.

Once Flowcode has opened you will be presented with a screen similar to this:

[[File:Embedded_getting_started_5.png]]

You can either move the 2D panel out the way or dock it to the right-hand side for example.

1. Components

Provides access to the component library.

Double click or drag components onto the simulation panel.

2. Simulation Panel

Where all your components will live. Note that all components you wish to use must be added to the simulation panel.

3. Panel Properties

Here users select which pin/ port of the microcontroller the components are connected to.

4. Command Toolbox

Drag and drop programming icons onto the Flowchart window (5) to construct your program.

5. Main Window

This is where you create flowcharts.

All programs will have a 'BEGIN' and 'END', you must fill in the gaps in between with the
programming icons from point (4).

6. Project Explorer

This is where variables and macros (functions) are created, edited and viewed.

7. Ribbon

We use the icons in this ribbon to simulate, program our hardware, add components etc.

'''Did you know?'''
You can change the microcontroller at any point during your development.
Select the 'Project Options' window by clicking Build->Project Options- >Choose a Target from the main menu at the top of the screen

===Panels===

In this next section we will walk you through the 2D and the 3D panels.

The [[2d_Panels|2D panels]] is used are a replacement for the dashboard panel used in previous versions of Flowcode.

You can add as many 2D panels as you like, renaming each to suit your project.

The easiest way to do this is via the Panels tab of project explorer:

[[File:Embedded_getting_started_6.png]]

To open a new 2D panel, select the View ribbon>2D Panels>Add new 2d panel

[[File:Add_2d_Panel.png]]

Or within Project Explorer under 2D panels select Add new

[[File:Project_Explorer_Panels3.png]]

If you have multiple panels added then you can select what 2D panels are open by left-clicking on the panel name.

[[File:Multiple_2D_Panels_Open.png]]

Or you can select the Panels icon within project explorer.

[[File:Project_Explorer_Panels2.png]]

If there is no tick within View Panels or there is a red exclamation mark within project explorer Panels then the panel is closed.
Either select the tick or select Show respectively

To Rename a panel, select the panel within the Panels option of Project Explorer then select '''Rename'''.

The look of each 2D panel can be changed, via the 2d panel properties.
To select the properties option, select the panel within the Panels option of Project Explorer then select '''Properties'''.

For example, the panel colour, show a grid and the grid colour etc.

If the snap to gird requires changing, then the Show Grid must be enabled first.

There are various icons along the top of the 2D panels to help with object alignment.

[[File:Embedded_getting_started_7.png]]

It will depend on how many objects are selected to what function can be selected.

With one object selected.

1 - 4 are for moving the object in relation to other objects.
E.g Move to front (1), Move to back (2) etc.

Just hover over the function and a tooltip will state what the function is

[[File:Embedded_getting_started_8.png]]

With two or more objects selected
5 - 10 are for object alignment.

You we need to make sure that for '''Align left''' (5), all other selected objects will align to the left most object.
For '''Align top''' (8), all other selected objects will align to the upper most object etc.

With three or more objects selected
11 - 12 are for object distribution.

Distribute horizontally (11), the far left and far right of all the selected objects will remain fixed in place and all the other objects will be aligned equally spaced.

Distribute vertically (12), the far upper and far lower of all the selected objects will remain fixed in place and all the other objects will be aligned equally spaced.

===Section 2: Flowcode===
We will now run through several examples: LED flasher, creating a latch and finally the use of an LCD screen to create a counter.

Each will increase in complexity and at the same time reduce in provided information, requiring you to remember what you have learned in previous examples.

Template files Flowcode comes with a selection of template files which are made to assist you with development.

These are based on popular development boards from Matrix and 3rd party equipment such as Microchip and Arduino.

The template file will have all the necessary hardware components added to the simulation panel, and be configured correctly.

For our first example we will use a template file and in example 2 and 3 we will create a new blank project, to demonstrate both processes.

To use template files, Select "File-> New Project-> Open an example or template" and you will see:

[[File:Flowcode - new wizard step 2a.png]]

You will be presented with a choice of templates where you can select the most appropriate board for your use.

For example, if you're using the BL0011 and BL0114 combo board, navigate to E-blocks2 section and select BL0011_Combo.

We are now ready to begin example 1.

===Example 1: LED flasher===

In this example we will create an LED flasher which will introduce you to the most basic Flowcode features.

This will run in simulation and can be downloaded to hardware.

To make an LED flasher we will simply turn the LED on and off, repeatedly.

Since we are using a template we already have an LED on our simulation panel on our BL0114 board.

Ensure that the configuration properties are as seen below.

We will be using the LED connected to PORTA.0

[[File:Embedded_getting_started_10.png]]

Now we will create our flowchart.

To make our microcontroller execute code indefinitely we use a "while(1)" loop in our flowchart.

This loop condition essentially means that whatever code is placed within our loop will execute, forever.

You can drag the Loop over to your flowchart, yet using Templates create the Loop for you. By
default the loop command is set to be a while (1) loop, so it does not need any further
configuration.

[[File:Embedded_getting_started_11.png]]

With our "while (1)" loop added we can now focus on turning the LED on and off.

Since an LED is an output, we will use the 'Output' icon.

Drag an output icon across onto your flowchart, as seen below, ensuring it sits within the while
loop.

[[File:Embedded_getting_started_12.png]]

You will notice a red star on the top 0f the icon

[[File:Embedded_getting_started_12a.png]]

That just means there are changes made since the last save.

If you save your project, the star will disappear.

You will now need to configure the output icon.

This is done by double clicking it to view its properties.

Our LED is connected to PORTA.0, so we must configure our properties to match this.

to select a single pin, in this case output to '''Single Bit 0''' click '''Show advanced options'''

Finally, since we want to turn the LED on we write a value of '1' in the 'variable or value' box

[[File:Embedded_getting_started_13.png]]

To make an LED flash we must turn it on and off.

Place another output icon on your flowchart, below the original, and configure it as before.

Although this time you should write a value of '0' instead to turn our LED off.

Our final step is to add delays.

Microcontrollers operate at very high speeds (a 32 MHz crystal is used on the BL0114 as standard).

The default 32MHz crystal makes the PIC operate 8 million instructions per second.

If it were to turn the LED on and off at this speed, we would not be able to see the change occurring.

Therefore, we add delays into our system. We will add a simple 1 second delay.

[[File:Embedded_getting_started_14.png]]

To add a delay we follow the same procedure as adding other icons, but instead drag a 'delay' icon onto our flowchart.

As before, we double click our 'delay' icon to configure it for the delay we require.

We can see the delay configuration screen below, where we have set a 1 second delay.

[[File:Embedded_getting_started_15.png]]

Currently we turn our LED on for 1 second, then we turn it off.

However, we do not hold the LED off and so it will turn on again very fast.

It would therefore appear that the LED is always on.

We must add another delay icon after we turn the LED off, which can be seen in the final flowchart below

[[File:Embedded_getting_started_16.png]]

The simple LED flasher is now finished.

First we will simulate our program to check it works as required.

Then we will write it to hardware, and get a real LED flashing.

To simulate, we use the buttons seen in the image below.

[[File:Embedded_getting_started_17.png]]

The 'Play' button begins our simulation.

Once in play mode we can pause or stop our simulation.

The two icons on the very right allow us to manually step through our program.

As previously mentioned microcontrollers operate at very high speeds…much faster than we can see!

We often need to manually step through each icon in order to check that our program is working correctly.

I like to use the 'F8' key, rather than clicking on the 'step Into' button.

If we run our simulator we will see that our LED flashes on for 1 second, and off for 1 second.

[[File:Embedded_getting_started_18.png]]

Now that our program has been simulated and is working as required we will download our program to hardware.

Depending on the hardware used, we will now provide some information below to check that it is connected and configured correctly and you are following the correct procedure for programming.

We will now cover the configurations needed for the three types of hardware covered in this guide:
1. Matrix hardware
2. Arduino Uno hardware
3. Microchip Xpress hardware

===1. Matrix hardware===
====Upstream boards====
In this section we will briefly discuss Matrix hardware: E-Blocks 2 BL0011 PIC board and the E-Blocks 3 BL0082 PIC board.

Datasheets for both can be found on the [https://www.matrixtsl.com MatrixTSL website].

These upstream PICmicro boards are both fitted with a PIC16F18877 microcontroller and are powered and programmed via a USB cable.

[[File:Embedded_getting_started_19.png|BL0011 E-Blocks 2 PICmicro board]] [[File:E-Blocks3 upstream board.png|BL0082 E-Blocks 3 PICmicro board]]

====Downstream boards====
The E-Block2 combo board (BL0114) is a useful board that combines switches, LEDs, analogue sensors, 7-segment and LCD displays on a single downstream board.

The BL0114 combo board will need to be connected to the BL0011 on PORT A and B for this guide.

The BL0114 features:
• 16 individual LEDs
• 16 individual switches
• Quad 7-segment display
• 20 x 4 character alphanumeric LCD
• On-board analogue channels (Light / Potentiometer)
• Audio output socket

[[File:Embedded_getting_started_20.png]]

Alternatively, separate downstream boards can be used depending on the requirements of the example.

===2. Arduino hardware===
From Flowcode select: "File-> New Project-> Embedded-> Arduino" and you are presented with the following screen:

[[File:Flowcode - new wizard step 3.png]]

If you are using an Arduino Uno you must ensure you have the Arduino drivers installed before you can program directly from Flowcode.

Consult the Arduino website to download the latest drivers for your hardware.

With the drivers installed, and the Arduino microcontroller selected from within Flowcode, you should now check that Flowcode has seen your connected hardware.

Navigate to "Build-> Project Options" and you will see the image below.

[[File:Embedded_getting_started_21.png]]

From the ‘Programmer Port’ drop down box (outlined in red) you must select the appropriate COM port for your Arduino (COM4 is shown in the image below but this might be different on your PC).

Note that the COM port will only be shown if your Arduino is connected and the drivers are installed.

'''Did you know?'''
If you are using an Arduino, you cannot change properties such as the configuration and clock speed as these are fixed.

===3. Microchip Xpress hardware===
If you are using the Microchip Xpress hardware, ensure you have the correct microcontroller selected from the Project Options menu.

As with other hardware, press compile to chip, and Flowcode will program the Xpress board.

Note: There are no drivers to install for the Xpress board, however, check it has been seen correctly by navigating to my computer and the Xpress board should be seen as a mass storage device.

After you have programmed your board, you will see the name of your program saved as a .HEX file on your board Once your flowchart is complete you create a hex file by pressing the button seen below:

[[File:Embedded_getting_started_22.png]]

[[File:Embedded_getting_started_23.png]]

'''Did you know?'''
If you are using the Microchip Xpress board, you won’t be able to complete the third example program in hardware. However, you can still use the simulator.

With your appropriate hardware connected and configured correctly, you must now program the device.

In Flowcode it is easy to download our program to hardware.

When downloading code to our device we again have a shortcut toolbar.

There are 3 icons in the programming section of the toolbar, as seen below.

The left icon compiles our flowchart into a .C file, while the middle icon compiles the Flowchart into a .Hex file.

These two options are useful if you are using Flowcode to create your program, but 3rd party hardware to flash your microcontroller.

With these examples we are using Flowcode to flash our microcontroller, and as such we use the right-hand icon.

This compiles and programs our microcontroller in one button press.

[[File:Embedded_getting_started_24.png]]

Once we select to program the device a new window will appear on the screen detailing the compilation and programming progress.

When complete you should see the program working as desired on hardware.

If it is not, ensure that you have followed every step in this tutorial, and that the flowchart is correctly configured.

===Example 2: Creating a latch===

In the next two examples we will assume you are now getting to grips with Flowcode and will provide you with a few less details.

We’ll still walk you through any new features though, so do not worry.

In this example we will look at adding a switch to the simulation panel, and creating a latching system from a simple momentary push-to-make switch.

First you must create a new program and select the appropriate microcontroller as discussed earlier in this guide.

We will create a program that reads the switch and lights up an LED when pressed.

When the user releases the switch, the LED should stay on until the switch is pressed again.

This will introduce us to two new programming concepts: inputs and variables.

First we will add our components to the 2D simulation panel.
We need:
• Switch Push Button [2D] - Change the properties to 'Latching' No.
• LED Mono [2D]

Select 'Component Libraries...' ribbon.

[[File:Embedded_getting_started_25.png]]

Either use the Search - the magnifying glass on the right (1)

Or Select Inputs icon (2) and Look for the desired switch.

Select Outputs icon (3) and Look for the desired LED.

If you double click on a component in the 2D Panel, you can access its Properties where you can change port connections of the component if required.

[[File:Embedded_getting_started_26.png]]

Consult the table below for connection properties relevant to the hardware you are using:

[[File:Embedded_getting_started_27.png]]

We will now create a variable.

When reading inputs, we must have a variable to save the state of the switch press.

To create a variable, click on the Variables icon (1) Project Explorer and click the down arrow (2) next to 'Variables' click 'Add new' (3).

[[File:Embedded_getting_started_28.png]]

The 'Edit variable name' window will appear.

There are 4 sections we should fill out.

Although the description is optional, it is good practice to do so.

1. Here we’ve called our variable SwitchPressed. Note you cannot have spaces in variable names.

2. We have initialised our variable to zero to ensure no old values remain in memory

3. We added a brief description so that later we can remember exactly what this variable does. This is purely a visual hint and has no bearing on functionality, but it is good programming practice to give your variables a brief description.

4. We are selecting this as a type 'byte', therefore it can save any value between 0-255.

[[File:Embedded_getting_started_29.png]]

'''Did you know?'''
If you have multiple variabes of the same type they can all be entered at onece seperating them by a comma.
E.g. Variable1, Variable1, Variable3 etc.

Next, add a while(1) loop to the flowchart, as we did in
the first LED flasher example.

Then, add an input to the flowchart within this loop.

Configure the input as below, ensuring that you selct port B fro the Port and then click on the down arrow for Show advanced options.

Select Single Bit: 0
(for the Arduino Uno or Xpress board you will need to select the same pin that the switch is connected to, see the table above).

You must also select to save to the variable called SwitchPressed.

This reads the switch whenever we call this icon, and will save its state to the variable SwitchPressed.

If the switch is pressed, it will return a ‘1’, if nothing is pressed, it will return a ‘0’.

[[File:Embedded_getting_started_30.png]]

'''Did you know?'''
Whenever we use switches with microcontrollers we need to consider a thing called 'bounce'.

Bounce occurs when a user presses a switch and the generated mechanical movement can cause the switch to physically bounce between the on/ off state multiple times, even though we only intended to press it once.

Since microcontrollers operate so fast, this will result in unwanted switch presses.

Imagine a small microcontroller system where a person working on a ticket gate is pressing a switch to count people attending a sporting event.

If debounce wasn’t implemented, they may press a switch as a person walks past and the mechanical bounce of the switch may count 3 people, despite only feeling like it was pressed once.

We overcome this by adding de-bounce.

De-bounce can be added in hardware, or more commonly through programming.

The simplest way to overcome bounce in software is to add a small delay after a switch is pressed.

A value of 20-50ms is typically enough.

Add a delay of 50ms directly after your input icon to allow for bounce.

With the value now stored in the variable 'SwitchPressed' we must do something with it.

We could just add a single output icon to turn on the LED whenever we press the switch, but that’s a bit too simple.

Instead we will make a latch, so when the switch is pressed it turns on the LED and holds it on until the switch is pressed again.

There are several ways to achieve this, but for this one we need a second variable, which we have named ‘Flag’.

What we want to do is toggle the value of Flag only when the button is pressed.

To achieve this we use a 'Decision' command.

The first thing we need to do is determine whether the switch was pressed or not.

Drag a decision command onto the flowchart (underneath the delay icon), and configure it as seen below:

[[File:Embedded_getting_started_31.png]]

Two things to note:
1. The decision icon does not require two lots of equals as is required by C code.
2. This example will also work if you leave out the '= 1'. That is because no value is the same as any value except 0.

Since we are creating a latch we only want to modify the value of Flag when the switch has been pressed.

Therefore, we will only place code in the ‘Yes’ branch of the decision.

We leave the ‘No’ branch empty.

Once the switch has been pressed we want to toggle the value of Flag from 0-1 or vice versa. Place a calculation box within the Yes branch.

The statement here Flag = !Flag will toggle the value of Flag between 1 and 0 each time it is executed.

[[File:Embedded_getting_started_32.png]]

Our final command is to output the status of Flag to the LED. We do this with an output command, as we did in the first example.

However, rather than writing a 1 or 0 in the ‘Variable or Value’ box we write the variable name Flag.

[[File:Embedded_getting_started_33.png]]

You should now both simulate and download your code to hardware for verification.

As you press the switch on your board, the appropriate LED should illuminate, and stay that way until you press the switch again.

Once confirmed working, move onto the final exercise.

===Example 3: LCD screen and counter===

In the final example we will step through creating a simple counter, and displaying that value on an LCD display. (If you are using the Xpress board, this exercise can only be performed in simulation mode).

In this exercise you will be introduced to a new flowchart command: the component macro.

A component macro is how we interface with the more complex components in Flowcode.

For simple things like switches and LEDs we can use inputs and outputs.

However, if we want to talk to an LCD screen we may need to execute a series of commands back and forth.

Component macros are libraries of code that we have developed that simplify project creation. As with example 2, we will step through familiar concepts with less detail, but any new features will be carefully explained.

Create a new flowchart with the correct microcontroller selected and add an LCD (Generic, 20 x 4) screen to the 2D simulation panel.

This is the screen used on both the standalone BL0169 Eblocks2, and the BL0144 combo board used in this tutorial.

With the LCD screen added to the simulation panel you should check it is connected appropriately.

[[File:Embedded_getting_started_34.png]]

We will now quickly progress through a few steps where we are doing familiar coding.

If you struggle to keep up you can check the code listing at the end of this section.

1. Create a variable called 'Counter' of type byte, and initialise it to zero.

2. Place a while(1) loop into your flowchart

3. Place a calculation box within this while(1) loop, and increment the variable counter using a calculation command
Counter = Counter + 1

4. Place a 1 second delay after the calculation box

If we were to run this program now it would simply count up from 0-255.

Since we are using a variable type of Byte for 'Counter' it will reach 255 and roll back around to zero where it will continue counting again.

Despite having a counter we do not yet have a method of displaying this information on the LCD screen.

We will now introduce component macros.

Add a component macro to the very start of your flowchart, above the while(1) loop, as seen below:

[[File:Embedded_getting_started_35.png]]

Open its configuration properties, as usual, by double clicking on the component macro.

You will see the box below.

[[File:Embedded_getting_started_36.png]]

Press the + button next to the LCD_4x20 component to access the available component macros.

Once opened you will see a list of all component macros available for the LCD screen.

These are all pre-written sub routines, developed by Matrix, to assist you with using the LCD screen.

The first we want to use is 'Start'. Scroll down the list, select Start and press 'OK'.

[[File:Embedded_getting_started_37.png]] [[File:Embedded_getting_started_38.png]]

Alternatively, within '''Project Explorer''' select 'Components' icon

[[File:Embedded_getting_started_39.png]]

Press the + button next to the LCD_4x20 component to access the available component macros.

The Start component macro can be dragged to the correct position.

[[File:Embedded_getting_started_41.png]]

The Start routine is required to initialise the LCD screen, so that the microcontroller knows it exists, and sets up timing routines etc.

'''Did you know?'''
Without this macro you would have to input approximately 30-40 lines of code/ flowchart icons to initialise the screen.
You can see why component macros are such a useful feature.

With the screen initialised we need two more component macros.

The first is to display the value of the variable ‘counter’ on the LCD screen.

Add another component macro within the while(1) loop, directly above the calculation box.

Configure it to be a ‘PrintNumber’ macro, however, you will notice that there is a parameter box that you must now fill in, called ‘Number’.

Here we must write the name of our variable: "Counter".

Each time this command is now executed it will display whatever value we currently have saved in counter.

There is one final component macro we need. We want our value of Counter to always be displayed in the top left corner (X,Y position: 0,0).

Currently our program will write the value of Counter on the LCD screen, however, the cursor will move each time we write a value and we will end up with something like below:

[[File:Embedded_getting_started_42.png]]

What we need to do is clear the LCD screen each time we write a new value.

Luckily for us executing a clear screen routine also moves the cursor position back to (0,0).

Add another component macro above the PrintNumber macro, and configure it to ‘Clear’.

We have now finished our third and final example.

You should first test your program is right by comparing it to the code listing below. Simulate, before downloading to hardware to check it's worked as expected.

[[File:Embedded_getting_started_43.png]]

'''Did you know?'''
The BL0114 combo board has small slide switches used to turn the LCD screen and the 7SEG LCD screen on and off.
Make sure that this switch in in the ‘on’ position for the LCD screen when using the display.

We have now introduced you to the most basic principles within Flowcode.

These principles are the foundation of all microcontroller development.

There are more complex features that we have not covered, but at this point you should have an understanding of how Flowcode works, and be able to begin experimenting for yourself as to other features.

File:Flowcode - new wizard step 3.png

2026-02-23T15:21:02Z

SteveT:

New project wizard step 3

File:Flowcode - new wizard step 2a.png

2026-02-23T15:20:36Z

SteveT:

New Project Wizard Templates 2

File:Flowcode - new wizard step 2.png

2026-02-23T15:20:06Z

SteveT:

New Project Wizard Templates

File:Flowcode - new wizard step 1.png

2026-02-23T15:19:09Z

SteveT:

New Project Wizard (step 1)

File:Flowcode - openning screen.png

2026-02-23T15:18:25Z

SteveT:

Flowcode openning screen

File:E-Blocks3 upstream board.png

2026-02-23T15:15:34Z

SteveT:

E-Blocks 3 upstream PIC board

Blueprints

2026-02-03T15:50:01Z

SteveT: Created page with "__TOC__ ==Introduction== Blueprints are a new feature introduced in Flowcode v11.0.1 which allow a simple high-level flowchart to be created within a Flowcode project. Blu..."

__TOC__

==Introduction==

Blueprints are a new feature introduced in Flowcode v11.0.1 which allow a simple high-level flowchart to be created within a Flowcode project.

Blueprints work in a similar way to normal Flowcode macros but have no code associated with them and cannot be simulated or compiled into a working program. They can be viewed as a flowchart and as pseudocode and use a subset of the normal flowchart icons.

Typically these can be used to describe a process or workflow associated with the Flowcode project or to be the starting point for creating a new code macro.

{|
|+
|-
| [[File:BlueprintExample.png]] || [[File:BlueprintPseudocode.png]]
|}

==Creating a new Blueprint==

New Blueprints can be created via Project explorer or via the "New Macro" button in the User Macros menu.

[[File:NewBlueprint(via project explorer).png]]

[[File:NewBlueprint(via menu).png]]

When creating a new Blueprint, a Name and optional Description can be added. These can be edited later via the Project Explorer context menu.

[[File:BlueprintDetails.png]]

==Adding icons to a Blueprint==

Just like a normal code macro, icons can be added to a Blueprint by dragging them from either the Command Icon toolbar or from the list of Command Icons in Project Explorer.

When adding an icon to the Blueprint, a window will be shown when details can be entered for the icon. This is limited to a displayed name and a detailed description (which will be shown as a tooltip when the mouse is hovered over the icon). Note that not all command icons will be available for inclusion in a Blueprint.

[[File:BlueprintEditIcon.png]]

==Viewing Blueprints==

As with normal code macros, the same Blueprint can be viewed in different ways. For Blueprints, these view types are as a flowchart or as pseudocode. Right-click the Blueprint heading tab or the entry in Project Explorer to change the view type.

[[File:BlueprintContextMenu.png]]

==Using Blueprints to design code==

Blueprints are often not intended to be converted into actual executable code. For example, they may be showing a process that a user must perform.

However, a Blueprint can also be used as an initial attempt to describe a new code macro before it has been created. In fact, experienced programmers will often design a new software routine as a collection of comments rather than writing code. Blueprints can be used to mimic this initial design process.

A Blueprint can be converted to actual executable icons via the context menu in Project Explorer.

Once converted, the Blueprint will be replaced with an equivalent macro that can be edited to create an actual executable function. Each icon will be converted to its code-based equivalent and will retain the displayed name, and detailed description entered when creating the Blueprint.

The macro will need to be edited to create the appropriate code required, but starting with a Blueprint allows you to concentrate on the outline and overall function of a new macro without being bogged-down with specific details.

File:NewBlueprint(via menu).png

2026-02-03T14:57:11Z

SteveT:

New Blueprint via User Macros menu

File:NewBlueprint(via project explorer).png

2026-02-03T14:56:25Z

SteveT:

New Blueprint (via Project Explorer)

File:BlueprintDetails.png

2026-02-03T14:55:53Z

SteveT:

Editing or creating a new Blueprint

File:BlueprintEditIcon.png

2026-02-03T14:55:16Z

SteveT:

Editing or creating a new Blueprint icon

File:BlueprintExample.png

2026-02-03T14:54:32Z

SteveT:

An example Blueprint flowchart

File:BlueprintPseudocode.png

2026-02-03T14:53:46Z

SteveT:

Blueprint shown as pseudocode

File:BlueprintContextMenu.png

2026-02-03T14:53:00Z

SteveT:

Context menu for a Blueprint macro

Custom Interrupts - PICmicro

2026-02-03T14:22:45Z

SteveT: /* Old Versions */

The Custom option of the [[Interrupt_Icon_Properties|Interrupt icon]] allows the creation of custom interrupt code.

Many of the chips available in Flowcode support hardware driven interrupts that are not provided in the standard set of Flowcode interrupts. To allow users to add their own interrupts to suit their application Flowcode has the option to add your own custom interrupt.

==Old Versions==
This page is current for Flowcode v11 and later. Earlier versions can be found below:
{| class="wikitable"
|+
|-
| [[Special:PermanentLink/41942|Flowcode v10]]
|-
| [[Special:PermanentLink/41942|Flowcode v9]]
|-
| [[Special:PermanentLink/41942|Flowcode v8]]
|-
| [[Special:PermanentLink/41942|Flowcode v7]]
|-
| [[Special:PermanentLink/16608|Flowcode v6]]
|}

 
Here are a few examples for such interrupts using PICmicro chips. To create interrupts that are not shown below you will have to refer to the device datasheet. Once the code has been placed into the custom interrupt properties dialog, the interrupt can be enabled and disabled like any of the standard Flowcode [[Interrupt Icon Properties|Interrupts]].

'''USART receive''' - This can be nicely integrated with the Flowcode RS232 component.

'''Comparator''' - Example of the use of a function not supported by Flowcode.

'''Timer1''' rollover - An example of the use of another unsupported, but potentially useful, function.

 '''Target PIC Processor ( PIC16F877A )''' 

 '''(Note: For other PIC devices you may have to refer to the device datasheet to obtain the correct code)''' 

==USART Receive==

[[File:CustomInterrupt USART.png|right]]

The Flowcode RS232 component can be used to set the Baud rate and configure the mode of operation, and the ReceiveRS232Char function can be used in the handler macro to read the data (clearing the interrupt).

'''Enable code:'''

 INTCONbits.PEIE = 1; // Enable peripheral interrupts

INTCONbits.GIE = 1; // Enable global interrupts

PIE1bits.RCIE = 1; // Enable USART receive interrupts 

'''Disable code:'''

 PIE1bits.RCIE = 0; // Disable USART receive interrupts 

'''Handler code:'''

 if (PIR1 & (1 << RCIF)) // Check to see if the interrupt flag is set

{

FCM_%n(); // Call Flowcode Macro

PIR1bits.RCIF = 0; // Clear interrupt flag

} 

==Analogue Comparator==

[[File:CustomInterrupt COMPARE.png|right]]
'''Enable code:'''

 INTCONbits.PEIE = 1; // Enable peripheral interrupts

INTCONbits.GIE = 1; // Enable global interrupts

PIE1bits.CCP1IE = 1; // Enable Capture Compare interrupts 

'''Disable code:'''

 PIE1bits.CCP1IE = 0; // Disable Capture Compare Interrupts 

'''Handler code:'''

 if (PIR1 & (1 << CCP1IF)) // Check to see if the interrupt flag is set

{

FCM_%n(); // Call Flowcode Macro

PIR1bits.CCP1IF = 0; // Clear interrupt flag

} 

The state of the comparator input can be read into a Flowcode variable 'compstate' with the following C code line:

 FCV_COMPSTATE = ccpr1l | ( ccpr1h << 8 ); 

{| width="auto"
|<pre>** compstate must be declared as an integer variable **</pre>
|}

==Timer1 Rollover==

[[File:CustomInterrupt TIMER.png|right]]
'''Enable code:'''

 T1CON = 0x79; // Start timer with Internal clock source, prescaler = 1:8

INTCONbits.PEIE = 1; // Enable peripheral interrupts

INTCONbits.GIE = 1; // Enable global interrupts

PIE1bits.TMR1IE = 1; // Enable Timer 1 interrupts 

'''Disable code:'''

 PIE1bits.TMR1IE = 0; // Disable Timer 1 interrupts 

'''Handler code:'''

 if (PIR1 & (1 << TMR1IF)) // Check to see if the interrupt flag is set

{

FCM_%n(); // Call Flowcode Macro

PIR1bits.TMR1IF= 0; // Clear interrupt flag

} 

The captured 16-bit count value can be read into a Flowcode variable 'captval' with the following C code line:

FCV_CAPTVAL = TMR1L | ( TMR1H << 8 ); 

{| width="auto"
|<pre>** captval must be declared as an integer variable **</pre>
|}

Custom Interrupts - PICmicro

2026-02-03T14:21:12Z

SteveT: fixed the screenshots and added old version links

The Custom option of the [[Interrupt_Icon_Properties|Interrupt icon]] allows the creation of custom interrupt code.

Many of the chips available in Flowcode support hardware driven interrupts that are not provided in the standard set of Flowcode interrupts. To allow users to add their own interrupts to suit their application Flowcode has the option to add your own custom interrupt.

==Old Versions==
This page is current for Flowcode v11 and later. Earlier versions can be found below:
{| class="wikitable"
|+
|-
| [[Special:PermanentLink/23682|Flowcode v10]]
|-
| [[Special:PermanentLink/23682|Flowcode v9]]
|-
| [[Special:PermanentLink/23682|Flowcode v8]]
|}

 
Here are a few examples for such interrupts using PICmicro chips. To create interrupts that are not shown below you will have to refer to the device datasheet. Once the code has been placed into the custom interrupt properties dialog, the interrupt can be enabled and disabled like any of the standard Flowcode [[Interrupt Icon Properties|Interrupts]].

'''USART receive''' - This can be nicely integrated with the Flowcode RS232 component.

'''Comparator''' - Example of the use of a function not supported by Flowcode.

'''Timer1''' rollover - An example of the use of another unsupported, but potentially useful, function.

 '''Target PIC Processor ( PIC16F877A )''' 

 '''(Note: For other PIC devices you may have to refer to the device datasheet to obtain the correct code)''' 

==USART Receive==

[[File:CustomInterrupt USART.png|right]]

The Flowcode RS232 component can be used to set the Baud rate and configure the mode of operation, and the ReceiveRS232Char function can be used in the handler macro to read the data (clearing the interrupt).

'''Enable code:'''

 INTCONbits.PEIE = 1; // Enable peripheral interrupts

INTCONbits.GIE = 1; // Enable global interrupts

PIE1bits.RCIE = 1; // Enable USART receive interrupts 

'''Disable code:'''

 PIE1bits.RCIE = 0; // Disable USART receive interrupts 

'''Handler code:'''

 if (PIR1 & (1 << RCIF)) // Check to see if the interrupt flag is set

{

FCM_%n(); // Call Flowcode Macro

PIR1bits.RCIF = 0; // Clear interrupt flag

} 

==Analogue Comparator==

[[File:CustomInterrupt COMPARE.png|right]]
'''Enable code:'''

 INTCONbits.PEIE = 1; // Enable peripheral interrupts

INTCONbits.GIE = 1; // Enable global interrupts

PIE1bits.CCP1IE = 1; // Enable Capture Compare interrupts 

'''Disable code:'''

 PIE1bits.CCP1IE = 0; // Disable Capture Compare Interrupts 

'''Handler code:'''

 if (PIR1 & (1 << CCP1IF)) // Check to see if the interrupt flag is set

{

FCM_%n(); // Call Flowcode Macro

PIR1bits.CCP1IF = 0; // Clear interrupt flag

} 

The state of the comparator input can be read into a Flowcode variable 'compstate' with the following C code line:

 FCV_COMPSTATE = ccpr1l | ( ccpr1h << 8 ); 

{| width="auto"
|<pre>** compstate must be declared as an integer variable **</pre>
|}

==Timer1 Rollover==

[[File:CustomInterrupt TIMER.png|right]]
'''Enable code:'''

 T1CON = 0x79; // Start timer with Internal clock source, prescaler = 1:8

INTCONbits.PEIE = 1; // Enable peripheral interrupts

INTCONbits.GIE = 1; // Enable global interrupts

PIE1bits.TMR1IE = 1; // Enable Timer 1 interrupts 

'''Disable code:'''

 PIE1bits.TMR1IE = 0; // Disable Timer 1 interrupts 

'''Handler code:'''

 if (PIR1 & (1 << TMR1IF)) // Check to see if the interrupt flag is set

{

FCM_%n(); // Call Flowcode Macro

PIR1bits.TMR1IF= 0; // Clear interrupt flag

} 

The captured 16-bit count value can be read into a Flowcode variable 'captval' with the following C code line:

FCV_CAPTVAL = TMR1L | ( TMR1H << 8 ); 

{| width="auto"
|<pre>** captval must be declared as an integer variable **</pre>
|}

File:CustomInterrupt COMPARE.png

2026-02-03T14:13:28Z

SteveT:

Custom interrupt example (Analogue comparator)