JavaFX resizable canvas problems
<p>I've a problem what's partially solved, but I am curious about another (better) solutions..
I want a canvas what fills the entire window and resizes itself if the window is resized.</p>

<p><strong>Option 1 (partial solution):</strong></p>

<p>According to this: <a href="https://dlemmermann.wordpress.com/2014/04/10/javafx-tip-1-resizable-canvas/" rel="nofollow noreferrer">https://dlemmermann.wordpress.com/2014/04/10/javafx-tip-1-resizable-canvas/</a>
and this: <a href="https://stackoverflow.com/questions/24533556/how-to-make-canvas-resizable-in-javafx">How to make canvas Resizable in javaFX?</a>
I've created (copied) the class:</p>

<pre><code>public class ResizableCanvas extends Canvas {

    public ResizableCanvas() {
        widthProperty().addListener(evt -&gt; draw());
        heightProperty().addListener(evt -&gt; 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();
    }
}
</code></pre>

<p>and I placed the following content to my ViewField.fxml file:</p>

<pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;

&lt;?import javafx.scene.canvas.Canvas?&gt;
&lt;?import javafx.scene.layout.StackPane?&gt;
&lt;?import blahblahblah.ResizableCanvas?&gt;

&lt;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"&gt;
   &lt;children&gt;
      &lt;ResizableCanvas fx:id="resizableCanvas" /&gt;
   &lt;/children&gt;
&lt;/StackPane&gt;
</code></pre>

<p>My controller (attached to this fxml file) is ViewFieldController.java:</p>

<pre><code>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);
    }

}
</code></pre>

<p>The windows is loaded from the Main controller MainApp.java:</p>

<pre><code>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();
    }
}

}
</code></pre>

<p>This solution works ("big X" appears on the canvas, thanks to drawArea() method).
The problem with this solution that after placing the ResisableCanvas class into the FXML file I can't use the SceneBuilder any more on this file, because I get the following exception:</p>

<pre><code>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.&lt;init&gt;(FXOMDocument.java:82)
    at com.oracle.javafx.scenebuilder.kit.fxom.FXOMDocument.&lt;init&gt;(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
</code></pre>

<p><strong>Option 2 (partial solution):</strong></p>

<p>My second solution uses the same ResizableCanvas class, but there is no FXML file or controller class.</p>

<pre><code>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();
    }

}
</code></pre>

<p>This solution works too (big X is present on the screen), but the same problem appears here:
I can't open the FXML file in ScreenBuilder but for different reason (there is no FXML file at all).</p>

<p><strong>Option 3 (my original solution, not working)</strong>:</p>

<p>I've replaced the ResizableCanvas class in ViewField.fxml file with an original Canvas class:</p>

<pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;

&lt;?import javafx.scene.canvas.Canvas?&gt;
&lt;?import javafx.scene.layout.StackPane?&gt;

&lt;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"&gt;
   &lt;children&gt;
      &lt;Canvas fx:id="regularCanvas" /&gt;
   &lt;/children&gt;
&lt;/StackPane&gt;
</code></pre>

<p>My ViewFieldController.java looks like this:</p>

<pre><code>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);
    }

}
</code></pre>

<p>But the screen is empty here. There is no "big X" drawn on to the canvas.
If I resize the window, I dont't know if the canvas is resized or not, but it's possible to load the FXML file into the SceneBuilder for further work..</p>

<p>It's not better if I give some height and width to the canvas (result is the same).</p>

<pre><code>&lt;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"&gt;
   &lt;children&gt;
      &lt;Canvas fx:id="regularCanvas" height="300.0" width="300.0" /&gt;
   &lt;/children&gt;
&lt;/StackPane&gt;
</code></pre>

<p>My questions are:</p>

<ol>
<li>Why the "big X" does not appeared int the 3rd case?</li>
<li>What modifications should I do to make the 3rd case work?</li>
<li>Is there any other solution what solves my problems?</li>
<li>Why did I get the exception in 1st case? </li>
<li>Why is it impossible to "Fit to parent" the canvas in SceneBuilder?</li>
<li>Why is the "resisable" option disabled in SceneBuilder?</li>
</ol>