Skip to main content

Using a Visualization as an Element

When you define a frame interface for a visualization and then reference the visualization, this construct behaves like a visualization element:

  • When creating the frame interface on the Frame Configuration tab, you can define which properties will be public. You can define the interface yourself.

  • You can categorize the properties and structure them hierarchically to provide for a clear overview.

  • When the referenced frame is selected in the visualization editor, exactly those properties are displayed in the Properties view which have been defined in the frame interface (Open Frame Configuration). When you assign values there, you will get help as usual from the editors provided in the view. The handling is the same.

  • If the Forward inputs standard property has been added to the frame interface, then specific user inputs will be forwarded to the referenced visualization. These mouse events are OnMouseDown and OnMouseUp.

  • The visualization can be reused as often as you want by referencing it using a frame in a superordinate visualization.

Configuring a frame interface

The visualization in the POUs view should represent a special measurement control named Gauge. This visualization should be reusable. When it is reused, only a few selected properties need to be configured. That is why the visualization gets a frame interface.

  1. Double-click the Gauge visualization object.

    Gauge is displayed in the visualization editor. The Frame Configuration tab is displayed in the top part. The properties for the frame interface are defined there.

  2. Focus on the frame configuration and click the Add node command.

  3. The new node has the default name Property and has to be configured now.

    1. Double-click the new property in the first column and specify a suitable name, such as Max.

    2. Double-click the new property in the Editor Type column and select Variable.

    3. Double-click the new property in the Variable Type column and select INT.

    4. Double-click the new property in the Default Value column and select 250.

    5. Double-click the new property in the Variable column and select iIn.

      The property is linked to the interface variable iIn.

    The new node is configured.

  4. Add a new VisGauge visualization below your application.

  5. Drag a Frame element to this visualization.

    The Frame Configuration dialog opens.

  6. Add the Gauge visualization to the Selected visualizations.

    Gauge is displayed in the superordinate VisGauge visualization. In the Properties view, the properties are displayed as defined on the Frame Configuration tab.

    Figure 3. VisGauge visualization used as an element
    VisGauge visualization used as an element


Configuring descriptions

Managing texts in text lists helps you to localize them and keep track of them.

To support the application developer, descriptive texts for the interface can be configured both for the entire visualization and for each interface property. The texts are automatically managed in text lists.

In the frame configuration, you can assign the IDs of the text lists in the Description ID column. Alternatively, you could also enter a text directly in the Default Value column. The requirement for this is that the field in the Description ID column is empty. As a result, localization is not possible.

The descriptions are displayed when the application developer selects the referencing frame element in a superordinate visualization. Then, depending on the selected property, the corresponding text appears in the comment window in the Properties view.

Procedure. Configuring descriptions for the Gauge visualization and its properties

  1. In the POUs view, add a text list named PropertyNames.

  2. Configure an ID for each property which should output a comment:

    1. Click in the blank line of the text list. Open the line editor under the ID column and enter an ID.

    2. Configure a default value for the new ID and localize this value for each language.

    The text list is prepared. The texts are referenceable.

    Example: Text list with descriptions for the interface

    visu_img_gauge_propertynames.png

    The text with the ID Element_Desc is the element description of the Gauge visualization. The intended use or function is usually specified here.

  3. Switch to the visualization where the texts should be referenced. Make sure that the top part is visible and click the Frame Configuration tab.

    The Gauge visualization with the frame configuration above is active.

  4. In the toolbar, click the _visu_icon_add_frame_description.png command icon.

    Tip

    If the command is not available, then this is because an element description already exists in the frame configuration. Note that only one description is allowed per frame configuration.

    The Element description entry is inserted at the top position.

  5. Configure the entry:

    1. In the row, click the field in the Description ID column.

      The line editor opens and brings the _visu_icon_reveal.png button to the Input Assistant.

    2. Open the Input Assistant.

    3. Select the PropertyNames text list there and then select the ID Element_Desc. Click OK to close the Input Assistant.

    4. Press the Enter key to confirm your selection.

      The description ID is assigned a text list ID. The selected text is automatically displayed below Default Value. This field is no longer editable.

    The interface now has an element description.

  6. In the frame configuration, assign a description ID for each property in the Description ID column. Continue as described in the Step 3 step.

    Each interface property now has a description.

  7. Reference Gauge in another, superordinate visualization.

    1. Switch to the Visualization Toolbox view.

    2. Click the Current Project button.

    3. Drag the Gauge visualization to the visualization editor.

      In the Properties view, the interface properties are displayed as configured.

    4. Select the element properties one after the other.

      The respective texts are displayed in the comment below it. In the case of the Type of element property, for example, the element description is displayed.

    Figure 4. Referenced Gauge visualization in VisMain
    Referenced Gauge visualization in VisMain


In this section: