Designer 2.0 provides a convenient way to integrate external applications into your existing app through the Web View element. This feature enables seamless navigation to web-based applications, such as those built on Angular or other platforms, directly within the app interface.
Web View Element: Purpose and Usage
The Web View element in Designer 2.0 allows end-users to open a web page directly from the app by tapping a link. It serves as a lightweight browser embedded within the app, offering limited browsing capabilities while keeping the user within the app’s environment.
Configuration Steps
- Add Web View Element
Navigate to the Elements section in Designer 2.0 and drag the Web View element into your screen flow. You can refer to this link:- Community - Set the Application URL
In the properties panel of the Web View element, enter the URL of the external (e.g., Angular) application. - For more detailed information about the web view element, click Here.
- Add Query Parameters (Optional)
- You can append query parameters to the URL to pass additional information.
- These parameters can be configured as either static values or dynamic values (fetched from the app context).
- Configure Success and Failure URLs (Optional)
- Success URL: Enter the URL to be loaded when a specific action or process within the web view completes successfully.
- Failure URL: Enter the URL to be displayed when a specific action within the web view fails.
Key Benefits
- Enables cross-platform integration by allowing the opening of applications developed on other platforms.
- Ensures a smooth transition between the native app and external web-based applications.
- Supports dynamic configuration for enhanced flexibility.
- Requires minimal setup—just the application URL and optional parameters.
Conclusion
By leveraging the Web View element in Designer 2.0, you can easily integrate applications built on other platforms—such as Angular—into your existing app ecosystem. As long as you have the URL of the external application, embedding it within your app becomes a simple and efficient process.
Just to add a quick note:
In web applications developed using Designer 2.0, the WebView component does not currently support success or failure URLs directly.
If you still need to implement such a flow, you can achieve it by opening a secondary web application using the “Open Web” task. Once the desired action is completed in the secondary app, you can return to the primary app by passing query parameters (e.g., tg=taskId
). This taskId
can then be used within the primary app to trigger the required actions and navigate to the appropriate screen.