CODEWITHSUNDEEP
javascriptiosnativescriptzoomingpinchzoom
Batmanbury
Batmanbury

Reputation: 349

How to disable iOS pinch zoom and double tap zoom in Nativescript and plain JS

I've been unsuccessful in disabling zooming on iOS for a Nativescript web app written in plain JS. There seem to be TypeScript solutions for this, but I haven't been able to implement the same strategy in JS.

(1) Something like this, but in plain JS: https://stackoverflow.com/a/48824238/3340040

NativeScript has a way of subclassing Objective-C classes, and exposing methods: https://docs.nativescript.org/core-concepts/ios-runtime/how-to/ObjC-Subclassing#calling-base-methods-Exposed

...Which seems like it could work by extending the UIViewController (2): https://stackoverflow.com/a/51229156/3340040

...But I'm stuck on how delegates are involved.

I feel like either of these two strategies should work, but for (1) I'm not sure how to convert all those declare var classes to JS that TS somehow gets for free. And strategy (2), I'm just out of my element.

Any NativeScripters out there?

Upvotes: 3

Views: 810

Answers (1)

Manoj
Manoj

Reputation: 21908

You just have to remove the typings from the original code then it's all just JavaScript.

let WebView = require("tns-core-modules/ui/web-view").WebView;

WebView.prototype.createNativeView = function () {
    let jScript = `var meta = document.createElement('meta');
    meta.setAttribute('name', 'viewport');
    meta.setAttribute('content', 'initial-scale=1.0 maximum-scale=1.0');
    document.getElementsByTagName('head')[0].appendChild(meta);`;
    const wkUScript = WKUserScript.alloc().initWithSourceInjectionTimeForMainFrameOnly(jScript, WKUserScriptInjectionTime.AtDocumentEnd, true);
    const wkUController = WKUserContentController.new();
    wkUController.addUserScript(wkUScript);
    const configuration = WKWebViewConfiguration.new();
    configuration.userContentController = wkUController;
    configuration.preferences.setValueForKey(
        true,
        "allowFileAccessFromFileURLs"
    );
    return new WKWebView({
        frame: CGRectZero,
        configuration: configuration
    });
};

Playground Sample

Note: Remember to add platform check, the app will break if you run this iOS specific code on Android.

Upvotes: 3

Related Questions