Total: ~26 min

When building out the user interface for access into a SCADA application it is important to think about the means of navigation available to the user. This section covers the out-of-the-box tools available to create professional dashboards and user interfaces, as well as how to save development time on the design and reuse of displays.

Using Grid and Canvas Displays

GraphWorX64 uses a hierarchical object scheme for object creation and inheritance. When a new display is created, it starts off with the "This Display" object into which all other GraphWorX64 objects are contained. The display layout can be either a Canvas or Grid format.

Designing with Grid Displays

Grid display designs are well suited to certain applications within dashboards, particularly for organizing top level menus and navigation frames, collections and lists of symbols, and general dashboard alignment. Grid displays are also a simple way to organize simple HMI Panel displays with a matrix of buttons, dials, and status indicators in order to replicate simple panels.

Designing with Canvas Displays

The main feature for a canvas display is that any objects or pre-defined dynamics can be dropped off anywhere on the canvas, it provides the flexibility to create and explore.

Using Multiple Grids andCanvases within One Display

GraphWorX64 allows multiple grids and canvases within one display: different types of panels could be added into grids in grid layout. This is a great way to organize the contents by sections in the display while remain the flexibility of the canvas.

Embedding Displays within Other Displays

GraphWorX64 Viewer is an embedded, standalone window that can be moved and re-sized within a display. This can be useful to embed multiple independent displays within one workspace.

Navigation Using Embedded Displays

This video further discusses how to configure GraphWorX64 Viewers and load multiple displays within using simple Pick Action.

Adding Wrapping and Stackable Panels to a Display

Panels are containers similar to groups yet with automatic layouts of the contained objects to help the user arrange the objects. This video covers the functionality of Stack and Wrap Panel: Stack panel stacks objects from top to bottom in the sequence in which they are added; Wrap panel adds objects one at a time in the first row or column, and when that row or column is filled it moves to the next row or column.

Adding Scrollable Panels to a Display

Scroll Panel is a handy tool to use when need to create a GraphWorX display but don't have the real estate for the entire display at runtime. It includes configurable scroll bars to allow runtime navigation.

Horizontal and Vertical Split Panels

When part of a display needs to support a variable viewing area, the split panel provides a method of organizing the content. Split Panels can be configured for either Horizontal or Vertical orientations.