CGD Definition
The custom grid display (CGD) is a type of display that allows users to design their own view. The CGD can consist of a single Cell or it can consist of multiple Layout Items and Cells and it can also contain nested CGDs, thus making it a powerful tool to customize views in HH DM.
The structure and appearance of the CGD can be configured using the CGD definition editor.
There are limitations in the conflict resolution when editing the CGD definition. Therefore, if two users are making changes at the same time, work can get overwritten for one of the users depending on the order that they press save. Therefore it is recommended that only one person is editing a definition at a time.
The CGD definition editor can be accessed from the Admin Ribbon Bar
Each CGD definition is linked to a definition. The first thing to do when creating or editing a CGD definition is to select the definition from the combobox on the ribbon bar:
A definition can have multiple CGD definitions. CGD definitions will be mostly used in Custom Views, but can also be used to customize the Run View. To customize the Run View the CGD needs to get set in the Backstage Options.
Once a custom property definition and CGD definition are selected the CGD designer view will be populated.
There are three areas on the screen:
- on the left is the designer area where the structure of the definition is actually edited
- in the center there is the properties/toolboxes area where items can be dragged from to the designer area to add to the designer, and also some areas to edit the configuration data for each element
- on the right is the preview area where an example of the current definition is shown
Unlike other parts of the software the user must click Save after making changes to the CGD to commit them to the database. This is done to make it easier to experiment without impacting other users. When Save is clicked and the changes are committed to the database the following things will happen:
- the preview will be updated
- any views that are open that use the current CGD definition will be updated with the latest changes
- the changes will be sent to the server and broadcast to all other users on the account, who will also have their open views updated with the latest changes
While experimenting with the designer it's sufficient to press the Refresh Preview button, which just refreshes the the preview without saving the changes into the database. Like this it can be avoided to update for example the setup CGD that is used in the Setups View, which other users might be working with. But in this case the users needs to remember to save the CGD once the design is done, otherwise the changes will be lost.
The values shown in the CGD in the preview area are populated based on the values in the Example Value of the definition parameters
Elements can be created primarily by dragging from the Layout Items or Cells toolbox area and dropping on to the designer area:
Elements can only be added to valid parents. The cursor gives feedback to the user while dragging, if the dragged item and the target item are compatible.
Not compatible:
Compatible and the dragged element would be inserted between the Table Control above and the Grid Splitter below the cursor:
Elements can be reordered by dragging them to a different location in the designer.
Holding the control key while you drag an existing element will create a copy of the element in the new location rather than moving the original element
The elements within the CGD are distinguished in two groups:
- Layout Items: A layout item doesn't display or visualize data itself, its only purpose is to arrange Cells within itself. Layout Items can be nested to create multiple layers. A layout item always needs to have one or more children. Some layout items support only one child and some support multiple children.
- Cells: A cell is the control that is used to display data and depending on the cell type, also to edit the data. Depending on the data type that should be displayed there are numerous cells available.
Layout Items
Many layout items require setting one or more paths. Those paths will be explained more in detail in the respective section, but there is also a common section about Expression Binding.
Grid Layout Item
A grid layout supports multiple children. The children are arranged through columns and rows in a tabular way. When using a grid layout the amount of columns and rows needs to get set through the respective buttons. Additionally every child element needs to get assigned to a column and a row through the Grid Properties settings. See also Grid Unit Type.
When using Auto or Pixel as Grid Unit Type the user needs to ensure that the grid layout is large enough to display all the child elements. Maybe it requires wrapping the grid layout item into a Scroll Viewer.
- Edit Columns: Opens a popup window that allows the user to define the amount and width of columns.
- Edit Rows: Opens a popup window that allows the user to define the amount and height of rows.
Scroll Viewer
A scroll viewer supports only one child. Depending on the size of the child and the following settings, a scroll viewer displays a horizontal and/or vertical scrollbar around the child control.
- Horizontal Scroll Bar Visibility: Controls the visibility of the horizontal scrollbar. For further info see Scroll Bar Visibility.
- Vertical Scroll Bar Visibility: Controls the visibility of the vertical scrollbar. For further info see Scroll Bar Visibility.
Stack Layout Item
A stack layout supports multiple children. It arranges its children according to the Orientation. A stack layout items is often a child of a Scroll Viewer. If the size of the children exceeds to the size of the stack layout item, parts of the children are not visible, that is why the combination of a Scroll Viewer and a stack layout item is common.
- Orientation: For further info see Orientation.
Tab Control
A tab control supports multiple children of type Tab Item. It represents a control that contains one or multiple items that share the same space on the screen.
Tab Item
A tab item supports one child. It must be the child of a Tab Control and it represents a selectable item inside a Tab Control.
Cells
In many cells it's required to define one or more paths. For some of those paths it's required to access the underlying flat model. To do that the path needs to start with [FlatModel].
Example:
In the following example a Basic Combobox is defined in a CGD linked to the RunSheet definition. The goal of the example is to display a dropdown of all drivers of a certain car in an event and store that information in the property called Driver of the RunSheetFlatModel:
Parameter | Value |
---|---|
Items Source Binding Path | ContextSelection.SelectedEventCarEntryListModel.DriversInCar |
Selected Value Binding Path | [FlatModel].Driver |
Input Cells
Basic Combobox
Allows a user to select an option from a list that can be defined by the settings below.
Favourites:
- Items Source Binding Path - Source of the list that is displayed in the combobox. (Example: [FlatModel].ContextSelection.SelectedEvent.Sessions)
- Selected Value Binding Path - Path to the selected value in the bound data source.
- Display Member - Gets or sets a field name in the bound data source whose values are displayed by the editor.
- Value Member - Gets or sets a field name in the bound data source, whose values are assigned to item values.
Others:
- Is Text Editable - Determines if the text in the combobox can be edited by the user.
- Name For Permissions - Specifies the name used for the permissions.
- Null Text - Text displayed when no item is selected/no text is entered.
- Control Properties
- Framework Element Properties
Basic Textbox
An editable text control that can be defined completely free.
Favourites:
- Text Binding Path - Path to the text value in the bound data source.
Others:
- Accepts Return - Gets or sets a value that indicates how the text editing control responds when the user presses the ENTER key. If true, pressing the ENTER key inserts a new line at the current cursor position; otherwise, the ENTER key is ignored.
- Name For Permissions - Specifies the name used for the permissions.
- Null Text - Text displayed when no item is selected/no text is entered.
- Output Format Options - Defines the format in which the text is displayed. For further info see Format Options.
- Text Wrapping - Determines how text is wrapped in the textbox. For further info see Text Wrapping.
- Vertical Scroll Bar Visibility - Controls the visibility of the vertical scrollbar. It only applies with Text Wrapping enabled. For further info see Scroll Bar Visibility.
- Control Properties
- Framework Element Properties
Conditional Calculated Textbox
Binds to a property defined in a plugin's flat model (Linked Calculated Parameter) and a double property (Linked Manual Entry Parameter) . If the Manual Entry Parameter has a null value, the Calculated Parameter is shown.
Favourites:
- Linked Calculated Parameter - The calculated parameter to bind to, which is usually defined in a flat model through the plugin.
- Linked Manual Entry Parameter - The manual entry Parameter to bind to, which is stored in the database. Only Parameters of type double are allowed.
Others:
- Name For Permissions - Specifies the name used for the permissions.
- Null Text - Text displayed when no item is selected/no text is entered.
- Output Format Options - Defines the format in which the text is displayed. For further info see Format Options.
- Text Wrapping - Determines how text is wrapped in the textbox. For further info see Text Wrapping.
- Vertical Scroll Bar Visibility - Controls the visibility of the vertical scrollbar. It only applies with Text Wrapping enabled. For further info see Scroll Bar Visibility.
- Control Properties
- Framework Element Properties
Conditional Math Parameter Textbox
Binds to a math parameter (Linked Math Parameter) and a double custom property (Linked Manual Entry Parameter). If the Linked Manual Entry Parameter has a null value, the Linked Math Parameter is shown.
Favourites:
- Linked Manual Entry Parameter - The manual entry Parameter to bind to, which is stored in the database. Only Parameters of type double are allowed.
- Linked Math Parameter - The Math Parameter to bind to.
Others:
- Name For Permissions - Specifies the name used for the permissions.
- Null Text - Text displayed when no item is selected/no text is entered.
- Output Format Options - Defines the format in which the text is displayed. For further info see Format Options.
- Text Wrapping - Determines how text is wrapped in the textbox. For further info see Text Wrapping.
- Vertical Scroll Bar Visibility - Controls the visibility of the vertical scrollbar. It only applies with Text Wrapping enabled. For further info see Scroll Bar Visibility.
- Control Properties
- Framework Element Properties
Enum Combobox
Allows a user to select an option from a predefined list of static values that can be defined by the settings below.
Favourites:
- Selected Value Binding Path - Path to the selected value in the bound data source.
- Enum Name - Name of the Enum that the combobox should use as source for the dropdown.
Others:
- Is Text Editable - Determines if the text in the combobox can be edited by the user.
- Name For Permissions - Specifies the name used for the permissions.
- Null Text - Text displayed when no item is selected/no text is entered.
- Control Properties
- Framework Element Properties
Flat Model Textbox
An editable text control that is used to edit values on the underlying flat model.
Favourites:
- Text Binding Path - Path to the text value in the bound data source.
Others:
- Accepts Return - Gets or sets a value that indicates how the text editing control responds when the user presses the ENTER key. If true, pressing the ENTER key inserts a new line at the current cursor position; otherwise, the ENTER key is ignored.
- Name For Permissions - Specifies the name used for the permissions.
- Null Text - Text displayed when no item is selected/no text is entered.
- Output Format Options - Defines the format in which the text is displayed. For further info see Format Options.
- Text Wrapping - Determines how text is wrapped in the textbox. For further info see Text Wrapping.
- Vertical Scroll Bar Visibility - Controls the visibility of the vertical scrollbar. It only applies with Text Wrapping enabled. For further info see Scroll Bar Visibility.
- Control Properties
- Framework Element Properties
Parameter Checkbox
Checkbox that binds to a boolean custom property.
Favourites:
- Linked Parameter - The Parameter to bind to. Depending on the control type only Parameters of certain types are allowed.
Others:
- False Text - Text that is displayed if the parameter evaluates to false.
- Is Inverted - Determines if the checkbox value is inverted.
- Name For Permissions - Specifies the name used for the permissions.
- True Text - Text that is displayed if the parameter evaluates to true.
- Control Properties
- Framework Element Properties
Parameter Date Picker
Date picker that binds to a DateTime custom property.
Favourites:
- Linked Parameter - The Parameter to bind to. Depending on the control type only Parameters of certain types are allowed.
Others:
- Allow Null Input - Gets or sets whether users can set the editor’s value to a null reference by pressing the CTRL+DEL key combinations.
- Mask - Defines the input mask for the date picker. For further info see standard format strings and custom format strings
- Mask Use As Display Format - Determines if the mask is used as the display format. Usually when defining a mask, this setting should be set to true.
- Name For Permissions - Specifies the name used for the permissions.
- Show Editor Buttons - Determines if there is a button shown to the right of the editor to open a popup editor or not.
- Control Properties
- Framework Element Properties
Parameter Radio Button
Radio button that binds to a double custom property. Values start on the left from zero to # Radio Buttons - 1 on the right.
Favourites:
- Linked Parameter - The Parameter to bind to. Depending on the control type only Parameters of certain types are allowed.
Others:
- Amount Of Radio Buttons - An integer number, that defines the amount of radio buttons. The value must be larger than 0.
- Gradient End Color - The end color of the gradient used in the radio button.
- Gradient Start Color - The start color of the gradient used in the radio button.
- Control Properties
- Framework Element Properties
Parameter Textbox
Binds to a double or string custom property.
Favourites:
- Linked Parameter - The Parameter to bind to. Depending on the control type only Parameters of certain types are allowed.
Others:
- Accepts Return - Gets or sets a value that indicates how the text editing control responds when the user presses the ENTER key. If true, pressing the ENTER key inserts a new line at the current cursor position; otherwise, the ENTER key is ignored.
- Name For Permissions - Specifies the name used for the permissions.
- Null Text - Text displayed when no item is selected/no text is entered.
- Output Format Options - Defines the format in which the text is displayed. For further info see Format Options.
- Text Wrapping - Determines how text is wrapped in the textbox. For further info see Text Wrapping.
- Vertical Scroll Bar Visibility - Controls the visibility of the vertical scrollbar. It only applies with Text Wrapping enabled. For further info see Scroll Bar Visibility.
- Control Properties
- Framework Element Properties
Text Area Control
A combination of a static label, which serves as header, and an editable textbox.
Favourites:
- Text Binding Path - Path to the text value in the bound data source.
- Title - The title of the control, which is shown on top of the actual control.
Others:
- Accepts Return - Gets or sets a value that indicates how the text editing control responds when the user presses the ENTER key. If true, pressing the ENTER key inserts a new line at the current cursor position; otherwise, the ENTER key is ignored.
- Is Title Visible - Determines if the title is visible.
- Name For Permissions - Specifies the name used for the permissions.
- Output Format Options - Defines the format in which the text is displayed. For further info see Format Options.
- Text Wrapping - Determines how text is wrapped in the textbox. For further info see Text Wrapping.
- Vertical Scroll Bar Visibility - Controls the visibility of the vertical scrollbar. It only applies with Text Wrapping enabled. For further info see Scroll Bar Visibility.
- Control Properties
- Framework Element Properties
Display Cells
Basic Label
Displays a static text.
Favourites:
- Text - The text to be displayed.
- Is Title Format - Determines if the text is formatted as a title.
- String Format - Defines the format of the displayed text. For further info see Formatting Types.
- Text Binding Path - Path to the text value in the bound data source.
- Icon Name - Name of the icon displayed to the left of the text.
Others:
- Text Alignment - Alignment of the text within the label. For further info see Text Alignment.
- Text Wrapping - Determines how text is wrapped in the textbox. For further info see Text Wrapping.
- Control Properties
- Framework Element Properties
CGD Control
A CGD control is a nested CGD within a CGD. Nested CGDs allow to create smaller parts of a big CGD in their own controls to keep the tree in the editor smaller and to be able to reuse parts of a CGD within another CGD.
Favourites:
- Referenced CGD - The linked CGD Definition that is used to display a CGD in the CGD.
Others:
- Data Context Path - Path to the data context. Usually not needed.
- Max Height - Maximum height of the control. If specified, the value must be positive.
- Max Width - Maximum width of the control. If specified, the value must be positive.
- Control Properties
- Framework Element Properties
CID Control
A CID that is shown within the CGD.
Favourites:
- Referenced CID - The linked CID Definition that is used to display a CID in the CGD.
Others:
- Alias - For internal use only.
- Data Context Path - Path to the data context. Usually not needed.
- Max Height - Maximum height of the control. If specified, the value must be positive.
- Max Width - Maximum width of the control. If specified, the value must be positive.
- Single Column Width - If enabled, the control will calculate its width as sum of:
Row Width + Label Width + Horizontal Spacing
to just display one CID item. - Control Properties
- Framework Element Properties
CID Options:
- Collection Name - Sets the name of the Collection Parameter that serves as items source.
- Control Definition Name Path - Path to the property that is shown in the CID control. Usually this is Name or Strings.Name and in any case it should be a property that can be used to identify a flat model.
- Hide CID Add - Hides the Add Item button in the ribbon to add an item to the data source.
- Hide CID Copy To End - Hides the Copy To End button in the CID control to duplicate the current item and insert it as last element in the data source.
- Hide CID Copy To Next - Hides the Copy To Next button in the CID control to duplicate the current item and insert it next to the current element in the data source.
- Hide CID Delete - Hides the Delete Item button in the CID control to delete the current item from the data source.
- Hide CID Move Left - Hides the Move Item Left button in the CID control to move the current item to the left in the data source.
- Hide CID Move Right - Hides the Move Item Right button in the CID control to move the current item to the right in the data source.
- Hide CID Name - Hides the CID item name in the CID control. See also Control Definition Name Path.
- Items Source Binding Path - Source of the list that is displayed in the combobox. (Example: [FlatModel].ContextSelection.SelectedEvent.Sessions)
- Flat Model/Cache Path - Path to the parent flat model or cache. If the data source is a collection model the path to the flat model that owns the collection needs to get defined. Otherwise the path to the parent cache needs to get defined.
CID View Options:
- Default View - The CID View that gets selected initially.
- Hide CID Freeze Control - Hides the Frozen checkbox in the CID.
- Hide CID Search Control - Hides the search in the CID.
- Hide CID Selection Control - Hides the CID View selection dropdown in the CID.
Grid Splitter
A grid splitter can be used as direct child in a Grid Layout Item. Depending on the orientation of the grid splitter, the user can manipulate the width of the column or the height of the row with the mouse.
Favourites:
- Orientation - The orientation of the grid splitter.
Image Control
A control that displays an image. It can be used to display attached files or icons/images that are built into the software or defined by the plugin.
Favourites:
- Source Binding Path - Path to the image source in the bound data source.
- Icon Name - Name of the icon displayed to the left of the text.
Others:
- Max Height - Maximum height of the control. If specified, the value must be positive.
- Max Width - Maximum width of the control. If specified, the value must be positive.
- Min Height - Minimum height of the image. If specified the value must be positive.
- Min Width - Minimum width of the image. If specified the value must be positive.
- Stretch - Determines how the image is stretched to fill the control. For further info see Stretch.
- Framework Element Properties
Math Parameter Display
Displays the value of a math parameter.
Favourites:
- Linked Math Parameter - The Math Parameter to bind to.
Others:
- Accepts Return - Gets or sets a value that indicates how the text editing control responds when the user presses the ENTER key. If true, pressing the ENTER key inserts a new line at the current cursor position; otherwise, the ENTER key is ignored.
- Name For Permissions - Specifies the name used for the permissions.
- Null Text - Text displayed when no item is selected/no text is entered.
- Output Format Options - Defines the format in which the text is displayed. For further info see Format Options.
- Text Wrapping - Determines how text is wrapped in the textbox. For further info see Text Wrapping.
- Vertical Scroll Bar Visibility - Controls the visibility of the vertical scrollbar. It only applies with Text Wrapping enabled. For further info see Scroll Bar Visibility.
- Control Properties
- Framework Element Properties
Primitive Control
A primitive control reference is used to display predefined controls, that can't be created by using a CGD. The Referenced Primitive dropdown shows the available primitive controls.
Favourites:
- Referenced Primitive - The linked primitive control that is display in the CGD.
- Data Context Path - Path to the data context.
Others:
- Max Height - Maximum height of the control. If specified, the value must be positive.
- Max Width - Maximum width of the control. If specified, the value must be positive.
- Control Properties
- Framework Element Properties
Table Control
A control that displays data (usually parameters of flat models) in a data table.
Favourites:
- Data Context Path - Path to the data context. Usually not needed.
- Custom Column Profile - The Custom Column Profile that is used to visualize the data.
- Collection Name - Sets the name of the Collection Parameter that serves as items source.
- Flat Model/Cache Path - Path to the parent flat model or cache. If the data source is a collection model the path to the flat model that owns the collection needs to get defined. Otherwise the path to the parent cache needs to get defined.
- Selected Value Binding Path - Path to the selected value in the bound data source.
Others:
- Alias - For internal use only.
- Columns Source Binding Path - Defines the path to the columns source. For internal use only.
- Enable Lap Grid Style - Affects the style of the column headers in the Table Control.
- Is Title Visible - Determines if the title is visible.
- Selected Values Binding Path - Path to the selected values in the bound data source. For internal use only.
- Title - The title of the control, which is shown on top of the actual control.
- Framework Element Properties
Table Options:
- Hide Add - Hides the Add Item button in the ribbon to add an item to the data source.
- Hide Copy to End - Hides the Copy To End button in the ribbon to duplicate the current item and insert it as last element in the data source.
- Hide Copy to Next - Hides the Copy To Next button in the ribbon to duplicate the current item and insert it next to the current element in the data source.
- Hide Delete - Hides the Delete Item button in the ribbon to delete the current item from the data source.
- Hide Move Down - Hides the Move Item Down button in the ribbon to move the current item one position down in the data source.
- Hide Move Up - Hides the Move Item Up button in the ribbon to move the current item one position up in the data source.
Button Cells
Flat Model Button
Button that binds to a command on the flat model (usually defined in a plugin).
Favourites:
- Command Name - Name of the command that is called when the button is clicked.
- Content - The text that is display within the button.
Others:
- Name For Permissions - Specifies the name used for the permissions.
- Right Click Command Name - Name of the command that called when the button is right-clicked.
- Control Properties
- Framework Element Properties
View Model Button
Button that binds to a command in the view model. This is currently only supported in the run sheet view or in plugins
Favourites:
- Command Name - Name of the command that is called when the button is clicked.
- Content - The text that is display within the button.
Others:
- Name For Permissions - Specifies the name used for the permissions.
- Right Click Command Name - Name of the command that called when the button is right-clicked.
- Control Properties
- Framework Element Properties
Attached File Cells
Attached Files Control
A control to display attached files in a data table.
Favourites:
- Attached Files Grouping Name - Sets the name of the Attached File Parameter. If the name is not set all attached files will be shown, otherwise only the attached file that belong to that parameter.
- Auto Download - Defines if an added attached file will be automatically downloaded by all users.
- Flat Model Path - Path to the flat model. This is only needed of the attached file that should be displayed is not defined in the displayed flat model.
Others:
Single Attached File Display
Displays a file that is attached to the underlying flat model.
Favourites:
- Linked Attached File Name - The Attached File Parameter to bind to. Only Attached File Parameters that have the setting Allow Multiple Files disabled are allowed.
- Flat Model Path - Path to the flat model. This is only needed of the attached file that should be displayed is not defined in the displayed flat model.
- Auto Download - Defines if an added attached file will be automatically downloaded by all users.
Others: