WebViewTools Extension for App Inventor



WebView Tools is an extension which provides a range of methods for adjusting settings for a WebViewer component in App Inventor. With 25 different blocks available this post won't document every block in the extension, however, it will document the most popular blocks and the ways you could use them in your mobile apps.


Extension Usage

SetWebViewer

Before you use any of the methods in this extension you first must use the "SetWebViewer" block, this sets the WebViewer in the extension and will be the WebViewer that the extension will apply settings to.

RemoveWebViewer

When you are finished applying settings to a WebViewer you can use the RemoveWebViewer method to disassociate the WebViewer from the extension, this will also disassociate the WebViewer from the "OnPageFinished" event, if working with multiple WebViewers if you don't remove the WebViewer the "OnPageFinished" event will fire for all WebViewers.

Methods

SetUserAgentString

This method allows you to set the user agent string for the WebViewer to use when loading websites, this can be useful if you need to stop websites detecting whether the device is a mobile device or not.

SetBuiltInZoomControls

This method allows you to disable a WebViews built-in zoom mechanisms, note this will not disable the zoom controls in the WebView, but it will disable zoom gestures such as pinch to zoom.

SetAppCacheEnabled

This method can be extremely useful if you are building web-based mobile apps, if your mobile website makes use of HTML5's AppCache then you can use this block to enable AppCache in the WebView enabling your users to view your app even when offline.

RunJavaScript

This method allows you to execute JavaScript in the current Web Viewer.


SetOverrideURLChange

Sets whether the URL should be checked prior to loading, enabling this will stop the page from loading if it does not contain the specified URL in the destination URL.

OnPageFinished

This event can be used to detect page changes in your applications, the event fires each time a page finishes loading, note if you are using this extension with multiple WebViewers this event will still fire if you set the current WebViewer to a different WebViewer in your app, you need to use the "RemoveWebViewer" block to disassociate the WebViewer from the event.

OnJavaScriptOutput

This event can be used to get the output after executing some JavaScript using the "RunJavaScript" block, note that this event will not fire on versions of Android prior to KitKat.

Example

In the following example, I cover a couple of the methods you can use, not all of the methods are easy to demonstrate and there are too many methods to cover in an example but this will cover at least a few of the different methods available in this extension.

The following example allows you to play with a couple of the different methods by using buttons to either enable or disable functionality. When you set the WebViewer, you get an alert when a page finished loading, you can disable zoom gestures in the WebView and get the User-agent string.

All the blocks used in this example, click the image to see a bigger version.




Download Here

Download the WebViewTools extension here: WebViewTools.aix
Download the WebViewTools Example project here: WebViewToolsExample.aia

Limitations

-While it is possible to disable zoom gestures in this extension all of the methods I tried to use to disable the onscreen zoom controls didn't work. There doesn't look like there's a good way to achieve this at this time.

Version History

Version 4

-Added "SetOverrideURLChange"
-Added "SetSupportMultipleWindows"

Version 3

-Added RunJavaScript
-Added OnJavaScriptOutput

Version 2

-Added "OnPageFinished" event
-Added "RemoveWebViewer"
-Removed "SetAppCachePath" - Now internally set to the app's default internal cache directory.
-Removed "SetDisplayZoomControls" - In testing, this method made no difference to showing or hiding onscreen zoom controls.

Version 1

-Added "SetUserAgentString"
-Added "SetWebViewer"
-Added "GetUserAgentString"
-Added "SetBuiltInZoomControls"
-Added "SetJavascriptEnabled"
-Added "SetAppCacheEnabled"
-Added "SetAppCachePath"
-Added "SetDatabaseEnabled"
-Added "SetTextZoom"
-Added "SetGeolocationEnabled"
-Added "SetInitialScale"
-Added "SetLoadWithOverviewMode"
-Added "SetBlockNetworkImage"
-Added "SetBlockNetworkLoads"
-Added "SetAllowFileAccess"
-Added "SetCacheMode"
-Added "SetJavascriptCanOpenWindowsAutomatically"






Icons made by Freepik from www.flaticon.com is licensed by CC 3.0 BY

Was this helpful?

Yes No

Thunkable Components