Android 4.4 WebView中忽略了视口元标记

我有一个在Android和IOS上运行的App / WebApp.我在IOS和Android上将其部署为WebApp和本机PhoneGap应用程序.我使用PhoneGap Build构建本机应用程序.平板电脑用户界面的内部像素宽度为768,可在iPad和iPad Mini上正常工作.对于Nexus(纵向为601px宽)我通过将视口宽度设置为768px并将缩放设置为：

var gViewportScale = (Math.min(window.screen.width,window.screen.height) / window.devicePixelRatio) / 768;

if (gViewportScale >= 1) {
    document.getElementById("viewport").content
        = "width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no";
} else {
    document.getElementById("viewport").content
        = "width=768,initial-scale=" + gViewportScale + ",minimum-scale=" + gViewportScale + ",maximum-scale=" + gViewportScale + ",user-scalable=yes";
}

这模仿了iPad Mini的行为.几个月前,这个工作很好.我认为当我升级到Android 4.4并更改为Chromium时,这可能已经破裂.现在,Android PGB原生App的活动区域比显示器宽. WebApp继续像以前一样在Android Chrome(33.0.1750.136)中正确显示(即它以纵向填充显示宽度).也适用于IOS中的本机App或WebApp.

我已经尝试了几种替代方案和所有当前版本的PGB和附近,因为我可以告诉Android WebView忽略了使用PhoneGap的视口元标记,但没有在Chrome上.它当然看起来像一个Android bug,它可以在一个而不是另一个上运行.

我在PhoneGap支持社区中问过这个问题,到目前为止还没有很好的答案.我以为我会在这里试试.当然,我可以为Nexus提供单独的CSS,但宽度和字体的真正缩放会更好.

最佳答案

你需要设置webView.getSettings().setUseWideViewPort(true);否则WebView将忽略元标记

原文地址：https://www.jb51.cc/android/431038.html