Overview WebView



This control element displays a web page directly inside the visualisation. It opens an embedded web browser (WebView) within the element area.

An optional navigation bar with Back, Forward and Reload buttons can be shown at the bottom of the element.

Note: This element is only active in the Android app. In the Studio the configured URL is shown as placeholder text instead of a live WebView.


Display
Background Background colour of the element. Visible as a border or while the WebView is still loading.
Font Font colour for the placeholder text (visible in the Studio only, when no WebView is active).
URL The address of the web page to display.

Examples:
  • http://192.168.1.1 – local router or device on the network (HTTP)
  • https://www.google.com – external web page (HTTPS)
  • http://192.168.1.205:80/liveData.html – device with specific port and path
Note on HTTP: To access local devices via HTTP (e.g. a router at 192.168.x.x), cleartext traffic must be permitted in the app configuration. This is already set in the default configuration.
Show navigation Shows a navigation bar at the bottom of the element with three buttons:
  • Back – go to the previous page in history
  • Forward – go to the next page in history
  • Reload – reloads the target URL. If an error page is shown (e.g. ERR_CONNECTION_REFUSED) the original target URL is reloaded instead of the error page.
Navigation height % Height of the navigation bar as a percentage of the total element height. Valid values: 1–50 %.
The WebView occupies the remaining upper area.

Border
Border See common properties


Authentication

HTML form login: If a website displays a login form (username and password as input fields on the page), the user can enter the credentials directly in the WebView. This works the same way as in a regular browser.

HTTP Basic Authentication: Some devices (e.g. routers or local devices) use HTTP Basic Auth, which normally shows a browser-native authentication dialog. Since this dialog is not supported by the Android WebView, the credentials can be embedded directly in the URL:

http://username:password@192.168.1.1

The app automatically detects the embedded credentials and sends them as an HTTP Authorization header. The page is loaded using the clean URL (without credentials), so JavaScript navigation (e.g. history.replaceState) works correctly.

Note: Embedding credentials in the URL is only suitable for local network devices over HTTP. It is not recommended for external websites over HTTPS.


Behaviour on Android

The WebView is started only after the app has established a connection to the controller.

Back gesture: If the WebView has a browsing history (back navigation is possible), the Android back gesture is used for WebView navigation. Otherwise the app switches to the previous app page.

JavaScript and DOM storage (localStorage): JavaScript and local storage (localStorage) are enabled in the WebView. Web pages that use localStorage or other JavaScript APIs are rendered correctly.

Mixed content: HTTP content can be loaded within an HTTPS page.


See also Common properties of all elements