Android WebView似乎忽略了网页上的“视口”信息

我有一个使用视口META标签的网站告诉移动浏览器如何显示内容()。 在Android浏览器中查看页面看起来是正确的(和iPhone等)。

当我将页面加载到android应用程序中的WebView组件中时,WebView将忽略“VIEWPORT”标记,并以“完整”分辨率呈现页面,在此情况下将放大该分辨率。

仔细检查您的实施对照WebView文档的“构build网页以支持不同的屏幕密度”部分: http : //developer.android.com/reference/android/webkit/WebView.html

经过大量的实验,我已经确定,如果实际页面的宽度比视口设置更宽,那么Android WebView将不会遵守“视口”设置。

例如,我设置了一个500像素的视口,但在我的页面上有一个强制960像素宽的元素。 因为WebView拒绝隐藏额外的内容,所以视口不被遵守。

当我打字时,这似乎很明显,但我必须花费数天的时间来解决这个问题。

正如文档中的最佳答案中的链接所说,您可以指定使用元标记设备应如何反应您的networking应用程序的大小相比,屏幕。 以下代码使得Android手机尊重我的networking应用程序的视口大小:

 <meta name="viewport" content="target-densitydpi=high-dpi" /> 

尝试使用这种WebSetting类的方法

 setUseWideViewPort (boolean use) 

我使用这个来告诉Android的webview来考虑我的“视口”标签

另一个在某些Android手机上实施失败的事实是,例如HTC Desire HD将忽略视口TAG – user-scale = no complete。

我只能确认你的问题。 在android问题跟踪器有一个开放的问题 。 如果你受到这个影响,请给它一个投票/明星。

链接在接受的答案, 这将有助于了解Android上的视口。

在我的情况下,使用固定宽度,解决scheme是:

 settings.setUseWideViewPort(true) settings.setLoadWithOverviewMode(true) 

用这个:

  <meta name="viewport" content="width=320, user-scalable=no, target-densitydpi=low-dpi" /> 

现在,Android WebView和浏览器将遵守视口设置。

唷,这需要很多调整才能正确。 天啊。