Structure of a Freedom UI page
A Freedom UI page is an app element that lets you display Freedom UI elements connected to data sources and positioned arbitrarily. A Freedom UI page schema of the Client module type controls each Freedom UI page. Learn more: Freedom UI page schema. For example:
- The
StudioHomePage
schema of theCrtUIv2
package configures the Studio home page. - The
BaseTemplate
schema of theCrtUIv2
package implements the features of the base Freedom UI page.
All form page schemas must inherit from BaseTemplate
or its descendants. Freedom UI page examples:
- A page that has left area (the
PageWithLeftAreaTemplate
schema of theCrtUIv2
package). - A page that has a list (the
BaseGridSectionTemplate
schema of theCrtUIv2
package).
Depending on the current app template, an app can contain a list page and a form page that contain a minimum set of elements. Customize the Freedom UI page further in the Freedom UI Designer using no-code tools. Learn more: Overview of Freedom UI Designer and its elements, Element setup examples (user documentation).
The Freedom UI page elements of the app are placed in the corresponding containers. Configure the containers using the base Freedom UI page schema or the replacing Freedom UI page schema. Containers operate similarly regardless of the page type.
Creatio uses HTML container meta names. It generates actual IDs that match the HTML elements of the form page based on the meta names.
View the main containers of the Freedom UI page in the figure below.
Container | Description |
---|---|
MainHeader | Includes the |
TitleContainer | Includes the page title. |
ActionButtonsContainer | Includes the page actions, such as add record, open page, import data, etc. |
MainContainer | Includes the |
MainFilterContainer | Includes the |
LeftFilterContainer | Includes the menu of the Folders page element. |
RightFilterContainer | Includes the filter of page content. |
SectionContentWrapper | Includes the page content. |
See also
Configuration elements of the Client module type
Overview of Freedom UI Designer and its elements (user documentation)
Element setup examples (user documentation)
Set up the app UI (user documentation)