SAP UI5 Beginners Tutorial Seventeen - Trial Version of Aggregate Binding in UI5 Composite Controls

A set of step-by-step learning tutorials for SAP

Tutorial Directory

• SAP UI5 up a local development environment
• SAP UI5 Beginners Tutorials: Hello World
• SAP UI5 Beginners Tutorial II: The Bootstrap of SAP
• Started with the First SAP UI5 Control 161e7be010dd2f
• SAP UI5 Beginners Tutorial No. 4: A Preliminary Study of XML Views
• SAP UI5 Beginners Tutorial No. 5: A Preliminary Exploration of View Controllers
• SAP UI5 Beginners Tutorial Six - Understanding the Concept of Modules in SAP
• SAP UI5 Tutorial for Beginners Seven - A Preliminary Study of JSON Model
• SAP UI5 Beginner Tutorial No. 8 - Multilingual
• SAP UI5 Beginners Tutorial No. 9 - Creating Your First Component
• SAP UI5 Beginners Tutorial No. 10 - What is the Descriptor of SAP UI5 Application
• SAP UI5 Beginners Tutorial Eleven: SAP UI5 Container Controls Page and Panel
• SAP UI5 Tutorial for Beginners Part 12 - Using CSS Classes to Further Beautify the UI
• SAP UI5 Tutorial for Beginners Part 13 - How to Add Custom CSS Classes
• SAP UI5 Beginners Tutorial No. 14 - How to Use
• SAP UI5 within fifteen tutorial for beginners - use dialog boxes and Fragments of
• SAP UI5 Beginners Tutorial Part 16 - Use of

instruction

Jerry has been in contact with SAP UI5 since joining the CRM Fiori development team of SAP Chengdu Research Institute in 2014. He has published many articles on the working principle and source code analysis of SAP UI5 in the SAP community and the WeChat public account "Wang Zixi".

In Jerry's article , newbies who know nothing about SAP UI5, which materials are better to start with? once mentioned that Jerry has also come all the way from SAP UI5 rookie, and knows that it is not easy for developers with only ABAP development background to transform to SAP UI5 development field, so I designed this study for SAP UI5 beginners in my spare time. The tutorial divides the process of developing a complete SAP UI5 application into several steps, and strives to cover all the knowledge points involved in each step. These knowledge points may not be as in-depth as my UI5 source code analysis series articles, but strive to be easy to understand and easy for SAP UI5 beginners to understand.

The source code of each step of this tutorial is stored in my Github , identified by folders 01, 02, 03 and so on.

Each step builds on the previous step with several new features added. It is recommended that beginners with zero foundation or little knowledge of SAP UI5 learn step by step from the first step in order, download these codes to the local, cooperate with the text explanation of the tutorial, and do it yourself to deepen the understanding.

If you have any questions about each step of the tutorial, you are welcome to comment and leave a message in the article corresponding to the steps of the tutorial.

In the steps described earlier in this tutorial, we have been exposed to the following two types of SAP UI5 controls:

(1) Simple controls, such as Button, Input, FormattedText, etc.
(2) Container controls, such as Panel controls. A container control can hold other simple controls inside.

In this step we will touch on a new type of control, the composite control. The composite control is composed of other simple controls, and these controls work together to achieve a certain function.

A typical composite control is the List list control introduced in this article.

source code of this article is as follows .

It can be seen that the interface of our SAP UI5 application is getting richer and richer. Compared with the previous step, there is one more Invoice list:

Using the UI5 Inspector Chrome extension introduced earlier in this tutorial, you can observe that the list sap.m.List consists of sap.m.ObjectListItem and sap.m.Text.

step of how to display this list in a SAP UI5 application.