Android webview视口 - 无效

时间:2011-11-01 07:33:04

标签: android cordova android-webview viewport

我正在通过wing的eclipse通过phonegap编写这个应用程序。

我已经声明了一个视口元标记:

<meta name="viewport" content="width=600" />

根据文档,这应该使手机的视口跨越600像素。

我的布局宽度为600像素(图)。

然而,当我在2.1(3 api)AVD WVGA800(800x480)中加载此项目时,屏幕右侧约有120像素。它就像视口设置为“480”,即使我指定600。

无论我改变什么,都没有变化。

问题出在这里?我错过了一些明显的东西吗?

2 个答案:

答案 0 :(得分:0)

如果css文件不是太大,请将其包括在内。我认为这可能与此有关。

答案 1 :(得分:0)

我通常会想到这一点 - 如果通过java onCreate函数设置一些其他设置,则将视口设置为特定宽度是可行的。问题是,在我开始工作之后,当你选择一个输入时,视口会放大,键盘出现之后,如果不给用户缩放控件就无法取消缩放。

我能够通过创建一个jquery插件.phoneGapScale()来解决这个问题。当调用一个元素时,它会根据设备的视口调整所有基于像素的宽度。将视口宽度设置为device-width后,这是当前的。

我写的插件有点粗糙,它有点混乱DOM(在这种情况下对我来说无关紧要),因为没有办法检查css值是否实际上是通过jQuery设置的,因为检查css值即使在css中没有指定任何内容,也总会返回0px。

因此,我在调整器函数onDeviceReady中抛出的每个元素都以这样的样式标记结束:style =“font-size:Xpx; margin-left:Xpx; margin-right:Xpx; etc etc etc

我清理后会发布插件并正确记录使用情况。

无论如何,这种方法的固定宽度应用程序可以在每个设备上以每个可能的屏幕比例和dpi工作。

它甚至可以优雅地移植到iphone。