Editor ‘Visualization Style Editor’

Symbol: 44049352216419ddc0a8640e002f729f_af6dabc508d74cfcc0a8640e013441b2

Function: The editor is used for creating, deriving, editing, and localizing visualization styles. In addition, it makes it possible to check and install a style or a hierarchy of styles.

Call:

  • In CODESYS:

    In the Visualization manager object (tab Settings, group Style settings, click 44049352216419ddc0a8640e002f729f_26125234524e3e9fc0a8640e01541f2d for a drop-down list). Click Open style editor.

  • Start menu > CODESYS installation folder > ‘CODESYS’ > ‘Visualization Style Editor’

Menu ‘File’

44049352216419ddc0a8640e002f729f_4183d7b20d66a9d5c0a8640e012c119e New style The Create a new visualization style dialog box opens.
44049352216419ddc0a8640e002f729f_f1d8f2f0f3b33c00c0a8640e01798296 Open

The Open dialog dialog box opens.

This dialog prompts you to select a style file (format .visustyle.xml) to be opened and edited.

44049352216419ddc0a8640e002f729f_23fd884c0ddbcb18c0a8640e0031afd6 Open as copy

The Open existing style as dialog dialog box opens.

This dialog prompts you to select a style that is copied, saved to the target location, and opened for editing.

Close Closes the style open in the editor.
44049352216419ddc0a8640e002f729f_a2f19fd30d67a270c0a8640e0138826e Save Saves the changes of the open style.
Save As

The Select visualization style(s) dialog box opens.

This dialog prompts you to select a file to save the current settings.

44049352216419ddc0a8640e002f729f_8bfb21300d681ac9c0a8640e01784a9c Save and Install Saves the open visualization style and installs it to the visualization style repository.
Recently opened files Lists the files for selection that were last opened.
Abort Closes the visualization style editor.

See also

Menu ‘Styles’

The commands affect the contents of the Style properties tab.

44049352216419ddc0a8640e002f729f_621df0320d532319c0a8640e017f2427 New entry (as child) Creates another style entry as a child of the selected style property.
44049352216419ddc0a8640e002f729f_54d7837e0d553794c0a8640e00d45c08 New entry (afterwards) Creates a new style entry in the list after the selected style property.
44049352216419ddc0a8640e002f729f_6a565acf0d6299f8c0a8640e008e383b Move down

Moves the selected style entry down.

Requirement: Sort order is flat.

44049352216419ddc0a8640e002f729f_827c04a80d632b9fc0a8640e01fa4972 Move up

Moves the selected style entry up.

Requirement: Sort order is flat.

44049352216419ddc0a8640e002f729f_e4be3e090d606996c0a8640e00ed8c6c Sort order

Toggles between three sort orders:

  • Flat structure and alphabetical order

  • Flat structure and order according to the position of the entry in the XML style file

    This position also determines the position of the property in CODESYS. The property appears, for example, in the Properties view below the Values column in the drop-down list for style properties.

  • Hierarchical structure of entries

    Requirement: The names of the style properties contain at least one dash.

44049352216419ddc0a8640e002f729f_1970a3570d63b5cbc0a8640e015225f5 Check The settings of the style properties are checked for consistency errors. This check is also performed when saving the style.

Menu ‘Localization’

The commands affect the contents of the Localization tab.

44049352216419ddc0a8640e002f729f_4c8e49a30d647d02c0a8640e0031bc67 Add language The dialog box Add new language opens. The dialog prompts you to specify data for creating a new language column.
44049352216419ddc0a8640e002f729f_f7b45e990e1340a1c0a8640e0060d142 Remove selected language Removes the columns of the selected cell.
Rename selected language The Rename language dialog box opens. The dialog is used for renaming the column that defines the selected cell and removes all previous translations.
Dialog box Add new language
Name

Name of the new language as a language code according to ISO 639-1.

Examples: de, en, es, it, fr, ja

Copy from existing

All existing language columns are available for selection. The selected language is copied with all entered translations.

<do not copy text>: The new language receives a blank translation column.

Tab ‘General’

This tab contains the general metadata of the open style file and allows it to be edited.

Identification
Company

Example: Xy-z GmbH

Tip: In the installed styles, CODESYS can filter by the company names specified here.

Name Example: Style_A
Version

User-defined version number

Example: 1.1.1.1

General settings
Base style

Name and version of the style that the open style is based on.

Tip: The derived style properties from the base style are highlighted in yellow in the Style properties tab.

Partial style (usable only as base for other visualization styles)

44049352216419ddc0a8640e002f729f_9a3f06830c0506c5c0a8640e012f0ace : The style is identified as incomplete. Therefore, it can be used for other styles as a base style only.

Example: Style only with color definitions that derive this to many other styles.

Note: CODESYS does not check for consistency errors of an incomplete style for itself.

44049352216419ddc0a8640e002f729f_4681610f0c058035c0a8640e0049916a : The style is identified as complete.

From The Select base style dialog box opens. This dialog prompts you to select a style file that is saved to the file system (and not does not have to be installed). The file is used as a base style.
Informational
Visualization profile The profile is intended for informational purposes. For example, you find elements that are not preconfigured with special style entries, and information from the profile. In addition, CODESYS checks in the profile whether a required style is missing.

Tab ‘Style properties’

This tab lists the names of the style properties with the associated values and makes it possible to edit it, even by means of the commands in the Styles menu.

The style properties can be defined for colors, fonts, images, and any values.

The style properties defined in a base style are derived and highlighted in yellow.

Name

Name of the style property.

If the name contains a dash, then the Visualization Style Editor can sort the style properties by the prefixed terms before the dash and display them in a hierarchy. A name can contain more than one dash.

Value Value that is assigned to the style property.
Type

Data type of the style property; selected from a drop-down list.

Note: This is possible and necessary only for specific style properties with a data type that is not implicitly defined.

Attribute hide: The associated style property is not listed in the drop-down lists in CODESYS.
Used by Visualization element that can be configured with this style property. Can be edited.
Comment Example: Special setting for bar display. Optional.
Double-click a cell. An input field opens for editing.
Del Removes the selected row.

Tab ‘Localization’

This tab makes it possible to translate the names of the style properties into other languages.

Name Lists the name of the style properties as they are defined in the Style properties tab.
<language> Identification of the language name (as language code according to ISO 639-1) in which the style property name should be translated.
Double-click a cell. An input field opens for editing.