Open topic with navigation

Solution Builder GUI Overview

The main parts of the Solution Builder GUI are as follows:

• Stage: The background where you create the layout of your dashboard.
• Properties: The pane where you set the characteristics of the selected objects in your layout. By setting properties, you control size, appearance, behavior, and more.
• Outline pane: The hierarchy of the objects on the stage or of the components of a symbol (which is a compound object).
• Project/Data pane: In the Project pane, you manage the files that store the components of your dashboard, such as images, .csv files, and so on. On the Data pane, you have access to data that you can use to populate your application. When you select project files or data, details about the selected item are displayed in the Details pane below.
• Widgets: Displays the widgets (customizable graphical building blocks) that you can use in your applications.

The following figure shows how the primary panes of the Solution Builder GUI are organized:

More about the Data pane

The nodes in this pane provide some essential functionality, as follows:

• data: Static data that you add manually.
• downstream: Data from DSLinks to which you are connected.
• sys: Solution Builder settings, installed links, tokens and other system resources
• upstream: Data exposed by other DSA brokers that have connected to your broker,
• users: Local user accounts maintained by Solution Builder (not operating system log-ins).

Edit mode and Preview mode

In Edit mode, you create and modify your application. In Preview mode, you can test application logic and behaviors. To view a full-screen preview, which displays your application as users will see it, right-click Preview and choose Open Viewer Link. To switch modes, click Edit or Preview at the top right corner of the stage.

Ease-of-Use Features

Keyboard shortcuts for menu items are displayed on menus. Keyboard items for buttons and UI widgets are displayed when you mouse over them.

For ease of use, Solution Builder includes several unique features:

Set a numeric value using a slider

To set a numeric property, hover over the field and, when the cursor changes to a double-headed arrow, depress the mouse button and move the mouse up and down to adjust the value. This feature is very handy for visually adjusting the size of a selected object.

Bind using drag and drop

When you bind a property from another property, the value of the target property comes from (or is calculated from) the source property and changes whenever the source changes. If a property can be bound, Solution Builder displays a blue dot when you mouse over it. To bind the property, click the blue dot and drag it to its target.

Work behind undocked panels

To work on objects that are hidden by undocked panes, hold down the H key.

Favorites

Favorites enable you to save and access your favorite property configurations for the Fill and Stroke, Effects, Text, and Image property groups. To open a Favorites pop-up, click the Favorites icon in the Property Inspector.

To save a component's properties as a favorite, select the component and then click Add. A thumbnail displaying the settings is added to the properties group.

To apply a favorite setting to a component, select the component, then double-click the thumbnail.

Reset a property

To quickly reset the value of a property, hover over the property until a blue dot appears, then click the dot and choose Reset.

Quick Preview

To switch temporarily from Edit to Preview mode, hold down the P key. When you release the P key, you return to Edit mode.

View defaults for a component by mouse-over in left sidebar

TBD

Click Preview twice to see all panels open in Design mode

TBD