Creating Control and Component Libraries


After completing this lesson, you will be able to:

  • Recognize the structure of a custom library

Implementing Custom Libraries

Creating reusable building blocks is necessary to increase development speed and provide the same intuitive and consistent experience across the enterprise.

A custom library provides reuse functionality and UI controls without copy and paste.

This list enumerates the basic advantages of control libraries:

  • Reuse controls/functionality in different applications
  • Provide automatic support for theming
  • Provide automatic support for right-to-left languages
  • Can be installed on the ABAP-platform
  • Can be installed in the SAP Business Technology Platform

Let's now look at the structure of a custom library together with additional information on library.js and manifest.json.

Encapsulate Function in a Custom Library - The Control

The characteristics of controls in a custom library are as follows:

  • Multiple controls can be added to a library
  • The full qualified classname must match the one defined in the library.js
  • Standard JavaScript can be used
  • Define as a JavaScript module with name, dependencies and factory functionsap.ui.define([...], function() {...});

At the end, you must implement the controls that are going to be encapsulated in the UI library.

When you are finished with the development, you have to deploy the UI library project to your on-premise or cloud system.

After deployment, the UI library shows up in transaction SICF.

Custom Library Usage

A dependency is defined in the manifest.json file of the application that uses the UI library. The dependency triggers the get response of the library.js file from the dependent UI library.

Log in to track your progress & complete quizzes