Android 中的 WebView 无法正确显示本地 HTML答案

【问题标题】：WebView in Android not displaying a local HTML correctlyAndroid 中的 WebView 无法正确显示本地 HTML
【发布时间】：2015-07-22 21:53:32
【问题描述】：

我创建了一个本地 HTML 页面，我想在我的 Android 应用程序中以全屏显示该页面。

现在发生的情况是页面在桌面浏览器中正确打开，但看起来放大我的 Android 设备（谷歌眼镜）。

我的res/layout/webview.xml是标准的：

<?xml version="1.0" encoding="utf-8" ?>

<WebView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/webView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"></WebView>

我的HTML文件如下：

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Cover</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" href="css/test.css">
</head>
<body>

    <div class="container">
      <div class="photo card">
        <img src="img/cover.png">
        <footer class="footer-cover">
        </footer>
      </div>
    </div>
</body>

img/cover.png 具有 Glass 显示屏的尺寸：640x360。此外，该应用只需要在一台设备（Google Glass）上运行，因此 CSS 以像素为单位描述了大多数尺寸：

* {
 margin: 0;
 padding: 0;
 border: 0;
 font: inherit;
}

div.card {
  width: 640px;
  height: 360px;
  display: block;
  overflow: hidden;

  position: absolute;

  background-color: #000;
  color: #fff;
}

div.card  a {
  text-decoration: none;
  color: #00fcff;
}

footer {
  margin: 0 40px 28px 40px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 40px;

  font-weight: 600;
  font-size: 24px;
  line-height: 1.4em;
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
}

footer.footer-cover{
    left: 0;
    margin: 0;
    background-color:#00293F;
    min-height: 100px;
    padding:0 40px;
}

【问题讨论】：

标签： android html css webview google-glass

【解决方案1】：

由于WebView没有fillViewPort，可以尝试使用

    getSettings().setUseWideViewPort(true);

加载缩小的内容。

【讨论】：

以下任何一个都没有效果：webView.getSettings().setUseWideViewPort(true); webView.getSettings().setLoadWithOverviewMode(true);
尝试使用setDefaultZoom(ZoomDensity.FAR); 将内容一直缩小。
setDefaultZoom 已被弃用。