SAPUI5 Overview
October 2012
TIP CORE UI5
Agenda
• SAPUI5 Overview
• Runtime Resources
• Programming Applications
• SAPUI5 Developer Studio
• Creating a SAPUI5 Project
• Resource Handling /
Localization
• MVC
• Databinding
• Styling & Theming
• Extending SAPUI5
• Notepad Controls
• CVOM Charts
• Optimizing SAPUI5
• Security
© 2011 SAP AG. All rights reserved.
2
SAPUI5 Overview
SAP UI Development Toolkit for HTML5
SAP UI Development Toolkit for HTML5
The official long name
SAPUI5
The short name
UI5
Internal name
For official communication the upper two versions have to be used.
UI5 used to be named "Phoenix", it was changed to SAPUI5 in the summer of 2011
because the name Phoenix was not suitable to be used publicly.
© 2011 SAP AG. All rights reserved.
4
Main UI5 Characteristics
SAPUI5 is an extensible JavaScript-based HTML5 browser
rendering library for Business Applications.
Supports RIA like client-side features based on JavaScript
Supports an extensibility concept regarding custom controls
Allows change of themes for customer branding in an effective manner
Allows usage of own JavaScript and HTML
Uses the jQuery library as a foundation
Fully supports SAP Product standards
Open AJAX compliant and can be used together with/uses other standard JS libs
Can be used from various platforms (Java, ABAP, etc)
Produced in a release independent code line to enable short shipment cycles
© 2011 SAP AG. All rights reserved.
5
UI5 Browser Support
Internet Explorer
Version 9
Version 8
Firefox
Version 3.6 and
latest version
Chrome
Latest version
Safari
Latest version
Internet Explorer 8 is supported with graceful degradation for CSS3 features
like rounded corners, text-shadows, etc.
© 2011 SAP AG. All rights reserved.
6
UI5 Release Plan and Strategy
Development track
Identified by a major and an odd
minor version number, e.g. 1.5.1
The versions of this track are
released internally and are not
meant to be used in products
shipped to customers.
Release track
Identified by a major and an even
minor version number, e.g. 1.4.1
The versions of this track are released
externally. Only these versions are
allowed to be used in production.
© 2011 SAP AG. All rights reserved.
7
UI5 Architecture Overview
UI5 Core
• UI5 Core includes base, core and
model modules
• Dependency / Class-Loader to load
control libraries
• Render manager creates HTML
strings for the instantiated controls
• The UI5 Core includes other
JavaScript libraries
•
•
• data.js
jQuery
jQuery UI
© 2011 SAP AG. All rights reserved.
8