- Latest Version 1.128
- 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.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.128
- 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
What’s New in Guideline Version 1.62
Intro
This article provides an overview of the topics that have been added or changed with the guideline version 1.62.
With each new guideline version, we deliver two types of update:
- Updates to reflect new or changed UI controls available with the corresponding SAPUI5 version (SAPUI5 Version 1.62).
- Ongoing updates on how to best apply the SAP Fiori design (such as overarching concepts, floorplans, and additional decision support). These updates are introduced with a given guideline version, but are not necessarily dependent on a specific SAPUI5 version.
Note: Our policy is to update only the latest guideline version. If you are working with an earlier SAPUI5 release, also consider checking out the most recent guideline version to get the latest general guidance.
General Concepts
Action Placement
Additional guidance: Use only one emphasized button per toolbar and never mix emphasized and semantic buttons.
For more information, see Action Placement.
Wrapping and Truncating Text
Additional hint not to use tooltips to show the full text when a text is truncated.
For more information, see Wrapping and Truncating Text – Use of Truncation.
UI Elements
Updates for Multiple UI Elements
Button Style
Use only one emphasized button per toolbar and never mix emphasized and semantic buttons.
For more information, see:
Updates for Individual UI Elements
Form / Simple Form
- A new Input Assistance section indicates how to offer system recommendations.
- All images have been updated to reflect the new font “72” and the updated label color for display mode (#666666).
For more information, see Form / Simple Form.
Generic Tag New!
The generic tag displays complementary information related to the current page, such as KPIs and situations.
For more information, see Generic Tag.
Input Field
- The autocomplete behavior has been enhanced.
- A new Input Assistance section indicates how to offer system recommendations.
For more information, see Input Field.
Multi-Combo Box
When the multi-combo box is used for filtering, the user can select or deselect all items using the keyboard shortcuts Ctrl+A
/ Ctrl+Shift+A
.
For more information, see Multi-Combo Box in a Filter Scenario.
Multi-Input Field
The autocomplete behavior has been enhanced.
For more information, see Multi-Input Field.
Progress Indicator
You can now use the new “information” value state with the progress indicator.
For more information, see Progress Indicator – Styles.
Select
The select control can now display icons in front of each option. This can help users identify options more easily.
For more information, see Select – Option List.
Select Dialog
Correction: “Column list items” was removed as an option for the content area. Column list items are not supported for the select dialog.
For more information, see Select Dialog.
Single Planning Calendar New!
The single planning calendar is a new control for scheduling. It displays the calendar of a single person or resource over a day, work week, or week. Users can view the details of appointments, create new appointments, and delete appointments.
Tile
The tile header and subtitle now support language-specific hyphenation.
For more information, see Tile.
Toolbar Overview
Additional information on the use of emphasized and semantic buttons.
For more information, see Toolbar Overview – Styles and Toolbar Overview – Order of Buttons.