Introduction
The Web View component allows embedding a webpage directly inside your application. It is useful for scenarios where an external page needs to be displayed for user interaction.
On the Canvas, the Web View component displays the webpage content directly. You can either paste a URL or insert HTML/JavaScript code that runs inside the component.
Frame Block
The Frame attributes of the Web View component are identical to those of the Rect component. For details, refer to the Rect component’s Frame section.
Properties Block
The basic Properties of the Web View component inherit from the Rect component. For details, refer to the Rect component’s Properties section.
Content Block
Property Name | Property Type | Description |
URL | String String | The webview content url. Set the URL path of the webpage to be opened in the WebView component. |
Header | Object Object | The HTTP request's header fields. Configure the request headers to be sent. Headers are the metadata included in HTTP request and response messages. |
User Agent | String String | The HTTP request's user agent. The user agent is used to identify the application, operating system, vendor, and/or version of the requesting party. Define the User Agent for the request. The User Agent identifies the application type, operating system, software vendor, and version of the requesting client. |
HTML | String String | The HTML of the webview content. Specify the webpage content using HTML syntax. |
Allow Content Control | Boolean Boolean (Yes/No) | To set whether users are allowed to interact with the webview. Set whether users are allowed to interact with the content inside the WebView. |
Crop Content Block
Property Name | Property Type | Description |
Left | Number Number (pixels) | The width in pixels to be cropped on the left side of the webview. Set the number of pixels to crop from the left side of the webpage. |
Right | Number Number (pixels) | The width in pixels to be cropped on the right side of the webview. Set the number of pixels to crop from the right side of the webpage. |
Top | Number Number (pixels) | The width in pixels to be cropped on the top side of the webview. Set the number of pixels to crop from the top side of the webpage. |
Bottom | Number Number (pixels) | The width in pixels to be cropped on the bottom side of the webview. Set the number of pixels to crop from the bottom side of the webpage. |
Injected JavaScript Block
Property Name | Property Type | Description |
Code | String String | Injected JavaScript code. Set the JavaScript code to be used in the webpage. No |
Before Content Loaded | String String | Injected JavaScript code before content being loaded. Set the JavaScript code to be injected before the webpage is loaded. No |
For MainFrame Only | Boolean Boolean Yes/No | (Android only) Injected JavaScript code for the main frame only. Specify whether the JavaScript is applied only to the MainFrame (Android only). |
Before Content Loaded For Main Frame Only | Boolean Boolean Yes/No | (Android only) JavaScript code before content being loaded for the main frame only. Specify whether the JavaScript is injected before the webpage is loaded and applied only to the MainFrame (Android only). |
Permission Block
Property Name | Property Type | Description |
Origin Allow List | Array of String Array of | List of origin strings that are allowed to be navigated to. Allow all if not specified. Define the list of allowed URLs that the WebView component can navigate to. If left empty, all URLs are allowed. |
Java Script Enabled | Boolean Boolean Yes/No | To set whether JavaScript is enabled. Set whether the WebView component can execute JavaScript. |
Allow File Access | Boolean Boolean Yes/No | To set whether file:// access is allowed. Set whether the WebView component allows |
Dom Storage Enabled | Boolean Boolean Yes/No | To set whether DOM storage is allowed. Set whether the WebView component enables DOM Storage. |
Cache Enabled | Boolean Boolean Yes/No | To set whether caching is allowed. Set whether the WebView component allows caching. |
Geolocation Enabled | Boolean Boolean Yes/No | To set whether geolocation is allowed. Set whether the WebView component enables geolocation. |
Third-Party Cookies Enabled | Boolean Boolean Yes/No | To set whether third-party cookies are allowed. Set whether the WebView component allows third-party cookies. |
Properties – Border Block
The border attributes of the Web View component are identical to those of the Rect component. For details, see the Rect component’s Border section.
Animations Block
The animation event attributes are the same as those of the Rect component. For details, see the Rect component’s Animation section.
Additional animations:
On Load | Animation that will be triggered when the web view is being loaded. Set the animation event to be triggered when the WebView content is loaded. |
On Error | Animation that will be triggered when an error occurs while loading the web view. Set the animation event to be triggered when an error occurs while loading the WebView content. |
On Message | Animation that will be triggered when the value of Set the animation event to be triggered when the WebView receives a message from the JavaScript code |
Events Block
The event attributes are the same as those of the Rect component. For details, see the Rect component’s Event section.
Additional events:
On Load | Event that will be triggered when the web view is being loaded. Set the event to be triggered when the WebView content is loaded. |
On Error | Event that will be triggered when an error occurs while loading the web view. Set the event to be triggered when an error occurs while loading the WebView content. |
On Message | Event that will be triggered when the value of Set the event to be triggered when the WebView receives a message from the JavaScript code |