Fields and Links
Layouts are closely related to class definitions. This section explores how application classes and its properties can be integrated into a layout for further interaction from the end user.
Last updated
Layouts are closely related to class definitions. This section explores how application classes and its properties can be integrated into a layout for further interaction from the end user.
Last updated
Based on the selected page type, the layout designer provides special controls to display object fields and links on the layout.
Fields and links are supported on pages that are bound to a class only, such as Object Page.
In order to access the list of fields and links, select your page from the layouts manager and expand the Fields or Links list in the layout elements panel on the left.
Fields and/or Links can be added to your layout by dragging the selected item and dropping it in the main designer canvas.
Each field control can be customized by selecting the control in the main designer canvas and clicking on the gear icon to access its properties.
Based on the class definition bound to the page, field controls are available for every field in the linked class. The controls can be added to your layout to display the field value for the currently selected object.
Field controls are categorized to help you find your required fields easier.
All: Displays all the fields in the class
Id: Displays standard fields that help identify the class
Main: Displays content fields that you added to the class
General properties define the basic format of your field control in your layout.
Enabling this options prevents the field value to be modified by any user.
Even users with administrator rights cannot modify a read-only field.
Defines which control should be used to display the field.
The controls available are based on the field type. More information about field types and controls can be found in Data Modelling.
Enables setting the full size of the field.
Label properties allows you to customize the appearance of your field label.
Determines whether the field label should be visible or not.
Enabling this option allows you to overwrite the field label derived from the field's name in its class definition. This option requires further configuration when activated.
Custom Label Text Determines the text that should be displayed as the field label.
Allows you to select an icon from a pre-defined list to appear alongside your field label.
Icon Display Options Allows you to manipulate the icon displayed. Options: Rotate 45°, Rotate 90°, Rotate 135°, Rotate 180°, Rotate 225°, Rotate 270°, Rotate 315°, Flip Horizontal, Flip Vertical, Spin, Pulse-Spin
Determines where the label should be place relative to the field value. Options: Top, Left.
Available only if the field is using a HtmlEditor as display control.
Html Editor Settings allows you to set the appearance and complexity of the Html toolbar for the user.
Same set of options Display Inline and Single Line Toolbar is available for usage of the Html Editor on the desktop and mobile devices (represented here with Desktop and Mobile tabs).
Display Inline enables showing of the Html Editor toolbar supplementary, just in time when user selects the area for data input.
If Display Inline is not selected, then Html Editor toolbar is shown fixed above the input area.
Within Predefined Presence two options can be chosen:
Medium
Minimal
Each of the options sets number of buttons to invisible, where Minimal disables less buttons visible in the toolbar than the Medium option.
In addition, in the section Disabled Buttons user is able to mark the buttons which shall be disabled/not shown in the HtmlEditor toolbar also manually
Available only if the field is using a HtmlEditor as display control.
Html Inline Images allows you to define a linked class that is used to retrieve and display inline images. When a inline image specification is found, then the image document of the linked class with the given Image-ID is displayed. When no document is found, then the standard missing image notification is displayed.
Independent of the Desktop or Mobile choice you can configure:
Inline Images Link: The link to a document supporting class (direct).
Inline Image Match Field: The ID field of the linked class to identify an instance with (with the Image-ID).
Available only if the field is using a TextBox as display control. Text Box Settings allows you to customize your textbox design for the field.
Determines how your field values should be formatted when displayed.
None No formatting is applied.
Integer - File Size Field value is displayed as a user-friendly file size string (e.g. 24.5MB)
Numeric - Percent Field value is displayed as a percentage.
Available only if the field is using TextArea as display control. Text Area Settings allow you to customize how your text area control should appear on the layout.
Determines the number of rows (between 1 to 6) that should be provided for the Text Area control.
Help properties allows you to customize the information displayed in the intro tour of your page. The intro tour typically goes through each item that contain help information.
Allows you to write Html code that is rendered as help text for your control.
Supports multiple languages.
Allows you to define where the help text tooltip should be displayed relative to your control.
Supported positions: Auto, Top, Left, Right, Bottom, Bottom-Left, Bottom-Middle, Bottom-Right
Allows you to define the order within the intro tour.
The tab-index refers to the order in which elements are focused on using the Tab key on your keyboard. This is an essential feature to enhance the accessibility and usability of your application by any user.
Available only if the field is using Calendar, TimePicker or DatePicker. No icons are shown when 'Show Calendar Icon' is unchecked.The picker drop down is displayed on input focus if 'Show Calendar Icon' is unchecked.
Based on the class definition bound to the page, controls are provided for every class link defined in the class designer.
Read more about class links in Data Modelling.
Similar to field controls, the appearance of link controls can be customized in their configuration settings.
