4

SO和互联网上的其他地方有数百篇关于尝试修复Android中的视口缩放的帖子，我现在相当确定你不能在Android 4.1的webview中设置初始比例。

我正在构建一个 Cordova (Phonegap) 应用程序，我已经在 iPhone 3GS、4S 和 5 以及 iPad 2 上很好地扩展了所有东西，在 iOS6 上运行 iOS7 和 3GS

我还调整了 UI 以适应运行 Android 4.4 的 Moto G、LG Nexus 5、Google Nexus 5 和三星 Galaxy S4

但在运行 Android 4.1 的三星 Galaxy S2 和 S3 Mini 上，我无法设置初始比例。

HTML 视口元标记不适用于 4.1 或 4.4（适用于 Chrome，不适用于 WebView 或默认浏览器）：

<meta name="viewport" content="user-scalable=no, initial-scale=0.5, width=device-width, height=device-height, target-densitydpi=device-dpi" />

我已经从 cli 中敲出了一个绝对基本的 Cordova 项目cordova create basicProject，如果我在主 Activity 的 onCreate 方法中添加一些 Java，特别是该setInitialScale方法：

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    super.init();
    // Set by <content src="index.html" /> in config.xml
    super.loadUrl(Config.getStartUrl());
    //super.loadUrl("file:///android_asset/www/index.html");

    this.appView.setInitialScale( 50  );

}

然后我按预期获得了 4.4 缩放的 Moto G：

Android 4.4 上的 Moto G，初始比例为 0.5，通过 setInitialScale(50)

但在 Galaxy S2 上运行的完全相同的项目没有得到扩展。

Android 4.1 上的 Galaxy S2，初始比例为 0.5，通过 setInitialScale(50)

我仅限于在带有 4.1 的三星设备或 4.4 上的一系列设备上进行测试，所以如果有人可以在 4.2 或 4.3 上测试相同的东西，或者在 4.1 上没有三星的任何人，那将很有帮助。

有谁知道如何让Android 4.1服从setInitialScale()

4

2 回答 2

8

您应该能够在您的网页中添加一些 javascript，这些 javascript 将在您的 webview 拾取时缩放内容。这是一个示例，它将缩放您的 html 内容，以使内容适合屏幕的可用宽度：

function customScaleThisScreen() 
    var contentWidth = document.body.scrollWidth, 
        windowWidth = window.innerWidth, 
        newScale = windowWidth / contentWidth;
    document.body.style.zoom = newScale;
}

这将适用于较旧的（4.2 之前）和较新的基于铬的（4.2+）网络视图。

HTH

于 2014-07-09T15:11:13.773 回答
1

@Petey 向我展示了解决方案，但为了完整起见，这是我的版本，带有更多的 phonegap 上下文：

var app = {
    initialize: function() {
        this.bindEvents();
    },
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },
    onDeviceReady: function() {

        // PETEY'S SOLUTION, WRAPPED IN CODE TO CHECK FOR ANDROID PRE 4.2
        // ALSO MODIFIED TO USE DEVICE PIXEL RATIO, INSTEAD OF CONTENTWIDTH
        if( isAndroid() ) {
            var matches = device.version.match( /[0-9]+(\.[0-9]+)?/i );

            if( matches.length && parseFloat( matches[ 0 ] ) < 4.2 ) {
                document.body.style.zoom = 1 / window.devicePixelRatio;
            }
        }

        // start app logic

    }
};

app.initialize();

function isAndroid() {
    if( device.platform.match( /android/i ) ) {    
        return true;
    }

    return false;
}
于 2014-07-16T07:09:19.087 回答