Skip to content

Registering Extension Control in Web IDE Editor

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.


  1. In the editor, right-click on the Workspace, and select Register MDK Extension Control. The first time you create an extension control, a directory named MDKExtensionControls is automatically created under the Mobile Development Kit app project workspace. All the generated files is saved in MDKExtensionControls folder.

    Alternatively, you can also, right click on the MDKExtensionControls folder, and select Register MDK Extension Control.

  2. Choose a template wizard:

    Template Name Description
    New and Register Metadata Extension Control Generate extension metadata and .extension file
    Register Existing Metadata Extension Controls Generate .extension file based on existing extension metadata folder
    Register Native Extension Control Generate .extension file which is used for Control's implementation on Mobile Development Kit Client side.
  3. In the MDK Extension Control editor, provide the Control Name, Module, Class and Display information. A file named ControlName.extension is generated based on the control name you provided.

    The Module 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.

  4. Define the properties of the extension control in the Extension Properties Schema window. You can also import a property sample.

  5. Click Generate Schema to generate the schema info Alternative ways to register the extension control:

    • By right-clicking the "Extensions" directory, and selecting Register General Extension Controls in the context menu , the controls are registered.
    • 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


After you register an extension control, a file named <Control Name>.extension is created under the folder Workspace\MDKExtensionControls.

All the registered extension controls present in the Workspace\MDKExtensionControls 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.


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: November 18, 2021