Using Header Facets for Object Pages

Objective

After completing this lesson, you will be able to Define the different types of header facets for object pages.

Header Facets for Object Pages

Define Header Facets

Header facets are pieces of information placed on the header part of an Object Page.

Generally, key information and status information should be put in this area.

Types of Header Facets

There are different types of header facets.

Note

Smart Micro Chart Facet, Rating Indicator Facet, and Data Point Facet will be covered in later chapter of this course.

For a full list of types of header facets, open SAPUI5 SDK and navigate the following path:

Documentation->Developing Apps with SAP Fiori Elements->List Report and Object Page->Configuring Object Page Features->Setting up the Object Page Header->Header Facets.

Field Group Facets

A field group defines the fields displayed within a specific reference facet. For example, the figure shows the following fields within theĀ Amount Information and Status Information:

Amount Information:

  • Total Gross Amount
  • Total Net Amount

Status Information:

  • Overall Status
  • Confirmation Status
  • SO Ordering Status
  • SO Lifecycle Status

Define Field Groups

The term UI.FieldGroup is used to define field groups. Because, in most cases, a CDS view has more than one field groups, a qualifier should be assigned to each field group to distinguish among those field groups.

A field can belong to different field groups so that the UI.fieldGroup annotation for each field is an array. The annotation should use JSON format for easier modification in the future.

When translating the field groups annotation to OData annotation, all @UI.fieldGroup annotations that have the same qualifier will be combined to one term. The sequence of fields in a field group will be determined by @UI.fieldGroup.position defined in CDS view.

If you are interested in learning how to define field group header facets, watch the video below.

Defining a Plain Text Header Facet

The Plain Text Header Facet is quite like the field group header facet.

To define a plain text header facet, you should do the following:

  • Define a field group containing only one field.
  • Set the field as a multiline text.

Definition of the Header Facet Communication

Technically, a communication header facet is a Field Group header facet. The only difference is at least one field of the field group should reference to a vCard.Contact annotation.

Currently, a communication header facet can only be created by adding local annotation through the annotation modeler in SAP WebIDE.

Check out the steps here.

Arrangement of Header Facets

If there is more than one header facet, they will arrange in a row and will start a new row if there is not enough room.

The figure above shows the arrangement for eight header facets.

Log in to track your progress & complete quizzes