You want to make your HMI multilingual and display units in metric and imperial system? No problem at all in WebIQ Designer. Luckily, we have created a localization demo that shows how to handle localizations and unit-classes.
What does the localization demo contain?
This demo includes two overview pages. On the first one you can see alarms and their information texts. On the second dashboard you can see a few widgets with values. At the top of the header there is a button that opens a pop-up. In this pop-up are two flags, which can be used to change the language and units.
How does localization work?
Localizations can be created via the Localization Manager. Any number of languages can be localized in this manager. Localization variables are composed of a variable and the localization text of the selected language. Now you can click on the button with the three dots in the widget configuration to search and select your localization.
Another way to create localizations is to enter them directly in the configuration of the specific widget. To do this, the variable is entered directly into the text input field using the localization syntax ${variable}. Afterwards, the localization variable can be edited directly by clicking on the button with the pen.
In addition to localization, you can also enter normal text in the configuration of the specific widget. This helps, for example, when numbering stations or heating zones.
Languages are bound to the user. You can set the specific language per user in the User Manager. Languages that you want to switch in the HMI can be switched via the UI action setlocale.
How do unit-classes work?
Unit-classes allow to use different units for the same process variable and to easily switch between these units using widgets. A typical example would be using different units such as °C and °F.
The unit-classes configuration is defined via a JSON object, which is stored in the unit-classes.json file and looks like this:
When you have finished the configuration, you can use the UI action unit-class-adapter to change the unit. You can find more detailed instructions by clicking the link.
Get started right away!
Visit us on our Live Demo page and have a look at our localization demo. Download the project and copy the unit-classes.json into your own HMI project. Also visit our documentation page and read through how to work with localizations and unit-classes.
If you haven’t downloaded WebIQ yet, just click below to register and download the free trial version of WebIQ.
