JavaFX screen resolution scaling

Question

I have been searching for a method to do this, but I only found This question without answers.

I am developing in a 1366x768 laptop, I use JavaFX to create a GUI (I am sorry, but I can't post the code, it's basically an AnchorPane containing a couple GridPanes, which contain more GridPanes, which contain Labels, TextFields and a couple Charts).

The problem comes when I load the project on another resolution (1920x1080 or 1600x900).

I am using stage.setMaximized(true);, but this only Scales the background, the stage itself, so all the elements and containers (Panels, Labels, TextFields.....) remain the same size as with the 1366x768 resolution, making the GUI "not fit" at resolutions that are not exactly 1366x768.

I hope I explained my problem well enough, my english is far from perfect.

Does anyone have any suggestion on how to make elements scale with stage resolution?

(I need the software to be maximised or full screen in every monitor, so making a fixed resolution (1366x768, for example) doesn't seem like a good solution).

Thank you all.

Update:

I just created a little example. It's a 2x1 GridPane inside the default JavaFX AnchorPane, I added two example Buttons to the grid pane.

<AnchorPane minHeight="-Infinity" minWidth="-Infinity" prefHeight="300.0" prefWidth="400.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" >
<children>
    <GridPane prefHeight="300.0" prefWidth="400.0">
        <columnConstraints>
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
        </columnConstraints>
        <rowConstraints>
            <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
            <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
        </rowConstraints>
        <children>
            <Button fx:id="example1" mnemonicParsing="false" text="Example 2" GridPane.halignment="CENTER" GridPane.valignment="CENTER" />
            <Button fx:id="example2" mnemonicParsing="false" text="Example 2" GridPane.halignment="CENTER" GridPane.rowIndex="1" GridPane.valignment="CENTER" />
        </children>
    </GridPane>
</children>

This code looks nice in a 400x300 screen (Too little, I know, it's just an example), when I scale it to 1366x768 (Not real full screen, just stage.setMaximized(true);), the GridPane does not scale, only the Stage itself, so I have a full screen background, with a 400x300 Pane (With its tiny Buttons) on the top-left corner of my screen.

TL;DR: The example code the buttons stay in the top-left corner of the screen, and the rest is just an empty space when I scale up resolution.

Update 2; Forgot the Java Code.

Parent root = FXMLLoader.load(getClass().getResource("UI.fxml"));
Scene scene = new Scene(root, java.awt.Toolkit.getDefaultToolkit().getScreenSize().width,
            java.awt.Toolkit.getDefaultToolkit().getScreenSize().height);
stage = new Stage();
stage.setMaximized(false);
stage.setScene(scene);
stage.setTitle("Example Menu");
stage.show();

Answer 1

You need to set anchor pane constraints on child. in your case gridpane

AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"

This will go after your

 GridPane prefHeight="300.0" prefWidth="400.0" **HERE** 

This will maximize Child component within container , hence 0 0 0 0 pixels from each side .