Calling Dialogs in a Visualization

You can configure a user input for a visualization to open a visualization as a dialog. For example, a user clicks a button that opens a dialog and prompts the input of values. A dialog is used for obtaining user input and (if modal) it can block inputs outside of the dialog.

Only visualizations of visualization type Dialog can be opened as a dialog. You configure the visualization type in the Properties dialog of a visualization object.

1. Configure a user input for the main visualization with the OpenDialog action for the dialog.

   ⇒

   The dialog opening is configured.

2. Configure a user input for an element of the dialog with the CloseDialog action.

   Tip: For non-modal dialogs, you can configure the user input for closing outside the dialog as well.

   ⇒

   Closing the dialog is configured.

Note

Instead of creating your own dialogs, you can use dialogs from libraries. For example, when the VisuDialogs library is integrated in the project, you can use the included dialogs VisuDialogs.Login or VisuDialogs.FileOpenSave.

See also

• Configuring User Inputs
• Dialog ‘Input Configuration’
• Dialog Box ‘Properties’ of Visualization Objects

Configuring visualization objects as dialogs

1. In the Devices view, select the object, open the context menu, and click the Properties command.

2. Click the Visualization tab.

3. Activate the Dialog option and click OK to close the dialog.

   ⇒

   The visualization has the visualization type Dialog and can be called as such.

Configuring dialog calls

For dialog calls, a user usually clicks a button that opens a dialog and prompts the input.

In the following example, a dialog is displayed as a calendar and allows for the input of a date.

1. Set the visualization type from dlgCalender to dialog.

2. Drag a rectangle to the visualization visMain.

3. Configure the property Texts ‣ Text with the text Due date: %t[yyyy-MM-dd].

   Configure the property Text variables ‣ Text variable with PLC_PRG.dateDue.

4. Drag a button to the visualization.

5. Configure the property Texts ‣ Text with the text Open dialog.

   Configure the property Input configuration ‣ OnMouseClick for the action Open dialog with dlgCalender.

   ⇒

   The user input for opening the dialog is configured.

6. Double-click the dlgCalender dialog.

7. Drag a Date picker element to the visualization editor.

8. Configure the property Texts ‣ Text with Due date: %t[yyyy-MM-dd].

   Configure the property Variable with PLC_PRG.dateCalender.

   ⇒

   The element is configured.

9. Drag a button to the visualization editor.

10. Configure the property Texts ‣ Text with OK.

11. Configure the property Input configuration ‣ OnMouseClick for the action Close dialog with dlgCalender, Result: OK.

12. Configure another property Input configuration ‣ OnMouseClick for the action Execute ST code with PLC_PRG.dateDue := PLC_PRG.dateCalendar;.

    ⇒

    The user input for closing the dialog is configured.

13. Drag another button to the visualization editor.

14. Configure the property Texts ‣ Text with Cancel.

15. Configure the property Input configuration ‣ OnMouseClick for the action Close dialog with dlgCalender, Result: Cancel.

16. ⇒

    The user input for canceling the dialog is configured.

17. Compile, download, and start the application.

    ⇒

    

Variable declaration:

PROGRAM PLC_PRG
VAR
\ dateDue : DATE := DATE#2000-01-01;
\ dateCalendar : DATE;
END_VAR

Implementing application access to dialog

You can open a dialog by means of application code or from the application. For simple access, use the interface from the VisuUtils library. When you open VisuUtils in the library manager, you can scan the library by its contents and access the library documentation.

Note

In CODESYS V3.5 SP10 and earlier, you could implement programmatic access to dialogs only by means of the functionality of the internal dialog manager. In V3.5 SP11 and later, you have the VisuUtils library.

See also

• Methods of the Dialog Manager