Card

The Card ViewTemplate is used to present a compact visual summary of a single dataset, styled similarly to a business card. It displays up to five EntityFields in a predefined layout. This ViewTemplate is especially suitable for use in overview or preview contexts and is commonly implemented as the "Header" component in a HeaderFooterLayout.

Layout and Display

The layout of the Card ViewTemplate is fixed and organized as follows:

• Upper side: An image EntityField defined by the iconField property.
• Lower side (vertical order):
  • A EntityField defined by titleField.
  • A EntityField defined by subtitleField.
  • A EntityField defined by descriptionField.
  • Action buttons.
  • An optional EntityField defined by informationField, which is the only field that includes a label.

Action Buttons

The Card ViewTemplate supports up to two configurable Action buttons. These can be defined via the properties favoriteAction1 and favoriteAction2. The buttons appear between the descriptionField and the optional informationField.

Usage Context

Example Implementation

An example usage is the ViewTemplate Head, which is implemented in SalesprojectPreview_view within the Salesproject Context.

Appearance in the Client

In the ADITO client, the Card ViewTemplate can be seen, e.g., in the following location:

Sales > Salesproject

To view the Card:

1. Ensure that the Preview button (eye icon) is active (highlighted with a blue frame).
2. Select a project from the table in the Filter View.

The Card ViewTemplate (Head) is shown at the top of the PreviewView. It displays the image (or a placeholder) on the upper side and the following fields on the lower side:

• Project title
• Company name
• Project code

Below these, one or more Action buttons are shown (e.g., New Activity). If the informationField is set, it appears at the bottom, below the Action buttons, and is preceded by a label.

Configuration

The example ViewTemplate Head uses the following EntityFields of the Salesproject_entity:

Property	Field	Description
iconField	IMAGE	Displays the project image
titleField	PROJECTTITLE	Displays the main title
subtitleField	CONTACT_ID	Displays the associated company
descriptionField	PROJECTCODE	Displays the project code
informationField	(optional) STATE	Displays project status (labeled)

For demonstration purposes, you may set informationField to STATE to see its behavior in the client.

Additionally, the following Action configuration is applied:

• favoriteAction1: newActivity

note

If informationField is not configured, that section remains hidden in the layout.