4

我正在寻找与新的 4.4+ Android Webview 相关的视口问题的解决方案。

详细来说，问题是在新的 4.4+ Android webview 中，view port 没有被正确处理，或者可能被忽略，导致内容没有正确填充设备宽度。

如何复制： 

<html>
<head>
   <meta name="viewport" content="width=320">  
    <body style="margin:0px;">   
        <div style="width:320px; height:300px; background-color:purple;"> 
            <div style="background-color:rgba(110,110,110,0.7);">
                This box is 320px wide.
            </div>        
        </div>  
    </body>  
</html>

在设备上查看时，上面的页面不应该绘制一个覆盖任何屏幕整个宽度的紫色框吗？

这是一个图形演示：

上面编码的 html 页面，通过应用程序显示一个简单的 320 像素框： https ://drive.google.com/file/d/0B2beYh8CaQEUTEREdFNaRFZvbHc/edit?usp=sharing

上面显示的相同 html 页面，在同一设备上，在 chrome 上显示： https ://drive.google.com/file/d/0B2beYh8CaQEUamoyNmZzVjA5WWc/edit?usp=sharing

所以第一个问题，为什么我的视口元标记在应用程序中被忽略了？

我尝试更改以下内容： this.appView.getSettings().setUseWideViewPort(true); this.appView.getSettings().setLoadWithOverviewMode(true);

仍然没有运气

我见过以下线程： Android 4.4 中的 WebView 和初始规模的 Android-- PhoneGap/WebView 忽略视口元标记？

仍然需要帮助:(

4

1 回答 1

0

尽管文档不再提及它，但如果将 viewport 标签设置为 320px，多个 android 设备上的默认浏览器会忽略它，而只使用“设备宽度”。没有办法覆盖，唯一的建议是将视口设置为 321px，尽管这不是最优雅的解决方案。请参阅这篇较早的帖子： galaxy S3 .. viewport 元标记不起作用

于 2014-03-03T15:49:55.850 回答