CODEWITHSUNDEEP
ioswebviewxamarin.iosxamarin.forms
Sonali
Sonali

Reputation: 2283

Hybrid Webview IOS stop zooming

I am building an app using Xamarin Forms, in this I have implemented a hybrid webview. In IOS, hybrid web view is having zoom feature which I need to disaBLE it.

Here is what I tried so far:-

  public class ActivityHybridWebViewRenderer : ViewRenderer<ActivityHybridWebView, WKWebView>, IWKScriptMessageHandler
    {
        const string JavaScriptFunction = "function invokeCSharpAction(data){window.webkit.messageHandlers.invokeAction.postMessage(data);}";
        WKUserContentController userController;

        protected override void OnElementChanged(ElementChangedEventArgs<ActivityHybridWebView> e)
        {
            base.OnElementChanged(e);

            if (Control == null)
            {
                userController = new WKUserContentController();
                var script = new WKUserScript(new NSString(JavaScriptFunction), WKUserScriptInjectionTime.AtDocumentEnd, false);
                userController.AddUserScript(script);
                userController.AddScriptMessageHandler(this, "invokeAction");
                var config = new WKWebViewConfiguration { UserContentController = userController };
                var webView = new WKWebView(Frame, config);
                webView.ScrollView.MultipleTouchEnabled = false;
                webView.ScrollView.Bounces = false;
                SetNativeControl(webView);
            }
            if (e.OldElement != null)
            {
                Control.ScrollView.MultipleTouchEnabled = false;
                Control.ScrollView.Bounces = false;
                userController.RemoveAllUserScripts();
                userController.RemoveScriptMessageHandler("invokeAction");
                var hybridWebView = e.OldElement as ActivityHybridWebView;
                hybridWebView.Cleanup();
            }
            if (e.NewElement != null)
            {
                string localpath = Environment.GetFolderPath(Environment.SpecialFolder.Personal);
                string url = Path.Combine(localpath, Element.Uri);
                Control.LoadFileUrl(new NSUrl("file://" + url), new NSUrl("file://" + Path.GetDirectoryName(url)));
                Task.Run(() =>
                {
                    Task.WaitAny(Task.Delay(2000));
                    InjectJS(JavaScriptFunction);
                    CallJS();
                });

            }
        }

These two lines seems to have no effect-

Control.ScrollView.MultipleTouchEnabled = false;
Control.ScrollView.Bounces = false;

webView.ScrollView.MultipleTouchEnabled = false;
webView.MultipleTouchEnabled = false;

Upvotes: 2

Views: 1713

Answers (2)

TouchBoarder
TouchBoarder

Reputation: 6492

Xamarin: Disable zoom in iOS WKWebView

var source = "var meta = document.createElement('meta');" +
"meta.name = 'viewport';" +
"meta.content = 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no';" +
"var head = document.getElementsByTagName('head')[0];" + "head.appendChild(meta);";

var script = new WKUserScript(new NSString(source), WKUserScriptInjectionTime.AtDocumentEnd, true);

wkWebView.Configuration.UserContentController.AddUserScript(script);

source: https://stackoverflow.com/a/41741125/546054

Upvotes: 0

hamalaiv
hamalaiv

Reputation: 868

Can you change the website code? If yes, you could disable zooming there by adding the following tag inside html head:

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

Upvotes: 2

Related Questions