Webview zoom

XverhelstX

Well-Known Member
Licensed User
Longtime User
Hey everyone,

This is something I cannot seem to figure out.
I have an image on the web that is 640*480 (h * w in pxl)
In my app I have a webview with size 200*150.

Now I want to zoom out on the webview so that you can see the image.

I can't figure out what this means:

Zoom (In As Boolean) As Boolean

Zooms in or out according to the value of In.
Returns true if zoom has changed.

How do I zoom in or out as in is a boolean?

Please don't say something like use an imageview or something, it's because the image constantly changes.

Thanks!

XverhelstX
 

XverhelstX

Well-Known Member
Licensed User
Longtime User
yes,
But i cannot find on how you zoom out to a certain value...
In the docs it say:
B4X:
according to the value of In.

What is the value of In and how can I change it?


B4X:
If Webview1.Zoom(False) = True Then
      in = 50
      ToastMessageShow(in,True)
   
End If
 
Last edited:
Upvote 0

canalrun

Well-Known Member
Licensed User
Longtime User
yes,
But i cannot find on how you zoom out to a certain value...

I was just trying to solve the same problem. My solution uses agrahm's Reflection Library and the Android Java routines. I am pretty sure the B4A web view is based on the android Java library web view.

In the android library there as a method "getScale" and a method "setInitialScale", see:

WebView | Android Developers

Below is some code I have using these methods with the reflection library.

B4X:
Dim Obj1 As Reflector
Dim s As String
Dim f As Float

Obj1.Target = WvMain
s = Obj1.TypeName
f = Obj1.RunMethod("getScale")

'  wvMain is my WebView

'  elsewhere in the code I have:

Obj1.Target = WvMain
Obj1.RunMethod2("setInitialScale", "200", "java.lang.int")

'  This sets the initial scale to 200%

HTH,
Barry.
 
Upvote 0

canalrun

Well-Known Member
Licensed User
Longtime User
Hey,
Thanks, Canalrun. But does your code zooms in or out?

As I want to zoom out, but I don't know what I should enter as value to zoom out. Haven't played with the reflector lib before.

XverhelstX

What I actually do is save my "get scale" value to a database with the web page address. The next time I load the page from the database I initialize the web view scale to be the previous scale value.

If you are responding to button clicks or such, I think your method is better.

Barry.
 
Upvote 0

KurtS

Member
Licensed User
Longtime User
Thanks canalrun!

It work fine in my program as internal documentation.
I combined it with the size of the devie request:

B4X:
Sub Globals
   Dim Obj1 As Reflector
   Dim WebView1 As WebView

Sub Help
   Dim s As String
   Dim f As Float

   Activity.LoadLayout("Webview")
   WebView1.LoadURL("file:///android_asset/index.htm")
   
   Obj1.Target = WebView1
   s = Obj1.TypeName
   f = Obj1.RunMethod("getScale")
   
    If GetDevicePhysicalSize > 6 Then    ' 7" or bigger tablet
      Obj1.RunMethod2("setInitialScale", "200", "java.lang.int")
   End If
End Sub

Sub GetDevicePhysicalSize As Float
    Dim lv As LayoutValues
    lv = GetDeviceLayoutValues
    Return Sqrt(Power(lv.Height / lv.Scale / 160, 2) + Power(lv.Width / lv.Scale / 160, 2))
End Sub

I love Basic4Android and i appreciate the work of you guys!

I am thankful for any correction of my english, as an german i am still learning every day!
 
Upvote 0

IanMc

Well-Known Member
Licensed User
Longtime User
of course, getting back to basics, if you put the line in your code:
B4X:
   WebView1.ZoomEnabled = True

Which is done by default, you get a couple of really horrible buttons appear but you can use the pinch-in and pinch-out gestures to zoom in and out.

doing:

B4X:
   WebView1.ZoomEnabled = False

removes those horrid buttons, but you can't do the gestures to zoom in and out.
 
Upvote 0

warwound

Expert
Licensed User
Longtime User
On newer versions of android you can hide the zoom buttons and still have pinch zoom enabled.

I can find the methods if you are interested when I'm back on my pc.

Martin.

Sent from my GT-P3110 using Tapatalk 2
 
Upvote 0

warwound

Expert
Licensed User
Longtime User
Available with android API 11 and later is the WebSettings setDisplayZoomControls method.
Not to be confused with the setBuiltInZoomControls method available in API 3 and later.

Sets whether the on screen zoom buttons are displayed. A combination of built in zoom controls enabled and on screen zoom controls disabled allows for pinch to zoom to work without the on screen controls. Only supported on Android API level 11 and later.

B4X:
Sub Process_Globals
End Sub

Sub Globals
   Dim WebView1 As WebView
   Dim WebViewExtras1 As WebViewExtras
End Sub

Sub Activity_Create(FirstTime As Boolean)
   Activity.LoadLayout("Main")
   
   '   after initializing the WebViewExtras object it can be used instead of the WebView
   '   WebViewExtras contains all methods of WebView plus many more
   
   WebViewExtras1.Initialize(WebView1)
   WebViewExtras1.ZoomEnabled=True   '   True is the default setting
   WebViewExtras1.GetSettings.SetDisplayZoomControls(False)
   
   WebViewExtras1.LoadUrl("http://www.kingslynn-forums.co.uk/index.php")
   
End Sub

Sub Activity_Resume
End Sub

Sub Activity_Pause (UserClosed As Boolean)
End Sub

Works on my Galaxy Tab2 running Jelly Bean - pinch zoom works but no zoom controls are displayed.
This is using the new version of WebViewExtras by the way, so far the new version has not been (officially) uploaded to the forum.
Lots of new (untested) features - you might find the 'FindListener' and related methods useful if you want to make your HTML searchable?

Example project and new version of WebViewExtras attached.

Martin.
 

Attachments

  • DisplayZoomControls.zip
    6.9 KB · Views: 592
Last edited:
Upvote 0

Rick Harris

Well-Known Member
Licensed User
Longtime User
Hello Martin,

Where can we find your new Webviewextras library? I tried your DisplayZoomControls example (above), but was (obviously) very disappointed that I can't get it to work. I don't think you should make people pleased with a "dead sparrow" as we say in Holland. Contrary to what is stated, the ZIP does not contain the new library.
 
Upvote 0

warwound

Expert
Licensed User
Longtime User
Hello Martin,

Where can we find your new Webviewextras library? I tried your DisplayZoomControls example (above), but was (obviously) very disappointed that I can't get it to work. I don't think you should make people pleased with a "dead sparrow" as we say in Holland. Contrary to what is stated, the ZIP does not contain the new library.

You can get the newer WebViewExtras here: http://android.martinpearman.co.uk/b4a/temp/WebViewExtras2_20130728.zip.

I seem to remember making an update and am not sure if the update is included in the link.
Can you give it a try and post if it works?

When i'm back on my PC i can make sure the latest version is available.

Martin.
 
Upvote 0

Rick Harris

Well-Known Member
Licensed User
Longtime User
Hello Martin,

Wow, that was a quick response! Thank you very much. Yes your example is working: I can pinch to increase/decrease zoom and fortunately the zoom+ and - buttons do not appear. I am adapting my app for use on a smart watch. The zoom buttons are much to large to fit a 1.5 inch screen... HOWEVER, it does not work in my app. I get a compile error with existing lines of code like: WebViewExtras1.executeJavascript(Webview1, Javascript). This happens when both the WebviewExtras and WebviewExtras2 lib's are selected or just one of these libs. It seems your new lib is not entirely downwards compatible (?)

Can you also maybe help me with another problem that I can't get resolved using Gestures (by Agaham) nor Gesture Detector by Informatix. I want to be able to intercept a horizontal fling (move) event (to either hide the webview or to perform webview.back and forward). All other behaviour of the Webview should remain as normal. Can this somehow be done with your Webviewextra's (2.0)?
 
Last edited:
Upvote 0

warwound

Expert
Licensed User
Longtime User
Rick take a look here: http://www.basic4ppc.com/android/fo...pe-from-panel-over-webview.32611/#post-190677.

Can you and margret can test the new FlingableWebView and post your results?

The new version of WebViewExtras was never intended to be used alongside the old version, and it was never gonna be backwards compatible with the old version either.
I guess that's why i've not made it properly available on the forum - it'd generate a lot of requests for help and i'm lacking the time to provide such help.

The new version can do everything that the old version does and much more, so you can ditch the old version and switch to the new version if you are prepared to update your project.

The old WebViewExtras was a collection of static methods where you passed an instance of a WebView and the static method executed a method on the WebView (that method being a method that is not currently exposed by the b4a WebView).

The new WebViewExtras has an Initialize method which you pass an instance of WebView to and now all WebViewExtras methods are no longer static and require you to pass an instance of the WebView.

Which methods of the old WebViewExtras are you using?
If you need help coverting your project from the old version to the new version i'm happy to help.

Martin.
 
Upvote 0

Rick Harris

Well-Known Member
Licensed User
Longtime User
Hi Martin,

The alfa version of your "Flingable webview" example works excellent! I also replaced the Webview in my App and it does exactly what I wanted. That is really great, thank you very much.
I am sure other developers will also like this. I have found quite a number of B4A forum entries where people have been struggling with the same or similar problem.

Are there any restrictions regarding the use of your FlingableWebview versus a normal Webview? Does it work with all versions of your Webviewextra's? I am asking this specifically because my App vigourously uses Webview1 and Webviewextra's for many tasks.

Pitty that you could not make your new WebviewExtras library compatible with older versions. I do understand why. I think you should give version 2.0 a different name (e.g. "WebViewPlus" ?) in order to avoid confusion (and wrong library selection settings).

So far I was using version 1.30. If you can tell me what code I should use in stead of: WebViewExtras1.executeJavascript(Webview1, Javascript) then please do so.

Anyhow, with your Flingable Webview, I don't really need to upgrade to Webviewextra's 2.0. However, I would still like to disable the zoom+/- buttons on the webview (they are too big for a smartwatch screen). Any suggestions?
 
Last edited:
Upvote 0

warwound

Expert
Licensed User
Longtime User
Great - it works!

The FlingableWebView class extends the WebView class, anywhere you currently pass a WebView as a parameter you can instead pass a FlingableWebView.
A FlingableWebView has all the properties and methods of a WebView plus the additional Fling event.
So there should be no problems passing a FlingableWebView to any of the methods of the older WebViewExtras and you should be able to pass a FlingableWebView to the new WebViewExtras Initialize method.

So yes you can use the FlingableWebView with both old and new versions of WebViewExtras.

Now if you look at my WebViewSettings library you'll see it has a method:

setDisplayZoomControls (webView1 As WebView, Enabled As Boolean)
Sets whether the on screen zoom buttons are displayed.
A combination of built in zoom controls enabled and on screen zoom controls disabled allows for pinch to zoom to work without the on screen controls.
Only supported on Android API level 11 and later.

So you can use the old WebViewExtras, a FlingableWebView and then use WebViewSettings to prevent the display of the zoom controls.
(The new WebViewExtras replaces not just the old WebViewExtras but also WebViewSettings).

If you want to update to the new WebViewExtras and execute javascript then you'd:
  • Initialize the new WebViewExtras with a WebView or FlingableWebView.
  • Use the WebViewExtras method:
    ExecuteJavascript (Javascript As String)
    Executes a string of javascript statements.

Martin.
 
Upvote 0

Rick Harris

Well-Known Member
Licensed User
Longtime User
Hi Martin,
Thank you for your detailed reply. You are truly the best Webview expert in the forum.
Your answer coincides with my further explorations in the forum to find a way to hide the zoom buttons because I already found your WebViewSettings library. For some reason it works in your Flingable webview example, but not in my App. The zoom buttons keep re-appearing... I will investigate further.
 
Upvote 0
Top