Why when I shrink my splitPane a grey area appears? - javafx

Question

I have a problem with my fxml interface.
When I try to reduce a specific part of my application, a grey area covers it.
An example in image will be more speaking:
I've tried quite a few things (by modifying parameters of the different components) but the white zone is still there.
Do you have any idea what my problem is?
The code (example):
MainApp.java
public class MainApp extends Application {
#Override
public void start(Stage primaryStage) {
try {
FXMLLoader loader = new FXMLLoader();
loader.setLocation(MainApp.class.getResource("view/test.fxml"));
AnchorPane root = (AnchorPane) loader.load();
Controller controller = loader.getController();
controller.setMainApp(this);
Scene scene = new Scene(root);
primaryStage.setScene(scene);
primaryStage.show();
} catch(Exception e) {
e.printStackTrace();
}
}
public static void main(String[] args) {
launch(args);
}
Controller.java
public class Controller implements Initializable{
MainApp mainApp;
#FXML
Label label;
#Override
public void initialize(URL location, ResourceBundle resources) {
label.setText("Hello");
}
public void setMainApp(MainApp mainApp) {
this.mainApp = mainApp;
}
}
test.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.SplitPane?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.text.Font?>
<AnchorPane id="AnchorPane"
maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
minHeight="250.0" minWidth="400.0" prefHeight="519.0" prefWidth="921.0"
xmlns="http://javafx.com/javafx/8.0.111"
xmlns:fx="http://javafx.com/fxml/1"
fx:controller="application.view.Controller">
<children>
<SplitPane dividerPositions="0.49439102564102566"
maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308"
prefHeight="799.0" prefWidth="1250.0" AnchorPane.bottomAnchor="0.0"
AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0"
AnchorPane.topAnchor="0.0">
<items>
<AnchorPane minHeight="400.0" minWidth="400.0"
prefHeight="511.0" prefWidth="467.0" rotate="0.0" />
<AnchorPane minHeight="0.0" minWidth="0.0"
prefHeight="797.0" prefWidth="349.0">
<children>
<SplitPane layoutX="17.0" layoutY="7.0"
orientation="VERTICAL" prefHeight="797.0" prefWidth="346.0"
AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0"
AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
<items>
<AnchorPane maxHeight="1.7976931348623157E308"
maxWidth="1.7976931348623157E308" minHeight="108.0"
minWidth="447.0" prefHeight="108.0" prefWidth="447.0">
<children>
<SplitPane dividerPositions="0.5248796147672552"
maxHeight="1.7976931348623157E308"
maxWidth="1.7976931348623157E308" minHeight="-Infinity"
minWidth="-Infinity" prefHeight="112.0" prefWidth="442.0"
AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0"
AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
<items>
<AnchorPane maxHeight="1.7976931348623157E308"
maxWidth="1.7976931348623157E308" minHeight="0.0"
minWidth="0.0" prefHeight="110.0" prefWidth="313.0" />
<AnchorPane maxHeight="1.7976931348623157E308"
maxWidth="1.7976931348623157E308" minHeight="0.0"
minWidth="0.0" prefHeight="110.0" prefWidth="87.0">
<children>
<Label fx:id="label" layoutX="52.0" layoutY="223.0"
prefHeight="16.0" prefWidth="96.0" text="Test !">
<font>
<Font size="29.0" />
</font>
</Label>
</children>
</AnchorPane>
</items>
</SplitPane>
</children>
</AnchorPane>
</items>
</SplitPane>
</children>
</AnchorPane>
</items>
</SplitPane>
</children>
</AnchorPane>
Note: I made this interface with the help of Gluon's SceneBuilder.
Thank you in advance.

Answer 1

In SceneBuilder if I click on the root SplitPane and slide it's divider to the right, I get this picture below. This means that at some point your min values on the highlighted AnchorPane is greater than it's parent's current width.
I basically set most of the later AnchorPanes' preferred width to USE_COMPUTER_SIZE and the highlighted AnchorPane's min width to USE_PRE_SIZE and it's preferred width to USE_COMPUTER_SIZE. Here is the code I used to fix the problem:
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.SplitPane?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.text.Font?>
<AnchorPane id="AnchorPane" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" minHeight="250.0" minWidth="400.0" prefHeight="519.0" prefWidth="921.0" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1" fx:controller="application.view.Controller">
<children>
<SplitPane dividerPositions="0.49836779107725787" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" prefHeight="799.0" prefWidth="1250.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
<items>
<AnchorPane minHeight="400.0" minWidth="400.0" prefHeight="511.0" prefWidth="467.0" rotate="0.0" />
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="797.0" prefWidth="349.0">
<children>
<SplitPane layoutX="17.0" layoutY="7.0" orientation="VERTICAL" prefHeight="797.0" prefWidth="346.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
<items>
<AnchorPane>
<children>
<SplitPane dividerPositions="0.5248796147672552" minHeight="-Infinity" minWidth="-Infinity" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
<items>
<AnchorPane maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" minHeight="0.0" minWidth="0.0" />
<AnchorPane maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" minHeight="0.0" minWidth="0.0" prefHeight="110.0" prefWidth="87.0">
<children>
<Label fx:id="label" layoutX="52.0" layoutY="223.0" prefHeight="16.0" prefWidth="96.0" text="Test !">
<font>
<Font size="29.0" />
</font>
</Label>
</children>
</AnchorPane>
</items>
</SplitPane>
</children>
</AnchorPane>
</items>
</SplitPane>
</children>
</AnchorPane>
</items>
</SplitPane>
</children>
</AnchorPane>