JavaFX 可调整大小的画布问题



我有一个问题,部分解决了,但我对另一个(更好的)解决方案感到好奇。我想要一个充满整个窗口的画布,并在调整窗口大小时调整自身大小。

备选方案1(部分解决方案):

据此: https://dlemmermann.wordpress.com/2014/04/10/javafx-tip-1-resizable-canvas/以及这个:如何在javaFX中使画布可调整大小?我已经创建(复制)了类:

public class ResizableCanvas extends Canvas {
    public ResizableCanvas() {
        widthProperty().addListener(evt -> draw());
        heightProperty().addListener(evt -> draw());
    }
    private void draw() {
        double width = getWidth();
        double height = getHeight();
        GraphicsContext gc = getGraphicsContext2D();
        gc.clearRect(0, 0, width, height);
        gc.setStroke(Color.RED);
        gc.strokeLine(0, 0, width, height);
        gc.strokeLine(0, height, width, 0);
    }
    @Override
    public boolean isResizable() {
        return true;
    }
    @Override
    public double prefWidth(double height) {
        return getWidth();
    }
    @Override
    public double prefHeight(double width) {
        return getHeight();
    }
}

我将以下内容放入我的ViewField.fxml文件中:

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.canvas.Canvas?>
<?import javafx.scene.layout.StackPane?>
<?import blahblahblah.ResizableCanvas?>
<StackPane fx:id="pane" minHeight="500.0" minWidth="500.0" style="-fx-background-color: white; -fx-border-color: black;" xmlns="http://javafx.com/javafx/8.0.65" xmlns:fx="http://javafx.com/fxml/1" fx:controller="blahblahblah.ViewFieldController">
   <children>
      <ResizableCanvas fx:id="resizableCanvas" />
   </children>
</StackPane>

我的控制器(附加到此 fxml 文件)是 ViewFieldController.java:

import javafx.beans.property.ReadOnlyDoubleProperty;
import javafx.fxml.FXML;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
public class ViewFieldController {
    private Stage dialogStage;
    @FXML
    private StackPane pane;
    @FXML
    private ResizableCanvas resizableCanvas;
    @FXML
    private void initialize() {
        GraphicsContext gc = resizableCanvas.getGraphicsContext2D();
        ReadOnlyDoubleProperty widthProperty = pane.widthProperty();
        ReadOnlyDoubleProperty heightProperty = pane.heightProperty();
        resizableCanvas.widthProperty().bind(widthProperty);
        resizableCanvas.heightProperty().bind(heightProperty);
        drawArea(gc);
    }
    public void setDialogStage(Stage dialogStage) {
        this.dialogStage = dialogStage;
    }
    private void drawArea(GraphicsContext gc) {
        gc.setStroke(Color.BLACK);
        gc.setLineWidth(1);
        gc.strokeLine(0, 0, resizableCanvas.getWidth(), resizableCanvas.getHeight());
        gc.strokeLine(0, resizableCanvas.getHeight(), resizableCanvas.getWidth(), 0);
    }
}

窗口从主控制器 MainApp 加载.java:

public class MainApp extends Application {
public static void main(String[] args) {
    launch(args);
}
//...
public void showViewField() {
    try {
        FXMLLoader loader = new FXMLLoader();
        loader.setLocation(MainApp.class.getResource("view/ViewField.fxml"));
        StackPane pane = (StackPane) loader.load();
        Stage stage = new Stage();
        stage.setTitle("View Field");
        Scene scene = new Scene(pane);
        stage.setScene(scene);
        ViewFieldController controller = loader.getController();
        controller.setDialogStage(stage);
        stage.show();
    } catch (IOException e) {
        e.printStackTrace();
    }
}
}

这个解决方案有效("大X"出现在画布上,这要归功于drawArea()方法)。此解决方案的问题在于,将 ResisableCanvas 类放入 FXML 文件后,我无法再在此文件上使用 SceneBuilder,因为我得到以下异常:

java.io.IOException: javafx.fxml.LoadException: 
...
    at com.oracle.javafx.scenebuilder.kit.fxom.FXOMLoader.load(FXOMLoader.java:92)
    at com.oracle.javafx.scenebuilder.kit.fxom.FXOMDocument.<init>(FXOMDocument.java:82)
    at com.oracle.javafx.scenebuilder.kit.fxom.FXOMDocument.<init>(FXOMDocument.java:97)
    at com.oracle.javafx.scenebuilder.kit.editor.EditorController.updateFxomDocument(EditorController.java:2384)
    at com.oracle.javafx.scenebuilder.kit.editor.EditorController.setFxmlTextAndLocation(EditorController.java:664)
    at com.oracle.javafx.scenebuilder.app.DocumentWindowController.loadFromFile(DocumentWindowController.java:381)
    at com.oracle.javafx.scenebuilder.app.SceneBuilderApp.performOpenFiles(SceneBuilderApp.java:554)
    at com.oracle.javafx.scenebuilder.app.SceneBuilderApp.handleOpenFilesAction(SceneBuilderApp.java:424)
    at com.oracle.javafx.scenebuilder.app.SceneBuilderApp.handleLaunch(SceneBuilderApp.java:403)
    at com.oracle.javafx.scenebuilder.app.AppPlatform.requestStartGeneric(AppPlatform.java:139)
    at com.oracle.javafx.scenebuilder.app.AppPlatform.requestStart(AppPlatform.java:106)
    at com.oracle.javafx.scenebuilder.app.SceneBuilderApp.start(SceneBuilderApp.java:353)
    at com.sun.javafx.application.LauncherImpl.lambda$launchApplication1$163(LauncherImpl.java:863)
    at com.sun.javafx.application.PlatformImpl.lambda$runAndWait$176(PlatformImpl.java:326)
    at com.sun.javafx.application.PlatformImpl.lambda$null$174(PlatformImpl.java:295)
    at java.security.AccessController.doPrivileged(Native Method)
    at com.sun.javafx.application.PlatformImpl.lambda$runLater$175(PlatformImpl.java:294)
    at com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:95)
    at com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
    at com.sun.glass.ui.win.WinApplication.lambda$null$149(WinApplication.java:191)
    at java.lang.Thread.run(Thread.java:745)
Caused by: javafx.fxml.LoadException: 
...
    at javafx.fxml.FXMLLoader.constructLoadException(FXMLLoader.java:2601)
    at javafx.fxml.FXMLLoader.importClass(FXMLLoader.java:2848)
    at javafx.fxml.FXMLLoader.processImport(FXMLLoader.java:2692)
    at javafx.fxml.FXMLLoader.processProcessingInstruction(FXMLLoader.java:2661)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:2517)
    at javafx.fxml.FXMLLoader.load(FXMLLoader.java:2425)
    at com.oracle.javafx.scenebuilder.kit.fxom.FXOMLoader.load(FXOMLoader.java:89)
    ... 20 more
Caused by: java.lang.ClassNotFoundException: blahblahblah.ResizableCanvas
    at java.lang.ClassLoader.findClass(ClassLoader.java:530)
    at java.lang.ClassLoader.loadClass(ClassLoader.java:424)
    at java.lang.ClassLoader.loadClass(ClassLoader.java:357)
    at javafx.fxml.FXMLLoader.loadTypeForPackage(FXMLLoader.java:2916)
    at javafx.fxml.FXMLLoader.loadType(FXMLLoader.java:2905)
    at javafx.fxml.FXMLLoader.importClass(FXMLLoader.java:2846)
    ... 25 more

备选方案2(部分解决方案):

我的第二个解决方案使用相同的 RessizeableCanvas 类,但没有 FXML 文件或控制器类。

public class MainApp extends Application {
    //...
    public void showViewField2() {
        ResizableCanvas canvas = new ResizableCanvas();
        StackPane pane = new StackPane();
        pane.getChildren().add(canvas);
        Stage stage = new Stage();
        stage.setTitle("View Field");
        Scene scene = new Scene(pane);
        stage.setScene(scene);
        canvas.widthProperty().bind(pane.widthProperty());
        canvas.heightProperty().bind(pane.heightProperty());
        stage.show();
    }
}

这个解决方案也有效(屏幕上存在大X),但这里出现了同样的问题:我无法在屏幕生成器中打开FXML文件,但由于不同的原因(根本没有FXML文件)。

选项 3(我的原始解决方案,不起作用)

我已经将ViewField.fxml文件中的RessizeableCanvas类替换为原始的Canvas类:

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.canvas.Canvas?>
<?import javafx.scene.layout.StackPane?>
<StackPane fx:id="pane"  minHeight="500.0" minWidth="500.0" style="-fx-background-color: white; -fx-border-color: black;" xmlns="http://javafx.com/javafx/8.0.65" xmlns:fx="http://javafx.com/fxml/1" fx:controller="blahblahblah.ViewFieldController">
   <children>
      <Canvas fx:id="regularCanvas" />
   </children>
</StackPane>

我的 ViewFieldController.java 看起来像这样:

import javafx.beans.property.ReadOnlyDoubleProperty;
import javafx.fxml.FXML;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
public class ViewFieldController {
    private Stage dialogStage;
    @FXML
    private StackPane pane;
    @FXML
    private Canvas regularCanvas;
    @FXML
    private void initialize() {
        GraphicsContext gc = regularCanvas.getGraphicsContext2D();
        ReadOnlyDoubleProperty widthProperty = pane.widthProperty();
        ReadOnlyDoubleProperty heightProperty = pane.heightProperty();
        regularCanvas.widthProperty().bind(widthProperty);
        regularCanvas.heightProperty().bind(heightProperty);
        drawArea(gc);
    }
    public void setDialogStage(Stage dialogStage) {
        this.dialogStage = dialogStage;
    }
    private void drawArea(GraphicsContext gc) {
        gc.setStroke(Color.BLACK);
        gc.setLineWidth(1);
        gc.strokeLine(0, 0, regularCanvas.getWidth(), regularCanvas.getHeight());
        gc.strokeLine(0, regularCanvas.getHeight(), regularCanvas.getWidth(), 0);
    }
}

但是这里的屏幕是空的。画布上没有绘制"大X"。如果我调整窗口大小,我不知道画布是否调整了大小,但可以将FXML文件加载到SceneBuilder中进行进一步的工作。

如果我给画布一些高度和宽度(结果是一样的),那也更好。

<StackPane fx:id="pane" minHeight="500.0" minWidth="500.0" style="-fx-background-color: white; -fx-border-color: black;" xmlns="http://javafx.com/javafx/8.0.65" xmlns:fx="http://javafx.com/fxml/1" fx:controller="blahblahblah.ViewFieldController">
   <children>
      <Canvas fx:id="regularCanvas" height="300.0" width="300.0" />
   </children>
</StackPane>

我的问题是:

  1. 为什么"大X"没有出现在第3种情况下?
  2. 我应该做哪些修改才能使第 3 种情况正常工作?
  3. 还有其他解决方案可以解决我的问题吗?
  4. 为什么我在第一种情况下会出现例外?
  5. 为什么无法在场景生成器中"适合父级"画布?
  6. 为什么在场景生成器中禁用了"可调整大小"选项?

通过将自定义画布捆绑到 jar 文件中并将其导入场景生成器库,可以使选项 1 与场景生成器配合使用。例如,请参阅此问题。

选项 3 不起作用,因为您只从 initialize() 方法调用drawArea()。此时,画布不是Scene的一部分,当然也不会显示在窗口中;因此,它没有经过布局,因此宽度和高度为零。您可以通过将侦听器添加到宽度和高度并在它们更改时重绘来修复此选项,就像您在选项 1 中所做的那样:

@FXML
private void initialize() {
    GraphicsContext gc = regularCanvas.getGraphicsContext2D();
    ReadOnlyDoubleProperty widthProperty = pane.widthProperty();
    ReadOnlyDoubleProperty heightProperty = pane.heightProperty();
    regularCanvas.widthProperty().bind(widthProperty);
    regularCanvas.heightProperty().bind(heightProperty);
    regularCanvas.widthProperty().addListener((obs, oldWidth, newWidth) -> drawArea(gc));
    regularCanvas.heightProperty().addListener((obs, oldHeight, newHeight) -> drawArea(gc));
    drawArea(gc);
}