android - Meta width=device-width 无法按预期在 Galaxy Nexus 上运行

标签 android web-applications webview

我期望窗口的宽度与物理屏幕的宽度相同。

在我的 Galaxy Nexus 上,屏幕宽度为 720 像素,但窗口宽度为 360。

为什么?怎么了?页面完整代码:

<!DOCTYPE html>
<html>
<head> 
  <meta charset="UTF-8" />
  <title>My Page</title> 
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
  <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js"></script>
  <script type="text/javascript">
    $(function() {
      windowWidth = $(window).width();
      windowHeight = $(window).height();

      alert("width: " + windowWidth + " height: " + windowHeight);
    });

</script>
</head>
<body id="bo">
</body>
</html>

最佳答案

默认情况下,WebView Android 会假设您的网页面向中密度设备,因此,它将相应地缩放内容。

来自documentation (请参阅标题为构建网页以支持不同屏幕密度的部分):

By default, WebView scales a web page so that it is drawn at a size that matches the default appearance on a medium density screen. So, it applies 1.5x scaling on a high density screen (because its pixels are smaller) and 0.75x scaling on a low density screen (because its pixels are bigger). Starting with API level ECLAIR, WebView supports DOM, CSS, and meta tag features to help you (as a web developer) target screens with different screen densities.

所以,由于 Galaxy Nexus 是 xhdpi设备,WebView将对您的内容应用 2 倍缩放,从而产生 360 度的宽度。

如果您愿意,您可以更改此设置,它需要添加 <meta> HTML 中的标记。例如,将以下内容添加到标记中应该会产生准确的宽度:

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

但是,请注意,在这种情况下您需要考虑密度。

关于android - Meta width=device-width 无法按预期在 Galaxy Nexus 上运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13848846/

相关文章:

ios - WKWebView 未在 swift 4 xcode 10 中初始化

java - 我们可以直接实例化一个抽象类吗?

android - 带有 android maven 插件的核心库

web-applications - TeamCity MSBuild 网站发布项目

java - 使用 Spring 3 启动项目

javascript - 如何根据 Windows 10 UWP 中的 HTML 内容调整 Webview 高度?

Android 视频精准搜索

android - GraphView始终从零开始,动态数据

java - 在 Java Web 应用程序中,在哪里存储运行时生成的类?

javascript - 在 android WebView 中禁用链接