1. Overview of the Web View Element

The Web View element is a UI element that enables the direct display of external or internal web content within an application. Users can view web pages, explore content, or interact with web-based forms without leaving the application.

(i) The Web View element is supported in both web and mobile applications.

1.1. Common Use Cases

• Displaying external web pages within the app
• Terms of service, privacy policy, or help pages
• Web-based forms and surveys
• Dynamic reports or dashboard content
• Information and documentation pages embedded within the app

2. Key Features

• Displaying web content within the app: Web pages can be displayed directly on the app screen via external or internal URLs.
• Dynamic URL support: The web content to be displayed can be defined statically or dynamically linked via state, variables, or action outputs.

2.1. Web View Element Properties

You can configure the Web View element’s properties from the Properties panel on the right.

• URL: You can enter the URL of the web page to be displayed statically or assign a dynamic value using the Symbol Picker.

The Web View element enhances the user experience by allowing users to access external links from within the application.

2.2. Actions That Can Be Added to the Element

The Web View element does not support directly adding actions (Add Action). The element does not have onClick, onChange, or similar events, and there is no action trigger in the right-hand Properties panel.

The Web View is used solely for displaying web content. Any actions requiring processing, redirection, or interaction must be managed through the Web View content’s own structure or other UI elements within the application.

3. How to Use the Web View Element?

In this section, we will cover the end-to-end usage of the Web View element through an example scenario.

Scenario: Using the Web View

The Web View element allows an external website to be displayed within the application. In this scenario, the user can view a specific web page without leaving the application.

For example, a URL is defined within the Web View to display training documents to the user. When the page loads, the relevant website opens directly within the app, and the user can review the content from there.

Step 1 - Adding the Web View Element

Start on the home page:

1. Drag and drop the Elements > Special > WebView element onto the page from the left-hand panel.

2. Define the URL to be displayed as WebView > Properties > URL > “https://example.com”.

Preview:

With the Web View element, external websites can be displayed within the application, and users can access the relevant content without leaving the app.

4. Common Properties

Some fields on the Web View element are shared across all UI elements. Therefore, detailed descriptions of the following properties can be found in the relevant general guide pages:

• Authorization Settings
• Visibility
• Editability
• Style Panel

5. Best Practices

• Use trusted URLs. Display only secure and verified web content within the Web View.
• Control the use of dynamic URLs. Verify the validity of URLs generated by state or action outputs.
• Test for mobile compatibility. Ensure the web content to be displayed is suitable for mobile screens.
• Add text that guides the user. Brief explanations of why the Web View content is being displayed improve the user experience.

6. Limitations

• The Web View element cannot trigger actions directly.
• Some websites may not be viewable due to security policies (e.g., iframe restrictions).