Android 4.4中的WebView和初始规模

时间:2013-11-27 13:18:17

标签: android web-applications android-webview viewport

我一整天都在撞墙,我需要一些帮助:(

问题是,我有一个专为640x960设计的WebApp。

我们没有时间为每个屏幕尺寸编写css,因此我在initial-scale, maximum-scale, minimum-scale元标记中使用viewport将应用扩展到不同的屏幕尺寸。

问题是,在Android 4.4中,无论我做什么,它总是会扩展应用程序,但永远不会失败!

我的意思是如果我使用0.7的值,应用程序会按比例放大。如果我使用值1.3,则会再次放大:/

我尝试将targetSdkVersion更改为不同版本以获取旧行为,但没有运气。

有人可以帮助我吗?

更新 所以我最终在style="zoom: <value>%"标记上使用了body。我根据当前设备屏幕大小与我的应用程序设计的分辨率之间的差异来计算百分比。现在一切都适合。

2 个答案:

答案 0 :(得分:8)

的视口
<meta name="viewport" content="width=640, initial-scale=1">

应该使您的固定布局始终适合(有关视口元标记的更多信息,请参阅MDN)。

您可能碰到以下某些内容:

  • 内容无法缩小到超过“概览比例”(即,您的内容比屏幕更窄)。这是设计 - 使它变小只会导致侧面呈现白色,所以为什么要打扰。如果您需要此行为,则需要向内容添加填充
  • 您已将WebView的布局高度指定为WRAP_CONTENT - 这会使WebView忽略视口元标记,不要这样做 - 将其设置为MATCH_PARENT或固定大小,
  • 您正在使用某些WebSettings
    • setUseWideViewport(覆盖视口元标记)或
    • setInitialScale(可以改变视口的大小)。

检查内容错误或WebView错误的最佳方法是查看该页面是否在Android上的Chrome中有效:

  1. 如果它在Android上的Chrome中有效但在WebView中没有,则将targetSdkVersion设置为19并尝试禁用WebSettings,将布局更改为固定大小等等。以查看导致问题的原因。也许从另一端开始 - 通过制作一个只需加载页面的超级琐碎的WebView应用程序 - 确认其有效,然后慢慢引入更改以查看哪一个导致问题,
  2. 如果它在Android上的Chrome中不起作用,那么问题就是Android上预KK WebView和Chrome之间的视口元标记支持的差异 - 这意味着您必须修复内容,
  3. 如果你仍然卡在一个包含repro源码的拉链(不一定是完整的应用程序,只是证明问题的最小值),我可以尝试从那里帮助你。

答案 1 :(得分:2)

在我自己不确定答案之后,我已经完成了这项工作。

http://www.gauntface.co.uk/blog/2013/11/29/desktop-site-and-the-viewport/

如果您只希望网页符合WebView的宽度,则需要没有初始比例的视口。

会影响WebView的事情:

  1. 确保您启用了setUseWideViewport(),以便页面可以大于设备宽度:http://developer.android.com/reference/android/webkit/WebSettings.html#setUseWideViewPort(boolean)
  2. 确保targetSDKVersion = 19以确保您没有获得旧webview的任何兼容性
  3. 如果您想阻止用户放大或缩小,请在视口中使用user-scalable = no,而不是设置最小值和最大值。