Question

我有一个非常简单的网页，其中包含一张图片。图像应该占据整个页面。在纵向方向上，它应该填充宽度（宽度：100％;高度：自动;），并且在横向方向上，它应该填充高度（高度：100％;宽度：自动;）。

我已验证该页面在Chrome Mobile上正常运行。它只是在WebView中不起作用。这是HTML：

<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<title></title>
</head>

<body style="background-color: black; margin: 0px; padding: 0px;">
    <img id="imgWindow" alt="Full Screen Image" src="oxygenbooklet2014cover.jpg"
        style="border: 0px; padding: 0px; margin: 0px; vertical-align: top;">
</body>

<script type="text/javascript">

    $(document).ready(function() {
        $(window).bind("orientationchange", onOrientationChange);
        setOrientationLayout();
    });

    function onOrientationChange(event) {
        setOrientationLayout();
    }

    // Fill image by width in portrait, and fill image by height in landscape
    function setOrientationLayout() {
        if (window.orientation == 0 || window.orientation == 180) {
            // Portrait
            $("#imgWindow").css("width", "100%");
            $("#imgWindow").css("height", "auto");
        } else if (window.orientation == 90 || window.orientation == -90) {
            // Landscape
            $("#imgWindow").css("width", "auto");
            $("#imgWindow").css("height", "100%");
        }

        alert(window.orientation);
    }
</script>

</html>

我在WebView中运行它。页面在纵向方向上正确显示，但由于某种原因，网页甚至在横向上也不可见。

这是片段中WebView布局的Java代码：

LinearLayout layout = new LinearLayout(getActivity());
layout.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
layout.setGravity(Gravity.CENTER);
layout.setBackgroundColor(Color.BLACK);
layout.addView(myWebView);

Fragment位于一个Activity中，它有一个ViewPager，具有以下布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    android:background="#98AFC7"
    xmlns:app="http://schemas.android.com/apk/res/com.ihtp.bsc">

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="#E5E4E2"
        />
    <com.viewpagerindicator.CirclePageIndicator
        android:id="@+id/indicator"
        android:padding="10dip"
        android:layout_height="wrap_content"
        android:layout_width="fill_parent"
        android:background="#2E2E2E"
        />
</LinearLayout>

非常感谢提前！

Android WebView - 横向模式下不显示全屏图像

0 个答案: