B4A Library WebViewExtras

Hi all.

WebViewExtras is my latest library.
It's a much updated version of JSInterface.

WebViewExtras exposes more of the available native Android WebView methods to your B4A application:

addJavascriptInterface(webView1 As WebView, interfaceName As String)

Add a javascript interface to webView1, methods of the interface can be accessed using javascript with the interfaceName as the javascript namespace.

The interface contains just a single overloaded method CallSub().
The CallSub method signatures are:

CallSub(subName As String, callUIThread As boolean)
CallSub(subName As String, callUIThread As boolean, parameter1 As String)
CallSub(subName As String, callUIThread As boolean, parameter1 As String, parameter2 As String)
CallSub(subName As String, callUIThread As boolean, parameter1 As String, parameter2 As String, parameter3 As String)


So if you have added the interface to your webView with the interfaceName of "B4A" then you can write javascript such as:

B4X:
B4A.CallSub('MySubName', true)

The callUIThread parameter is an important update - it's not available with JSInterface.

Does the Sub called by your javascript modify your activity UI?
If the answer is yes then you need to pass boolean true as callUIThread otherwise you can pass false.
If you pass false and then the Sub tries to modify your activity UI you will get an exception.

Does your javascript require a return value from your Sub?
If the answer is yes then the Sub MUST NOT modify the activity UI.
If CallSub is excuted with callUIThread set to true then no values will be returned from your Sub to the javascript.

You will need to structure your B4A code so that Subs that return values to javascript do not modify the activity UI.

addWebChromeClient(webView1 As WebView, EventName As String)

Add a WebChromeClient to webView1.

The default B4A WebView has no WebChromeClient.
A WebChromeClient handles many things, the WebChromeClient that WebViewExtras adds to your WebView enables:

Version 1.30 of WebViewExtras requires that an additional EventName parameter is passed to the addWebChromeClient method, see this post: http://www.b4x.com/forum/additional-libraries-official-updates/12453-webviewextras-2.html#post102448

clearCache(webView1 As WebView, includeDiskFiles As boolean)

Clear the WebView cache.
Note that the cache is per-application, so this will clear the cache for all WebViews used in an application.

boolean includeDiskFiles - If false, only the RAM cache is cleared.

executeJavascript(webView1 As WebView, javascriptStatement As String)

Executes a string of one or more javascript statements in webView1.
javascriptStatement - A string of one or more (semi-colon seperated) javascript statements.

flingScroll(webView1 As WebView, vx As Int, vy As Int)

flingScroll is a poorly documented method of the WebView.
It's included in WebViewExtras as it may be useful but i can find no documentation for it or it's parameters.

vx and vy do not seem to be pixel values - i suspect they are velocity values for the kinetic/fling scroll.

pageDown(webView1 As WebView, scrollToBottom As boolean)

Scroll the contents of webView1 down by half the page size.

scrollToBottom - If true then webView1 will be scrolled to the bottom of the page.

Returns a Boolean value to indicate the success or failure of the scroll.

pageUp(webView1 As WebView, scrollToTop As boolean)

Scroll the contents of webView1 up by half the page size.

scrollToTop - If true then webView1 will be scrolled to the top of the page.

Returns a Boolean value to indicate the success or failure of the scroll.

zoomIn(webView1 As WebView)

Perform zoom in on webView1.

Returns a Boolean value to indicate the success or failure of the zoom.

zoomOut(webView1 As WebView)

Perform zoom out on webView1.

Returns a Boolean value to indicate the success or failure of the zoom.

Up to date documentation/reference for this library can be found here: http://www.b4x.com/forum/additional-libraries-official-updates/12453-webviewextras-3.html#post106486.

Library and demo code is attached to this post.

The demo is a bit brief - sorry but i don't have time to write demo code for all the new methods.
The demo displays two WebViews - the top WebView has a JavascriptInterface and WebChromeClient whereas the lower WebView has neither - it is the default B4A WebView.

Martin.

Edit by Erel:
- There is a security issue related to AddJavascriptInterface in older versions of Android. See this link: https://www.b4x.com/android/forum/t...ascriptinterface-vulnerability.85032/#content
- v2.20 is attached. This is the latest version.
 

Attachments

  • WebViewExtras_v1_42.zip
    7.8 KB · Views: 9,532
  • v2.20.zip
    41.1 KB · Views: 854
Last edited by a moderator:

warwound

Expert
Licensed User
Longtime User
I have created some up to date documentation/reference for WebViewExtras, i'll be keeping this post updated as the library is updated.

WebViewExtras
Version: 1.4
  • WebViewExtras
    Events:
    • GeolocationPermissionsRequest As Int
    • ProgressChanged (NewProgress As Int)
    Fields:
    • GEOLOCATION_PERMISSION_ALLOW As Int
    • GEOLOCATION_PERMISSION_ALLOW_AND_REMEMBER As Int
    • GEOLOCATION_PERMISSION_DISALLOW As Int
    • GEOLOCATION_PERMISSION_DISALLOW_AND_REMEMBER As Int
    Methods:
    • GetContentHeight (WebView1 As WebView) As Int
      Gets the height of the HTML content.
    • GetScale (WebView1 As WebView) As Float
      Get the WebView scale.
      This method was deprecated in API level 17.
      This method is prone to inaccuracy due to race conditions between the web rendering and UI threads; prefer onScaleChanged(WebView, float, float).
    • addJavascriptInterface (WebView1 As WebView, InterfaceName As String)
      Add a javascript interface to WebView1, methods of the interface can be accessed using javascript with the InterfaceName as the javascript namespace.

      WebView1 - The WebView to add the interface to.
      InterfaceName - The javascript namespace (prefix) that will be used to access the interface methods.
    • addWebChromeClient (WebView1 As WebView, EventName As String)
      Add a WebChromeClient to WebView1.
      The WebChromeClient will handle console logging and javascript modal dialogs.
      It also overrides the default onExceededDatabaseQuota method, which enables the WebView to create and use the Database Storage API.

      WebView1 - The WebView to add the WebChromeClient to.
    • clearCache (WebView1 As WebView, IncludeDiskFiles As Boolean)
      Clear the WebView cache.
      Note that the cache is per-application, so this will clear the cache for all WebViews used in an application.

      WebView1 - A WebView in your application.
      IncludeDiskFiles - If false, only the RAM cache is cleared.
    • executeJavascript (WebView1 As WebView, JavascriptStatement As String)
      Executes a string of one or more javascript statements in WebView1.

      WebView1 - The WebView to execute the javascript in.
      JavascriptStatement - A string of one or more (semi-colon seperated) javascript statements.
    • flingScroll (webView1 As WebView, vx As Int, vy As Int)
      flingScroll is a poorly documented method of the WebView.
      It's included in WebViewExtras as it may be useful but i can find no documentation for it or it's parameters.

      webView1 - The WebView to flingScroll.
      vx - No documentation available.
      vy - No documentation available.
    • pageDown (webView1 As WebView, scrollToBottom As Boolean) As Boolean
      Scroll the contents of webView1 down by half the page size.

      webView1 - The WebView to scroll.
      scrollToBottom - If true then webView1 will be scrolled to the bottom of the page.

      Returns a boolean value to indicate the success or failure of the scroll.
    • pageUp (webView1 As WebView, scrollToTop As Boolean) As Boolean
      Scroll the contents of webView1 up by half the page size.

      webView1 - The WebView to scroll.
      scrollToTop - If true then webView1 will be scrolled to the top of the page.

      Returns a boolean value to indicate the success or failure of the scroll.
    • zoomIn (webView1 As WebView) As Boolean
      Perform zoom in on webView1.

      webView1 - The WebView to zoom in on.

      Returns a boolean value to indicate the success or failure of the zoom.
    • zoomOut (webView1 As WebView) As Boolean
      Perform zoom out on webView1.

      webView1 - The WebView to zoom out on.

      Returns a boolean value to indicate the success or failure of the zoom.

Martin.
 
Last edited:

SemiKolon

Member
Licensed User
Longtime User
Everything is working great for me, but I search a way to hide the scroll bar on the right side. Is this possible I would like to only see my webpage.

My code so far:

Sub Activity_Create(FirstTime As Boolean)
Activity.LoadLayout("layoutMain")

WebView2.Top=0
WebView2.Height=100%y
WebView2.Width=100%x
WebView2.LoadUrl("file:///android_asset/index.htm")
End Sub

Thanks in advance :)

Edit:
Okay i figured it out

Dim r As Reflector
r.Target = WebView2
r.RunMethod2("setVerticalScrollBarEnabled", False, "java.lang.boolean")
 
Last edited:

johnaaronrose

Active Member
Licensed User
Longtime User
Where is lib in zip

I understand that this lib is required for klaus' GPS Example. I've downloaded the .zip file & extracted the files. But I don't see any .jar or .xml file to install in additional libraries. What do I do?
:sign0104:
 

bluedude

Well-Known Member
Licensed User
Longtime User
Does this also work with LoadURL?

Hi,

Does this only work for local HTML files loaded with LoadHTML? Or can it also works with remote URL's?

Cheers,
 

warwound

Expert
Licensed User
Longtime User
All methods of WebViewExtras apply to the WebView that you applied them to.
There should be no distinction between local and remote web pages.

Having said that the B4A WebView method CaptureBitmap seems to only work with internet loaded pages.

Are you having problems applying WebViewExtras while displaying a local (device based) web page?

Martin.
 

wm.chatman

Well-Known Member
Licensed User
Longtime User
Hello warwound

I am using your WebViewExtrasDemo methods. And I have a few Questions.

Update:

I been reading and learning your WebViewDemo code. And have not come further on with this matter, not yet.

Here I am asking you for some help on this please.

These four things I would like to get working.

1. How can I load webView1 to fit full screen ?
2. change between the WebView1 and WebView2 ? (Like Toogle between the to sites back and forth)
3. using the backButton on SamsungTab2 10.1 kills the app !
4. how can I change this behavior, and stay on site ?

Thank you so much for your help warwound

Best regards to you,
William
 

Attachments

  • Screenshot_2012-10-08-20-30-08.png
    Screenshot_2012-10-08-20-30-08.png
    28.4 KB · Views: 541
Last edited:

wm.chatman

Well-Known Member
Licensed User
Longtime User
WebView Help

Hey,

Update to subject. :sign0104: still unable to get this ball rolling, been reading, testing, and can't get to the other side with the ball. I'am Searching for players to help. Any Players out there ? ;-)

Thank's to the Team.

Best regards,
William
 
Last edited:

Informatix

Expert
Licensed User
Longtime User
flingScroll (webView1 As WebView, vx As Int, vy As Int)
flingScroll is a poorly documented method of the WebView.
It's included in WebViewExtras as it may be useful but i can find no documentation for it or it's parameters.

webView1 - The WebView to flingScroll.
vx - No documentation available.
vy - No documentation available.

vx: velocity (speed of scrolling) on the x axis
vy: ..... on the y axis

This method initiates a fast scrolling up or down. My library Gesture Detector provides the right values to pass to this method (in the onFling event).
 

warwound

Expert
Licensed User
Longtime User
vx: velocity (speed of scrolling) on the x axis
vy: ..... on the y axis

This method initiates a fast scrolling up or down. My library Gesture Detector provides the right values to pass to this method (in the onFling event).

Thanks.
I'll add that to the documentation when i next update the library.

@William:

1) You treat a WebView as any other View, to make it full screen depends whether you're creating the WebView in code or using the Designer.

In code you can do:

B4X:
Activity.AddView(MyWebView, 0, 0, 100%x, 100%y)

That'll make you WebView full screen.

In designer you'd need to use the Designer Scripts tab to set the properties:

B4X:
MyWebView.Top=0
MyWebView.Left=0
MyWebView.Width=100%x
MyWebView.Height=100%y

2) Have you created 2 WebViews and want to toggle between them, or are you hoping to use the device Back key to return to the last site visited just like a standard browser Back button?

Look at the WebView Back method.

3) and 4) You need to detect the Back key and either call the WebView Back method or allow the app to exit/return to previous activity.
Look here: http://www.b4x.com/forum/basic4andr...16720-detecting-home-back-keys.html#post95549.

Martin.
 

wm.chatman

Well-Known Member
Licensed User
Longtime User
Hello warwound

Thanks a bundle for your help. I am, working on this and let you know somthing later. By the time I get off the two Job's, and took care of Businnes, there are little time left.

I am using the GeoLocationDemo.

Thank you.

Best regards
William
 

Attachments

  • GeolocationDemo.zip
    323.3 KB · Views: 1,296
Last edited:

wm.chatman

Well-Known Member
Licensed User
Longtime User
A Question you had ask me:
Have you created 2 WebViews and want to toggle between them, or are you hoping to use the device Back key to return to the last site visited just like a standard browser Back button?

I would like to toogle between the two sites, to keep a eye on things.
 
Last edited:

Toley

Active Member
Licensed User
Longtime User
Hi Martin,

I would like to host a website on a tablet which is connected to my local network. I also have a NoIP account so I can redirect any outcomming request to the tablet.

I've try your example but I always get "Access Error: 404 -- Not Found" message. Do you have a new version of the example or explain me how tu correctly use it ?

Thank you very much for your time.

Sorry my post should have been post here : http://www.b4x.com/forum/basic4android-updates-questions/13683-simple-web-server-2.html
 
Last edited:

warwound

Expert
Licensed User
Longtime User
Hi Martin,

I would like to host a website on a tablet which is connected to my local network. I also have a NoIP account so I can redirect any outcomming request to the tablet.

I've try your example but I always get "Access Error: 404 -- Not Found" message. Do you have a new version of the example or explain me how tu correctly use it ?

Thank you very much for your time.

Sorry my post should have been post here : http://www.b4x.com/forum/basic4android-updates-questions/13683-simple-web-server-2.html

I've posted a reply in the simple webserver thread: http://www.b4x.com/forum/basic4android-updates-questions/13683-simple-web-server-2.html#post130608

Martin.
 

NeoTechni

Well-Known Member
Licensed User
Longtime User
I'm having problems with it. I'm trying to get it to scroll to the bottom right after the page is loaded. It will, but then it scrolls right back to the top and refuses to scroll again.
 

warwound

Expert
Licensed User
Longtime User
What exactly have you tried so far?

Are you waiting for the WebView PageFinished event and then trying to set the webpage's scroll position?

What device(s) and Android API level(s) have you tested on?
The WebView is a particularly buggy View (IMO) and different API levels have their own bugs.

Martin.
 

NeoTechni

Well-Known Member
Licensed User
Longtime User

warwound

Expert
Licensed User
Longtime User
Can you upload your code?

Can you try on different API levels - 2.3 definitely has a buggy WebView.

Martin.
 

warwound

Expert
Licensed User
Longtime User
WebViewExtras updated to version 1.35

This update adds no extra functionality, it simply changes the way that the WebChromeConsole logs messages from the WebView.
The update should ensure that devices with Android version 4.1+ display these log messages when connected using the B4A Bridge.

Version 1.35 is attached to the first post in this thread.

Martin.
 
Top