Registering Extension Control in SAP Business Application Studio

The extension controls that you have created to extend the functionality of your app can be used as base controls by registering them using the Mobile Development Kit editor.

Procedure

1. Right-click on the Extensions folder, and select MDK: Register Extension Control.

2. Choose a template in the Template Selection tab:

   Template Name	Description
   New Metadata Extension Control	Generate extension metadata and .extension file
   Register a Native Extension Control	Generate .extension file which is used for Control's implementation on Mobile Development Kit Client side.
   Register Existing Metadata Extension Controls	Generate .extension file based on existing extension metadata folder

   Choose Next.

3. In the Base Information tab, provide the Control Name, Module, Control, Class and Display information.

   A file named Control_Name.extension is generated based on the control name you provided.

   The Module, Control and Class properties are used to identify the extension control.

   The Display property is used for the image to be displayed on the page editor to represent the extension control. Use the binding button to select an image from the Workspace\MDKExtensionControls\Images folder.

   Choose Next.

4. Define the properties of the extension control in the Extension Properties Schema window. You can also add a sample under Sample Extension Properties column and click Generate Schema to generate the schema info. For example:

   {
       "MaxValue" : 200,
       "MinValue" : 10,
       "Title" : "Counter"
   }
   

5. Click Finish to complete the registration of extension control.

Alternative ways to register the extension control:

• Another way is to open the page directly (double click on the page or right click on the page and choose "open page layout editor") or create one new page, then, the extension controls are automatically registered.

Extension files are named in this format: <Module>_<Control>_<Class>.extension

Results

After you register an extension control, a file named <Control Name>.extension is created under the folder Extensions in your project.

All the registered extension controls present in the Extensions folder are displayed in the Registered Extension Control section of the control panel in the page editor.

Folder structure:

metadatamaster (ProjectName)

• Extensions (folder)

  • DevAppExtension (folder) (ModuleName)

    • controls (folder)

      • MyControlExtension.ts (file) (ClassName)

        export class MyControlExtension extends IControl {} (file content) (ControlName)

    • I18n (folder) - This folder is not affected

  • DevAppExtensionJS (folder) (ModuleName)

    • controls (folder)

      • MyControlExtension.js (file) (ClassName)

        exports.MyControlExtension = MyControlExtension (file content) (ControlName)

    • I18n (folder) - This folder is not effected

A developer can set the properties of a registered extension control using the editor. For details, see Registered Extension Control.

Note

Whenever an extension is used, and the required class, control, or module is unavailable, the Mobile Development Kit client app fails and an error message is displayed.

---

Last update: August 28, 2023