- Latest Version 1.126
- SAPUI Version 1.124
- SAPUI5 Version 1.122
- SAPUI5 Version 1.120
- SAPUI5 Version 1.118
- SAPUI5 Version 1.114
- SAPUI5 Version 1.112
- SAPUI5 Version 1.110
- SAPUI5 Version 1.108
- SAPUI5 Version 1.106
- SAPUI5 Version 1.104
- SAPUI5 Version 1.102
- SAPUI5 Version 1.100
- SAPUI5 Version 1.98
- SAPUI5 Version 1.96
- SAPUI5 Version 1.94
- SAPUI5 Version 1.92
- SAPUI5 Version 1.90
- SAPUI5 Version 1.88
- SAPUI5 Version 1.86
- SAPUI5 Version 1.84
- SAPUI5 Version 1.82
- SAPUI5 Version 1.80
- SAPUI5 Version 1.78
- SAPUI5 Version 1.76
- SAPUI5 Version 1.74
- SAPUI5 Version 1.72
- SAPUI5 Version 1.70
- SAPUI5 Version 1.68
- SAPUI5 Version 1.66
- SAPUI5 Version 1.64
- SAPUI5 Version 1.62
- SAPUI5 Version 1.60
- SAPUI5 Version 1.58
- SAPUI5 Version 1.56
- SAPUI5 Version 1.54
- SAPUI5 Version 1.52
- SAPUI5 Version 1.50
- SAPUI5 Version 1.48
- SAPUI5 Version 1.46
- SAPUI5 Version 1.44
- SAPUI5 Version 1.42
- SAPUI5 Version 1.40
- SAPUI5 Version 1.38
- SAPUI5 Version 1.36
- SAPUI5 Version 1.34
- SAPUI5 Version 1.32
- SAPUI5 Version 1.30
- SAPUI5 Version 1.28
- SAPUI5 Version 1.26
- Latest Version 1.126
- SAPUI Version 1.124
- SAPUI5 Version 1.122
- SAPUI5 Version 1.120
- SAPUI5 Version 1.118
- SAPUI5 Version 1.116
- SAPUI5 Version 1.114
- SAPUI5 Version 1.112
- SAPUI5 Version 1.110
- SAPUI5 Version 1.108
- SAPUI5 Version 1.106
- SAPUI5 Version 1.104
- SAPUI5 Version 1.102
- SAPUI5 Version 1.100
- SAPUI5 Version 1.98
- SAPUI5 Version 1.96
- SAPUI5 Version 1.94
- SAPUI5 Version 1.92
- SAPUI5 Version 1.90
- SAPUI5 Version 1.88
- SAPUI5 Version 1.86
- SAPUI5 Version 1.84
- SAPUI5 Version 1.82
- SAPUI5 Version 1.80
- SAPUI5 Version 1.78
- SAPUI5 Version 1.76
- SAPUI5 Version 1.74
- SAPUI5 Version 1.72
- SAPUI5 Version 1.70
- SAPUI5 Version 1.68
- SAPUI5 Version 1.66
- SAPUI5 Version 1.64
- SAPUI5 Version 1.62
- SAPUI5 Version 1.60
- SAPUI5 Version 1.58
- SAPUI5 Version 1.56
- SAPUI5 Version 1.54
- SAPUI5 Version 1.52
- SAPUI5 Version 1.50
- SAPUI5 Version 1.48
- SAPUI5 Version 1.46
- SAPUI5 Version 1.44
- SAPUI5 Version 1.42
- SAPUI5 Version 1.40
- SAPUI5 Version 1.38
- SAPUI5 Version 1.36
- SAPUI5 Version 1.34
- SAPUI5 Version 1.32
- SAPUI5 Version 1.30
- SAPUI5 Version 1.28
- SAPUI5 Version 1.26
Terminology for SAP Fiori Elements
Intro
To help you better communicate with application developers, this article presents:
- Development terms () and what you, as a designer, need to understand about them
- Design terms ( ) that may be unfamiliar to application developers and ways to present design requirements that are meaningful to application developers
- Terms that both application developers and designers use ( ), but for different concepts, which sometimes results in misunderstanding
Term |
Explanation |
|||||||||||||||||
Action Placement
|
Action placement is an important focus in design. You place the action as close to the information that it acts upon so users find them where they need them.
However, because the SAP Fiori elements framework determines where the action is displayed, application developers do not specify the placement with annotations. For example, they may not be familiar with what you mean by a “finalizing action” in a list report. To implement this type of action, they use the annotation property Below, you can find additional examples of the differences between designer terminology for actions and how the application developers implement them.
|
|||||||||||||||||
Annotations
|
Application developers configure the required controls and their behavior with annotations that provide information about the application data.
For example, annotations and their properties control the:
Application developers can also configure the required controls and their behavior through the manifest file. |
|||||||||||||||||
App States
|
App states include the:
IApp StateWhen a user navigates within an application, the iApp state stores all the information to retrieve for a specific URL when the user returns to it, for example:
The user can return to the URL via
XApp StateWhen a user navigates from one source app to another target app, the xApp state stores all the information from the source app to pass the target app, for example:
Also see: Navigation |
|||||||||||||||||
Asynchronous Actions
|
Actions that the backend can execute sometime after the users initially trigger it.
Users can continue to work on the UI without any interruption to their flow. Also see: Synchronous Actions |
|||||||||||||||||
Column in a Table
|
Application developers probably know this term, but may not connect it with the annotations required for columns.
To configure a table, application developers use the For more information, you can refer them to Defining Line Items. |
|||||||||||||||||
Content Switches
|
These design terms may not be meaningful to developers because they don’t specify the UI control that lets the user switch among views in a list report.
Instead, the SAP Fiori elements framework automatically renders the switch control based on the number of business objects shown in the views and the number of views:
For more information, see List Report – Content Area. |
|||||||||||||||||
Entity
|
An entity in a data model corresponds to a business object in an application.
For example, for a sales order processing application, the sales order is an entity and the sales order item is its child entity in the data model. This parent-child association in the data model lets users navigate from the sales order to the sales order item in the application interface. |
|||||||||||||||||
Facet
|
As a designer, you use the word facet for a UI element specific to the object page header.
Developers use the word facet more generically to describe a unit for building for the object page so don’t be surprised to hear application developers speaking about “facets” for parts of the object page outside of the header. For example, they use the annotation When you talk to application developers about a “facet,” specify where you want it to display. |
|||||||||||||||||
Manifest
|
The main configuration file for an application where application developers define settings for the application and the interface behavior.
For example, in the manifest, an application developer can configure:
Application developers can also configure the required controls and their behavior through annotations. |
|||||||||||||||||
Navigation: Internal, External, Outbound, Inbound
|
Navigation within an app — for example, from a list report to an object page to a subobject page: The application uses an inner app (iApp) state to store the page state and context and restore the same page state and context:
Navigation across applications — for example, from Managing Sales Orders to Managing Deliveries — uses the external app (xApp) state to pass the context from the source app to the target app. Just as an outbound train leaves the station and an inbound train arrives at the station:
|
|||||||||||||||||
OData Services
|
OData (Open Data Protocol) is a standard protocol used by the backend to communicate with the user interface.
OData services deliver one or more functionalities or capabilities on the backend system, such as the retrieval of data or execution of a series of actions. The code for the services can be reused for various purposes by different client applications. SAP Fiori elements support different versions of OData, as their names indicate:
|
|||||||||||||||||
Paginator Buttons
|
Known by designers as paging buttons ( ) in the object page header toolbar, they let users navigate to the previous or next object page shown in the list report.
For more information, see: Header Toolbar |
|||||||||||||||||
Section
|
This designer term may not be meaningful to some application developers because they do not use it in their annotations.
Instead, to build an object page section, application developers use different types of facet annotations. They start with a facet, add a reference facet, and add other controls for a form, table, or chart. For more information, you can refer them to Defining and Adapting Sections. |
|||||||||||||||||
Semantic Key Field
|
This field is the unique identifier for an object used by the search to find the object. | |||||||||||||||||
SideEffects
|
When a user edits an object, changes to the object can impact other object properties.
For example, in an employee record, changing the value for City in the employee address makes the value in the State or Region field invalid. |
|||||||||||||||||
Smart Controls and Control Library
|
These UI controls can read both the data from the backend and the annotations on that data.
Consequently, they take the annotations into account in their rendering and behavior. For example, a smart field isn’t displayed on the UI if it’s marked with the annotation to hide it, SAP Fiori elements for OData V2 uses smart controls. SAP Fiori elements for OData V4 uses a different control library. |
|||||||||||||||||
Synchronous Actions
|
An action that the backend executes immediately after the users trigger it and, thus, blocks them from performing other actions on the interface until the execution is complete.
Also see: Asynchronous Actions |
|||||||||||||||||
textArrangement
|
An annotation property that controls the display of text associated with an ID field, such as country and country code. It can set the display of:
|