Dynamic creation of Symbols and Components, using various Panels types as containers.
The children elements, and its properties, can be defined in the Designer mode, for preview, and queries dynamics from real-time tags, database queries and other sources.
On this page:
Requirements
This component is Portable. It runs both on Windows and on Web Pages hosted in any platform.
Configuration
To configure a FlowPanel:
Go to Displays / Draw.
On the Components Panel, select Viewer, then FlowPanel.
Click or drag-and-drop it on the Drawing area to use it.
Double-click the component to open the configuration window.
FlowPanel Settings | |
|---|---|
Field | Description |
Panel Type | Sets the Panel mode for the component. Options are: WrapPanel: Positions child elements in sequential position from left to right, breaking content to the next line at the edge of the containing box. Canvas: arrange the items using the standard Canvas container. DockPanel: arrange the items using the standard Dock container. Grid: Defines a flexible grid area consisting of columns and rows. StackPanelHorizontal: Arranges child elements into a single line oriented horizontally. StackPanelVertical: Arranges child elements into a single line oriented vertically. UniformGrid: Used to arrange children in a grid with all equal cell sizes. |
Panel Settings | |
Items Source | Determines the source of the items displayed in the FlowPanel. Can be bound to a list or collection, and users can specify the type of data, such as text or objects. Options are: Text: Allows the FlowPanel to display a list of simple text items. Useful for representing straightforward string values such as machine states or operational modes. StringTag: Enables the FlowPanel to display a list of items generated from a pre-existing Tag of the Text type. This feature is particularly useful when multiple FlowPanels across different displays need to present the same information consistently. Array: Allows the FlowPanel to display items from an array. Suitable for predefined sets of options, such as lists of sensor IDs or operational steps, enabling efficient management of uniform data. Object: Allows the FlowPanel to display items from a collection of objects. Ideal for complex data representation where each item has multiple attributes, such as equipment lists with properties like name, ID, and status. The object can be Databases Queries, or any realtime Tag, AssetPath, or property from the system namespaces |
Max Items | Specifies the maximum number of items that the FlowPanel can display or hold. Limits the number of items to prevent overload and improve performance. |
Reload | Specifies a command or function that reloads the items in the FlowPanel. Ensures that the FlowPanel displays the most current data, useful for dynamic or real-time data sources. |
Quantity | Defines how many items will be sourced from Text Source, and also displays such amount in the design preview. |
Width | Defines the width of each panel, ensuring that each panel is properly sized according to the user's preferences and fits seamlessly within the FlowPanel. |
Height | Defines the height of each panel, ensuring that each panel is properly sized according to the user's preferences and fits seamlessly within the FlowPanel. |
Margin | Specifies the margin for each panel, ensuring sufficient spacing to avoid a cramped layout. |
Runtime Execution
The FlowPanel is designed to display data according to the user's requirements. Upon loading and whenever the reload trigger is activated, the panel populates by querying data from the designated sources. This functionality is highly effective for presenting information while maintaining a structured and organized layout.
In this section: