| loio |
|---|
| d2ef0099542d44dc868719d908e576d0 |
view on: demo kit nightly build | demo kit latest release
The sap.uxap.ObjectPageLayout control has two types of header - classic header and dynamic header.
The sap.uxap.ObjectPageLayout control implements the snapping header concept. This means that the upper part of the header (Header Title) always stays visible, while the lower part (Header Content) can scroll out of view.
The common pattern is that the most important information describing the object, such as title, subtitle, and image is in the Header Content area when the header is expanded, and moves to the Header Title area when the header is collapsed (snapped - its lower part scrolled out of view).
sap.uxap.ObjectPageLayout header in expanded state
The following image shows the collapsed (snapped) header is where the Header Content area is scrolled out and not visible, and the main information is visible in the Header Title area.
sap.uxap.ObjectPageLayout Header in Collapsed (snapped) State
Up to version 1.52, only sap.uxap.ObjectPageHeader could have been used to build up the sap.uxap.ObjectPageLayout header.
|
Header area |
|
App must provide: |
|---|---|---|
|
Header Title |
|
An instance of the |
|
Header Content |
|
An array of arbitrary controls.
|
The app provides an instance of sap.uxap.ObjectPageHeader as the value of the headerTitle aggregation, and arbitrary controls as the value of the headerContent aggregation (which are internally added to an instance of the sap.uxap.ObjectPageHeaderContent control).
As of version 1.52, a new sap.uxap.ObjectPageDynamicHeaderTitle control can be used to build a dynamic header for sap.uxap.ObjectPageLayout.
|
Header Area |
|
App Must Provide: |
|---|---|---|
|
Header Title |
|
An instance of the |
|
Header Content |
|
An array of arbitrary controls.
|
Again, the app provides an instance of sap.uxap.ObjectPageDynamicHeaderTitle as the value of the headerTitle aggregation and a list of controls for the headerContent aggregation (sap.uxap.ObjectPageLayout uses internally sap.uxap.ObjectPageDynamicHeaderContent to lay out the controls).
- Object Page Classic Header
Overview of the structure and features forsap.uxap.ObjectPageLayout's classic header. - Object Page Dynamic Header
Overview of the structure and features forsap.uxap.ObjectPageLayout's dynamic header. - Object Page Headers Comparison
This section explains the differences and similarities between the two types of header of thesap.uxap.ObjectPageLayoutcontrol.
Related Information
API Reference: sap.uxap.ObjectPageLayout