3

我WebView在全屏中使用以显示具有固定大小的内容1024x768，因此我需要对其进行缩放，使其从屏幕的顶部延伸到底部。为此，我将以下代码放入我的控制器中initialize()：

this.wv.getEngine().getLoadWorker().stateProperty().addListener(new ChangeListener<State>() {
    public void changed(ObservableValue<? extends State> ov, State oldState, State newState)
    {
        if (newState == State.SUCCEEDED)
        {
            wv.requestFocus();
            wv.getEngine().setUserStyleSheetLocation(getClass().getResource("/css/user.css").toExternalForm());
            Rectangle2D primaryScreenBounds = Screen.getPrimary().getVisualBounds();
            Element maincontainer = (Element) wv.getEngine().executeScript("document.getElementById('pbody')");
            maincontainer.setAttribute("style", String.format("-webkit-transform: scale(%.5f)", (primaryScreenBounds.getHeight() / 768.0)));
        }
        else if (newState == State.FAILED)
        {
            //.
        }
    }
});

加载中的 CSSuser.css很好，这里是代码供参考：

body {
    overflow-x: hidden;
    background-color: #ccc;
}

#pbody {
    margin: 0 auto;
    -webkit-transform-origin: top center;
}

在 HTML 中，body 标签肯​​定有一个 id：

<body id="pbody">

问题是由于某种原因，#pbodyjavascript位没有找到，因此产生以下错误：

java.lang.NullPointerException
    at com.mediacitizens.companyapp.presentation.desktop.SlideshowController$1.changed(SlideshowController.java:165)
    at com.mediacitizens.companyapp.presentation.desktop.SlideshowController$1.changed(SlideshowController.java:1)
    at com.sun.javafx.binding.ExpressionHelper$SingleChange.fireValueChangedEvent(ExpressionHelper.java:196)
    at com.sun.javafx.binding.ExpressionHelper.fireValueChangedEvent(ExpressionHelper.java:100)
    at javafx.beans.property.ReadOnlyObjectWrapper$ReadOnlyPropertyImpl.fireValueChangedEvent(ReadOnlyObjectWrapper.java:195)
    at javafx.beans.property.ReadOnlyObjectWrapper.fireValueChangedEvent(ReadOnlyObjectWrapper.java:161)
    at javafx.beans.property.ObjectPropertyBase.markInvalid(ObjectPropertyBase.java:130)
    at javafx.beans.property.ObjectPropertyBase.set(ObjectPropertyBase.java:163)
    at javafx.scene.web.WebEngine$LoadWorker.updateState(WebEngine.java:975)
    at javafx.scene.web.WebEngine$LoadWorker.dispatchLoadEvent(WebEngine.java:1086)
    at javafx.scene.web.WebEngine$LoadWorker.access$600(WebEngine.java:968)
    at javafx.scene.web.WebEngine$PageLoadListener.dispatchLoadEvent(WebEngine.java:955)
    at com.sun.webpane.platform.WebPage.fireLoadEvent(WebPage.java:2372)
    at com.sun.webpane.platform.WebPage.fwkFireLoadEvent(WebPage.java:2220)
    at com.sun.webpane.webkit.network.URLLoader.twkDidFinishLoading(Native Method)
    at com.sun.webpane.webkit.network.URLLoader.access$1300(URLLoader.java:42)
    at com.sun.webpane.webkit.network.URLLoader$6.run(URLLoader.java:657)
    at com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
    at com.sun.glass.ui.win.WinApplication.access$100(WinApplication.java:29)
    at com.sun.glass.ui.win.WinApplication$3$1.run(WinApplication.java:73)
    at java.lang.Thread.run(Thread.java:722)

就是这SlideshowController.java:165条线：

maincontainer.setAttribute("style", String.format("-webkit-transform: scale(%.5f)", (primaryScreenBounds.getHeight() / 768.0)));

我无法理解这种行为背后的原因。

更新：我尝试等待文档加载但它也不起作用，首先我将它手动放入内容中：

<script>
function scaleBody(scale)
{
    alert(3);
    document.getElementById('pbody').style.webkitTransform = "scale("+scale+")";
}
</script>

然后，使用状态变化监听器：

double scale = Screen.getPrimary().getVisualBounds().getHeight() / 768.0;
wv.getEngine().executeScript(String.format("alert(1); window.onload = function(){ alert(2); scaleBody(%.5f); }", scale));

只有alert(1)实际触发并且不会产生错误......

...仍然不知道如何在 JavaFX 中执行 js。

4

1 回答 1

2

您需要提供更多详细信息，例如您尝试加载哪种 html 内容。这是我的测试代码，可以正常工作：

import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.concurrent.Worker.State;
import javafx.geometry.Rectangle2D;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.scene.web.WebView;
import javafx.stage.Screen;
import javafx.stage.Stage;
import org.w3c.dom.Element;

public class WVTest extends Application {

    private WebView wv;

    @Override
    public void start(Stage primaryStage) {
        wv = new WebView();
        wv.getEngine().load(this.getClass().getResource("index.html").toExternalForm());
        // wv.getEngine().load("http://www.oracle.com/products/index.html");
        wv.getEngine().getLoadWorker().stateProperty().addListener(
                new ChangeListener<State>() {
                    @Override
                    public void changed(ObservableValue<? extends State> ov, State oldState, State newState) {
                        if (newState == State.SUCCEEDED) {
                            wv.requestFocus();
                            wv.getEngine().setUserStyleSheetLocation(getClass().getResource("style.css").toExternalForm());
                            Rectangle2D primaryScreenBounds = Screen.getPrimary().getVisualBounds();
                            Element maincontainer = (Element) wv.getEngine().executeScript("document.getElementById('pbody')");
                            System.out.println("maincontainer = " + maincontainer);
                            maincontainer.setAttribute("style", String.format("-webkit-transform: scale(%.5f)", (primaryScreenBounds.getHeight() / 768.0)));
                        }
                    }
                });

        VBox root = new VBox();
        root.getChildren().addAll(wv);

        Scene scene = new Scene(root, 300, 250);
        scene.getStylesheets().add(this.getClass().getResource("style.css").toExternalForm());

        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

用style.css

body {
    overflow-x: hidden;
    background-color: #ccc;
}

#pbody {
    margin: 0 auto;
    -webkit-transform-origin: top center;
}

和index.html

<html>
<head>
    <title>Test</title>
</head>
<body id="pbody">
    Test<br/>
    Test<br/>
    Test<br/>
    Test<br/>
</body>
</html>

线

System.out.println("maincontainer = " + maincontainer);

印刷

maincontainer = [对象 HTMLBodyElement]

或者，在常规 Web 浏览器中打开您加载的 html 内容，然后按 F12（firebug 或类似工具）并在 JS 控制台上，键入document.getElementById('pbody').

于 2013-02-04T19:29:49.187 回答