UI Layout Element - UI Template
Related subfolder of the training project: "Training/UIM/Exercise/Layout"
Chapter Overview
In this training chapter you get familiar with the UI template layout element.
Remark: A UI template is nestable and reusable. It can be used either to create a UI page from template or to insert the UI template into a span.
The following UI page contains the UI template "TMPL_ButtonCancelOK"
Exercise
In this exercise you will get familiar with the configuration posibilities of the UI template layout element by implementing a UI page as described above.
Exercise 1: Create UI Page "UiTemplate"
-
Step 1: Open context menu of folder "Automation/User Interface/Training/Exercise/Layout" in the model tree
-
Step 2: Select menu function "Create Model" to open dialog "Create User Interface Model"
-
Step 3: Enter model name "UiTemplate" and keep option "Model Type: UI Page"
-
Step 4: Select option "From: UI Page" to open dialog "Select UI Page", open folder "…/Training/UIM/Template/Layout" to select UI page "TMPL_UiTemplate" with double click then keep default option for "Default Device" and click button "OK" to create the UI page
Exercise 2: Add UI template "TMPL_CancelOk" to the UI page
-
Step 1: Drag&Drop a UI template into the second span of the sixth row and select template "TMPL_ButtonOkCancel"
-
Step 2: Select button "Cancel" and move it one span to the leftRemark: You can always modify a UI Template
Exercise 3: Move UI Template
-
Step 1: Click at the UI Template and move it to the left span
