NativeScript: How do I disable zoom controls in WebView?

Question

I found the way to enable/disable zoom controls in Android WebView from following question.

How to remove zoom buttons on Android webview?

I'm using NativeScript and I don't see similar method in NativeScript WebView. Is there any way I can access the methods of Android WebView from NativeScript? Or, is there any other way?

Thanks.

score 11 · Accepted Answer · answered Apr 25 '16 at 06:47

11

You can get hold of the actual android trough the android property of your WebView. So you can probably use something like that in the loaded event:

var webView = page.getViewById("webViewID");
if(webView.android) { // in IOS android will be undefined
  webView.android.getSettings().setBuiltInZoomControls(false);
}

answered Apr 25 '16 at 06:47

Alexander Vakrilov

1,131
7
12

1

I've tried that before and didn't work. I though I did wrong and your answer encourage me to try again. Now it's working after putting that code in loadStarted event of WebView. Thanks. – Ei Maung Apr 25 '16 at 08:26
but how can i get page reference in angular – Pratik Sanyaja Feb 23 '18 at 14:08
How to just hide the buttons only while keeping the pinch to zoom enabled? – Robert Williams Sep 19 '18 at 15:08
Anyone know how can I get `page` in {N}-Vue ? it turns out `ReferenceError: page is not defined` – vanngoh Oct 07 '18 at 11:16

score 11 · Answer 2 · answered Nov 11 '18 at 16:41

11

Just add this meta tag to header of your html

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">

answered Nov 11 '18 at 16:41

Azamat Mirvosiqov

646
8
12

score 5 · Answer 3 · answered Mar 13 '18 at 16:43

In NS + Angular:

import { WebView, LoadEventData } from "ui/web-view";
...
//Get the element ref from the view #webView
@ViewChild("webView") webView: ElementRef;  
...
//Get the real object type casted
let webview: WebView = this.webView.nativeElement; 
if(webview.android) {
    webview.android.getSettings().setBuiltInZoomControls(false);
}

NativeScript: How do I disable zoom controls in WebView?

3 Answers3

Linked