Android--PhoneGap/WebView 忽略视口元标记? [英] Android-- PhoneGap/WebView ignores viewport meta tags?
问题描述
我有一个网页，我正在尝试使用 PhoneGap(它使用设置为appview"的普通 WebView)在我的 Android 设备上显示(从项目的资产目录加载)，但 webview 完全忽略了以下:
I have a webpage that I'm trying to display on my Android device (loaded from the assets directory of the project) using PhoneGap (which uses a normal WebView set as the "appview"), but the webview completely ignores the following:
<meta name = "viewport" content = "user-scalable=no,width=device-width" />
无论我在这一行中设置了什么(我已经尝试明确设置缩放比例、以像素为单位设置宽度/高度等)，设备都会完全忽略它并将网站呈现得非常小并固定在左上角- 屏幕的手角.我可以使用捏合手势放大(即使我在上面的 html 代码中明确禁用缩放)，但我希望页面被放大以在加载时正确适应设备.
No matter what I set in this line (I've tried explicitly setting the zoom, setting the width/height in pixels, etc.), the device completely ignores it and renders the website very small and anchored to the upper left-hand corner of the screen. I can zoom in using the pinch gesture (even if I explicitly disable zoom in the html code above), but I want the page to be zoomed-in to properly fit the device on load.
有趣的是...如果我将完全相同的站点放在我的 Web 服务器上并使用我的测试设备上的默认浏览器导航到它，页面会正确加载(缩放到适合设备的大小).
Here's the interesting bit... If I put the exact same site on my web server and navigate to it using the default browser on my test device, the page loads properly (scaled to the right size for the device).
请帮忙.
谢谢.
我当前的设置是:
<meta name="viewport" content="width=device-width,height=device-height,user-scalable=no,target-densitydpi=device-dpi,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
这也被完全忽略了.
这里有一些有趣的东西...
Here's something interesting...
<meta name="viewport" content="width=device-width, initial-scale=2.0, maximum-scale=2.0, user-scalable=no" />
以上行在模拟器中将页面缩放到 2 倍，但在我的设备上没有任何改变(运行 2.2.1 的三星 Epic).尽管如此，即使是 2x，页面也没有被缩放到模拟器的宽度......我必须将其设置为initial-scale=2.5"之类的内容.
The above line scales the page to 2x in the emulator yet changes nothing on my device (Samsung Epic running 2.2.1). Still though, even at 2x, the page is not being scaled to the emulator's width... I'd have to set that to something like "initial-scale=2.5".
推荐答案
尝试在扩展 DroidGap 的 Java 类的 onCreate() 方法中添加以下两行.
Try adding the following two lines in the onCreate() method of the Java class that extends DroidGap.
this.appView.getSettings().setUseWideViewPort(true);
this.appView.getSettings().setLoadWithOverviewMode(true);
如果您的视口标签现在开始工作，请告诉我.
Let me know if your viewport tag now begins to work.
这篇关于Android--PhoneGap/WebView 忽略视口元标记?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
