Veritran Docs

Instancing a Component-type Module

By instancing component-type module, you can use the components created as interfaces within a module in the different screens of an app while editing the screen in the Visual Builder. You can use them as any other component available in the Visual Builder in the same Studio environment.

Important

If the theme applied to the module - and therefore, to its component interfaces - is different than the app theme, the app theme will prevail and the look and feel of each component will be defined by the theme configured for the app.

To invoke modules from the Visual Builder, you must first link the module to the app in the app dependencies. By enabling them, you will be able to use the module’s content in the Visual Builder for main app selected. To learn more about how to enable dependencies, read App Settings.

Once dependencies are activated, open the screen you want to edit in the Visual Builder. Click on the Components tab, located in the Left Panel and go through the list of components to find the module previously linked to the app. The components tab contains all the components available in Studio as well as component-type interfaces created within linked modules, that will be displayed as separate components. To add a module component, drag and drop the desired component at any position in the simulator. Then, you can configure the attributes of the selected component in the Right Panel.

Notice

The values configured in the parameters of the component interface are also displayed in the Visual Builder. Input and Output values configured will appear in the Basic Inputs and Basic Outputs sections of the Design tab in the Right Panel and can be modified in the Visual Builder. Events values configured will appear listed in the Events & Actions section of the Actions tab. In the case of Messages values, you must first go to Events & Actions section in the Actions tab, then click on the vertical-three dot icon and select Event from the drop-down menu. Messages values configured will appear in the Actions drop-down menu available. Events and Messages parameters cannot be modified in the Visual Builder.