NativeScript:禁用iOS WebView的缩放控件的方法?

问题描述 投票:1回答:2

我试图找出一种方法来阻止用户通过捏合手势和双击来放大和缩小iOS WebView(tns-ios 3.4.1),基本上禁用所有缩放,例如在苹果去之前用过的html元标记让用户决定是否要使用iOS 10及更高版本进行缩放。我找到了android here的解决方案,对于iOS来说它看起来并不是那么简单。

我对这个平台很陌生,目前这可能吗?我发现NS最近从UIWebView切换到WKWebView,我们可以从NativeScript(* with angular)以某种方式使用allowsMagnification属性吗?

ios webview nativescript angular2-nativescript
2个回答
0
投票

不,你将无法使用allowsMagnification。您将扩展到自己的WebView组件版本,以便更新元配置以停止缩放。

更新:

必须修改从{N}核心模块(v5.x)注入的默认视口以禁用缩放,这是它的完成方式。

import { WebView } from 'tns-core-modules/ui/web-view';

declare var WKUserScript, WKUserScriptInjectionTime, WKUserContentController, WKWebViewConfiguration, WKWebView, CGRectZero;

(<any>WebView.prototype).createNativeView = function () {
    const 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


3
投票

我能够从NS 3.3 - 4.1

获取#webview参考,然后为ios和android设置这些属性以修复视图缩放。

let webView: WebView = this.webView.nativeElement;
webView.on(WebView.loadStartedEvent, function (args: LoadEventData) {               
    if (webView.android) {
        webView.android.getSettings().setBuiltInZoomControls(false);
        webView.android.getSettings().setDisplayZoomControls(false);
    } else {
        webView.ios.scrollView.minimumZoomScale = 1.0;
        webView.ios.scrollView.maximumZoomScale = 1.0;
        webView.ios.scalesPageToFit = false;
        webView.ios.scrollView.bounces = false;
    }
});
© www.soinside.com 2019 - 2024. All rights reserved.