JavaFX: Snakes And Ladders - Represent snakes and ladders images in a GridPane - javafx

I am creating the game Snakes And Ladders. The 10x10 matrix you see is a GridPane where every cell contains a colored Pane.
PROBLEM: I want to place images instead of the arrows you see above that represent the snakes and the ladders.
Is spanning multiple columns a solution? Because for example at cell 3
to 37 the ladder needs to be a bit rotated.
Edit: Here is my code concerning the GridPane:
<GridPane fx:id="gameGrid" alignment="CENTER" hgap="2.0" style="-fx-background-color:#000" vgap="2.0" BorderPane.alignment="CENTER">
<columnConstraints>
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints halignment="CENTER" hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
<ColumnConstraints halignment="CENTER" 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 minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
</rowConstraints>
<children>
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="0" GridPane.rowIndex="0" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="0" GridPane.rowIndex="1" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="0" GridPane.rowIndex="2" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="0" GridPane.rowIndex="3" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="0" GridPane.rowIndex="4" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="0" GridPane.rowIndex="5" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="0" GridPane.rowIndex="6" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="0" GridPane.rowIndex="7" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="0" GridPane.rowIndex="8" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="0" GridPane.rowIndex="9" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="1" GridPane.rowIndex="0" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="1" GridPane.rowIndex="1" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="1" GridPane.rowIndex="2" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="1" GridPane.rowIndex="3" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="1" GridPane.rowIndex="4" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="1" GridPane.rowIndex="5" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="1" GridPane.rowIndex="6" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="1" GridPane.rowIndex="7" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="1" GridPane.rowIndex="8" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="1" GridPane.rowIndex="9" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="2" GridPane.rowIndex="0" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="2" GridPane.rowIndex="1" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="2" GridPane.rowIndex="2" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="2" GridPane.rowIndex="3" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="2" GridPane.rowIndex="4" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="2" GridPane.rowIndex="5" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="2" GridPane.rowIndex="6" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="2" GridPane.rowIndex="7" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="2" GridPane.rowIndex="8" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="2" GridPane.rowIndex="9" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="3" GridPane.rowIndex="0" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="3" GridPane.rowIndex="1" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="3" GridPane.rowIndex="2" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="3" GridPane.rowIndex="3" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="3" GridPane.rowIndex="4" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="3" GridPane.rowIndex="5" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="3" GridPane.rowIndex="6" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="3" GridPane.rowIndex="7" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="3" GridPane.rowIndex="8" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="3" GridPane.rowIndex="9" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="4" GridPane.rowIndex="0" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="4" GridPane.rowIndex="1" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="4" GridPane.rowIndex="2" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="4" GridPane.rowIndex="3" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="4" GridPane.rowIndex="4" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="4" GridPane.rowIndex="5" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="4" GridPane.rowIndex="6" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="4" GridPane.rowIndex="7" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="4" GridPane.rowIndex="8" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="4" GridPane.rowIndex="9" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="5" GridPane.rowIndex="0" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="5" GridPane.rowIndex="1" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="5" GridPane.rowIndex="2" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="5" GridPane.rowIndex="3" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="5" GridPane.rowIndex="4" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="5" GridPane.rowIndex="5" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="5" GridPane.rowIndex="6" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="5" GridPane.rowIndex="7" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="5" GridPane.rowIndex="8" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="5" GridPane.rowIndex="9" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="6" GridPane.rowIndex="0" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="6" GridPane.rowIndex="1" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="6" GridPane.rowIndex="2" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="6" GridPane.rowIndex="3" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="6" GridPane.rowIndex="4" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="6" GridPane.rowIndex="5" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="6" GridPane.rowIndex="6" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="6" GridPane.rowIndex="7" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="6" GridPane.rowIndex="8" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="6" GridPane.rowIndex="9" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="7" GridPane.rowIndex="0" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="7" GridPane.rowIndex="1" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="7" GridPane.rowIndex="2" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="7" GridPane.rowIndex="3" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="7" GridPane.rowIndex="4" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="7" GridPane.rowIndex="5" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="7" GridPane.rowIndex="6" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="7" GridPane.rowIndex="7" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="7" GridPane.rowIndex="8" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="7" GridPane.rowIndex="9" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="8" GridPane.rowIndex="0" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="8" GridPane.rowIndex="1" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="8" GridPane.rowIndex="2" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="8" GridPane.rowIndex="3" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="8" GridPane.rowIndex="4" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="8" GridPane.rowIndex="5" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="8" GridPane.rowIndex="6" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="8" GridPane.rowIndex="7" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="8" GridPane.rowIndex="8" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="8" GridPane.rowIndex="9" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="9" GridPane.rowIndex="0" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="9" GridPane.rowIndex="1" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="9" GridPane.rowIndex="2" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="9" GridPane.rowIndex="3" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="9" GridPane.rowIndex="4" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="9" GridPane.rowIndex="5" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="9" GridPane.rowIndex="6" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="9" GridPane.rowIndex="7" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="9" GridPane.rowIndex="8" />
<Pane onMouseClicked="#onCellClick" style="-fx-background-color:#966F33" GridPane.columnIndex="9" GridPane.rowIndex="9" />
</children>
<BorderPane.margin>
<Insets bottom="5.0" top="5.0" />
</BorderPane.margin>
</GridPane>
The FXML design is: http://prntscr.com/k8fpys

I found the solution !!!
The hierarchy is:
I used a BorderPane as the base.
At the CENTER I placed a normal Pane (Panes don't have any constraints so it's very useful in my case).
I used a GridPane with each cell containg a Pane.
I scaled my images wherever I wanted to and set them to disabled and set mouseTransparent to true.
As you see the images are on top of the GridPane and I used Panes in each cell of the GridPane so I can apply an onMouseClick handler.

Related

JavaFX ComboBox: Pop-up is getting shifted when screen is full size

I am struggling now for a long time with the following issue:
I created a ComboBox that looks perfectly fine as long as the screen is not full size, see picture
But if I full size the screen then the Pop-up is getting shifted, see picture below.
Has anybody any idea what might be the issue?
Environment details: Java 11.06, Windows 10, Intellij Idea Community Version
Here is the code:
<ComboBox fx:id="comboTokenType" editable="false" focusTraversable="false" GridPane.columnIndex="3" GridPane.hgrow="NEVER" GridPane.rowIndex="5" GridPane.vgrow="NEVER">
<items>
<FXCollections fx:factory="observableArrayList">
<String fx:value="Test 1" />
<String fx:value="Test 2" />
<String fx:value="Test 3" />
<String fx:value="Test 4" />
<String fx:value="Test 5" />
<String fx:value="Test 6" />
</FXCollections>
</items>
<value>
<String fx:value="Test 5" />
</value>
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</GridPane.margin>
</ComboBox>
.combo-box .list-cell {
-fx-text-fill: -fx-white-color;
}
.combo-box-popup .list-view{
-fx-background-color: -fx-primary-color;
-fx-background-insets: 0, 1, 2, 0;
-fx-background-radius: 0;
-fx-padding: 0;
}
.combo-box-popup .list-view .list-cell{
-fx-text-fill: white;
/* -fx-padding: 4 0 4 5;*/
-fx-background-color: -fx-primary-color;
-fx-background-radius: 0;
}
.combo-box-popup .list-view .list-cell:filled:selected, .combo-box-popup .list-view .list-cell:filled:selected:hover{
-fx-background-color: -fx-secondary-color;
-fx-text-fill: white;
}
.combo-box-popup .list-view .list-cell:filled:hover{
-fx-background-color: -fx-secondary-color;
-fx-text-fill: white;
}
.combo-box-base{
-fx-background-color: -fx-primary-color;
-fx-background-radius: 0;
-fx-padding: 0; /* 2 */
}
.combo-box-base:hover{
-fx-background-color: -fx-secondary-color;
}
.combo-box-base:focused{
-fx-background-color: -fx-secondary-color;
}
.combo-box-base:selected{
-fx-background-color: -fx-secondary-color;
}
.combo-box-base:showing{
-fx-background-color: -fx-secondary-color;
}
.combo-box-base .arrow {
-fx-shape: "M8.124,13.625l4.125-3.375v2.889l-4.125,3.86L4,13.139V10.25L8.124,13.625z";
-fx-background-color: white;
}
.context-menu {
-fx-background-color: -fx-primary-color;
}
Update
I tested the ComboBox without my custom code but I still getting this issue.
Again Update
I created now a small JavaFX project and removed everything that is actually not needed, just the FXML page with the comboBox. It turns out that comboBox is now working perfectly fine. I think the issue needs to be outside this FXML page. Maybe I need to dive deeper into the BorderPane that builds up the entire page.
I am going to publish the result as soon as I found the issue.
Here is the code:
fxml_example.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import javafx.collections.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>
<?import java.net.*?>
<ScrollPane fitToHeight="true" fitToWidth="true" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" xmlns="http://javafx.com/javafx/16" xmlns:fx="http://javafx.com/fxml/1">
<content>
<GridPane alignment="CENTER" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" HBox.hgrow="ALWAYS">
<Separator halignment="LEFT" nodeOrientation="LEFT_TO_RIGHT" GridPane.columnIndex="2" GridPane.columnSpan="4" GridPane.halignment="CENTER" GridPane.hgrow="ALWAYS" GridPane.rowSpan="1" GridPane.valignment="CENTER">
<GridPane.margin>
<Insets bottom="5.0" top="5.0" />
</GridPane.margin>
</Separator>
<Label alignment="CENTER_RIGHT" contentDisplay="RIGHT" text="Test 1" textAlignment="JUSTIFY" wrapText="true" GridPane.columnSpan="1" GridPane.halignment="LEFT" GridPane.hgrow="ALWAYS" GridPane.rowSpan="1">
<GridPane.margin>
<Insets bottom="5.0" left="50.0" right="5.0" top="5.0" />
</GridPane.margin>
</Label>
<Label alignment="TOP_LEFT" contentDisplay="TOP" text="Test 2" GridPane.columnIndex="2" GridPane.halignment="RIGHT" GridPane.hgrow="ALWAYS" GridPane.rowIndex="2">
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="20.0" top="5.0" />
</GridPane.margin>
</Label>
<RadioButton alignment="CENTER_LEFT" graphicTextGap="10.0" mnemonicParsing="false" nodeOrientation="LEFT_TO_RIGHT" text="Test 3" GridPane.columnIndex="3" GridPane.halignment="CENTER" GridPane.hgrow="ALWAYS" GridPane.rowIndex="2" GridPane.valignment="CENTER">
<toggleGroup>
<ToggleGroup fx:id="format" />
</toggleGroup>
<GridPane.margin>
<Insets bottom="5.0" right="5.0" top="5.0" />
</GridPane.margin>
</RadioButton>
<RadioButton alignment="CENTER_LEFT" graphicTextGap="10.0" mnemonicParsing="false" nodeOrientation="LEFT_TO_RIGHT" text="Test 555" GridPane.columnIndex="4" GridPane.halignment="LEFT" GridPane.hgrow="ALWAYS" GridPane.rowIndex="2" GridPane.valignment="CENTER">
<toggleGroup>
<fx:reference source="format" />
</toggleGroup>
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</GridPane.margin>
</RadioButton>
<Label text="Test 5" GridPane.columnIndex="2" GridPane.halignment="RIGHT" GridPane.hgrow="ALWAYS" GridPane.rowIndex="5">
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="20.0" top="5.0" />
</GridPane.margin>
</Label>
<ComboBox editable="false" focusTraversable="false" GridPane.columnIndex="3" GridPane.hgrow="NEVER" GridPane.rowIndex="5" GridPane.vgrow="NEVER">
<items>
<FXCollections fx:factory="observableArrayList">
<String fx:value="Test 1" />
<String fx:value="Test 2" />
<String fx:value="Test 3" />
<String fx:value="Test 4" />
<String fx:value="Test 5" />
<String fx:value="Test 6" />
</FXCollections>
</items>
<value>
<String fx:value="Test 1" />
</value>
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</GridPane.margin>
</ComboBox>
<Text styleClass="table-label" text="Test 8" textAlignment="RIGHT" GridPane.halignment="LEFT" GridPane.hgrow="ALWAYS" GridPane.rowIndex="6">
<GridPane.margin>
<Insets bottom="5.0" left="50.0" right="5.0" top="5.0" />
</GridPane.margin>
</Text>
<Separator GridPane.columnIndex="2" GridPane.columnSpan="4" GridPane.halignment="CENTER" GridPane.hgrow="ALWAYS" GridPane.rowIndex="6" GridPane.rowSpan="1" GridPane.valignment="CENTER">
<GridPane.margin>
<Insets bottom="5.0" top="5.0" />
</GridPane.margin>
</Separator>
<Label graphicTextGap="10.0" text="Test 9" GridPane.columnIndex="2" GridPane.halignment="RIGHT" GridPane.hgrow="ALWAYS" GridPane.rowIndex="8">
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="20.0" top="5.0" />
</GridPane.margin>
</Label>
<TextField GridPane.columnIndex="3" GridPane.hgrow="ALWAYS" GridPane.rowIndex="8">
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</GridPane.margin>
</TextField>
<Label text="Test 10" GridPane.columnIndex="2" GridPane.halignment="RIGHT" GridPane.hgrow="ALWAYS" GridPane.rowIndex="10">
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="20.0" top="5.0" />
</GridPane.margin>
</Label>
<PasswordField GridPane.columnIndex="3" GridPane.hgrow="ALWAYS" GridPane.rowIndex="10">
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</GridPane.margin>
</PasswordField>
<Label alignment="CENTER" contentDisplay="TEXT_ONLY" nodeOrientation="LEFT_TO_RIGHT" text="Test 11" GridPane.columnIndex="4" GridPane.halignment="LEFT" GridPane.hgrow="ALWAYS" GridPane.rowIndex="10" GridPane.valignment="CENTER">
<GridPane.margin>
<Insets bottom="5.0" left="80.0" right="5.0" top="5.0" />
</GridPane.margin>
</Label>
<PasswordField GridPane.columnIndex="5" GridPane.hgrow="ALWAYS" GridPane.rowIndex="10">
<GridPane.margin>
<Insets bottom="5.0" right="10.0" top="5.0" />
</GridPane.margin>
</PasswordField>
<Text styleClass="table-label" text="Test 15" textAlignment="RIGHT" GridPane.halignment="LEFT" GridPane.hgrow="ALWAYS" GridPane.rowIndex="13">
<GridPane.margin>
<Insets bottom="5.0" left="50.0" right="5.0" top="5.0" />
</GridPane.margin>
</Text>
<Separator GridPane.columnIndex="2" GridPane.columnSpan="4" GridPane.halignment="CENTER" GridPane.hgrow="ALWAYS" GridPane.rowIndex="13" GridPane.rowSpan="1" GridPane.valignment="CENTER">
<GridPane.margin>
<Insets bottom="5.0" top="5.0" />
</GridPane.margin>
</Separator>
<Label text="Test 18" GridPane.columnIndex="2" GridPane.halignment="RIGHT" GridPane.hgrow="ALWAYS" GridPane.rowIndex="15">
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="20.0" top="5.0" />
</GridPane.margin>
</Label>
<PasswordField GridPane.columnIndex="3" GridPane.hgrow="ALWAYS" GridPane.rowIndex="15">
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</GridPane.margin>
</PasswordField>
<Label text="Test 25" GridPane.columnIndex="4" GridPane.halignment="LEFT" GridPane.rowIndex="15">
<HBox.margin>
<Insets bottom="5.0" left="20.0" top="5.0" />
</HBox.margin>
<GridPane.margin>
<Insets bottom="5.0" left="80.0" right="5.0" top="5.0" />
</GridPane.margin>
</Label>
<PasswordField GridPane.columnIndex="5" GridPane.hgrow="ALWAYS" GridPane.rowIndex="15">
<GridPane.margin>
<Insets bottom="5.0" right="10.0" top="5.0" />
</GridPane.margin>
</PasswordField>
<Label text="Test 111" GridPane.columnSpan="1" GridPane.halignment="LEFT" GridPane.hgrow="ALWAYS" GridPane.rowIndex="18">
<GridPane.margin>
<Insets bottom="5.0" left="50.0" right="5.0" top="5.0" />
</GridPane.margin>
</Label>
<Separator GridPane.columnIndex="2" GridPane.columnSpan="4" GridPane.halignment="CENTER" GridPane.hgrow="ALWAYS" GridPane.rowIndex="18" GridPane.valignment="CENTER">
<GridPane.margin>
<Insets bottom="5.0" top="5.0" />
</GridPane.margin>
</Separator>
<Label style="-fx-text-alignment: center;" text="" GridPane.columnIndex="3" GridPane.columnSpan="2" GridPane.rowIndex="19" />
<Button defaultButton="true" graphicTextGap="10.0" mnemonicParsing="false" nodeOrientation="LEFT_TO_RIGHT" text="Test 123" wrapText="true" GridPane.columnIndex="5" GridPane.hgrow="ALWAYS" GridPane.rowIndex="19">
<graphic>
<ImageView fitHeight="30.0" fitWidth="30.0" pickOnBounds="true" preserveRatio="true">
<image>
<Image url="#background.jpg" />
</image>
</ImageView>
</graphic>
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="10.0" top="5.0" />
</GridPane.margin>
</Button>
<GridPane.margin>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</GridPane.margin>
<columnConstraints>
<ColumnConstraints halignment="LEFT" hgrow="NEVER" prefWidth="300.0" />
<ColumnConstraints halignment="LEFT" hgrow="NEVER" minWidth="10.0" prefWidth="10.0" />
<ColumnConstraints halignment="LEFT" hgrow="NEVER" />
<ColumnConstraints halignment="LEFT" hgrow="NEVER" />
<ColumnConstraints />
<ColumnConstraints />
<ColumnConstraints />
</columnConstraints>
<rowConstraints>
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="ALWAYS" />
</rowConstraints>
<padding>
<Insets left="30.0" right="30.0" />
</padding>
<stylesheets>
<URL value="# any css" />
</stylesheets>
</GridPane>
</content>
<padding>
<Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
</padding>
</ScrollPane>
FXMLExample.java
package fxmlexample;
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;
public class FXMLExample extends Application {
public static void main(String[] args) {
Application.launch(FXMLExample.class, args);
}
#Override
public void start(Stage stage) throws Exception {
Parent root = FXMLLoader.load(getClass().getResource("fxml_example.fxml"));
stage.setTitle("FXML Welcome");
stage.setScene(new Scene(root, 300, 275));
stage.show();
}
}
I use Debian 11 with XFCE. I noticed a similar issue when using multiple monitors. In my opinion it's something related to different monitors with different resolutions. My primary screen is FHD and secondary is 2K. So if I set the 2K monitor as primary the combobox is popping up in the correct position.

JavaFX Label doesn't set text

I'm doing a Calendar with JavaFX SceneBuilder.
I declare my Label on my Main class:
public class Main extends Application {
//Calendar used
public Calendar cal;
//variables for get the number of week+current year
public static int weeks, year;
#FXML
//Text areas for the 4 weeks column
public TextArea week1,week2,week3,week4;
#FXML
//4 control Buttons
public Button prev,next,next2,prev2, start;
#FXML
//Labels
public Label lab1;
And the method which I'm trying to set text is this one:
public void ClickStart (ActionEvent event){
lab1=new Label();
lab1.setText("hola");
cal=Calendar.getInstance();
year = cal.get(Calendar.YEAR);
weeks= cal.get(Calendar.WEEK_OF_YEAR);
week1.setText("Week " + Integer.toString(weeks) + " " + Integer.toString(year));
cal.add(Calendar.WEEK_OF_YEAR, 1);
weeks= cal.get(Calendar.WEEK_OF_YEAR);
year = cal.get(Calendar.YEAR);
week2.setText("Week " + Integer.toString(weeks) + " " + Integer.toString(year));
cal.add(Calendar.WEEK_OF_YEAR, 1);
weeks= cal.get(Calendar.WEEK_OF_YEAR);
year = cal.get(Calendar.YEAR);
week3.setText("Week " + Integer.toString(weeks) + " " + Integer.toString(year));
cal.add(Calendar.WEEK_OF_YEAR, 1);
weeks= cal.get(Calendar.WEEK_OF_YEAR);
year = cal.get(Calendar.YEAR);
week4.setText("Week " + Integer.toString(weeks) + " " + Integer.toString(year));
cal.add(Calendar.WEEK_OF_YEAR, -3);
}
I include also my .fmxl file if necessary:
<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.layout.VBox?>
<GridPane xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/2.2" fx:controller="application.Main">
<children>
<GridPane>
<children>
<GridPane>
<children>
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Monday" wrapText="true" GridPane.columnIndex="1" GridPane.rowIndex="0" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Tuesday" wrapText="true" GridPane.columnIndex="2" GridPane.rowIndex="0" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Wednesday" wrapText="true" GridPane.columnIndex="3" GridPane.rowIndex="0" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Thursday" wrapText="true" GridPane.columnIndex="4" GridPane.rowIndex="0" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Friday" wrapText="true" GridPane.columnIndex="5" GridPane.rowIndex="0" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Saturday" wrapText="true" GridPane.columnIndex="6" GridPane.rowIndex="0" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Sunday" wrapText="true" GridPane.columnIndex="7" GridPane.rowIndex="0" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Monday" wrapText="true" GridPane.columnIndex="1" GridPane.rowIndex="9" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Tuesday" wrapText="true" GridPane.columnIndex="2" GridPane.rowIndex="9" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Wednesday" wrapText="true" GridPane.columnIndex="3" GridPane.rowIndex="9" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Thursday" wrapText="true" GridPane.columnIndex="4" GridPane.rowIndex="9" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Friday" wrapText="true" GridPane.columnIndex="5" GridPane.rowIndex="9" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Saturday" wrapText="true" GridPane.columnIndex="6" GridPane.rowIndex="9" />
<TextArea editable="false" mouseTransparent="false" prefWidth="200.0" text="Sunday" wrapText="true" GridPane.columnIndex="7" GridPane.rowIndex="9" />
<Button id="prev" fx:id="prev2" mnemonicParsing="false" onAction="#ClickMinus" prefHeight="30.0" prefWidth="70.0" text="prev" GridPane.columnIndex="8" GridPane.rowIndex="0" />
<Button fx:id="next" mnemonicParsing="false" onAction="#ClickPlus" prefHeight="29.999900000002526" prefWidth="70.00009999999747" text="next" GridPane.columnIndex="0" GridPane.rowIndex="9" />
<Button fx:id="next2" mnemonicParsing="false" onAction="#ClickPlus" prefHeight="30.0" prefWidth="70.0" text="next" GridPane.columnIndex="8" GridPane.rowIndex="9" />
<Button fx:id="prev" mnemonicParsing="false" onAction="#ClickMinus" prefHeight="30.0" prefWidth="70.0" text="prev" GridPane.columnIndex="0" GridPane.rowIndex="0" />
<TextArea fx:id="week1" prefWidth="200.0" text="Week x Year x" wrapText="true" GridPane.columnIndex="0" GridPane.rowIndex="2" />
<TextArea fx:id="week2" prefWidth="200.0" text="Week x Year x" wrapText="true" GridPane.columnIndex="0" GridPane.rowIndex="4" />
<TextArea fx:id="week4" prefWidth="200.0" text="Week x Year x" wrapText="true" GridPane.columnIndex="0" GridPane.rowIndex="8" />
<Label id= "lab1" fx:id="lab1" prefHeight="40.000099999997474" prefWidth="150.0" text="" GridPane.columnIndex="1" GridPane.rowIndex="1" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="2" GridPane.rowIndex="1" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="3" GridPane.rowIndex="1" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="4" GridPane.rowIndex="1" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="5" GridPane.rowIndex="1" />
<Label minHeight="14.0" prefHeight="14.0" prefWidth="150.0" text="Label" GridPane.columnIndex="1" GridPane.rowIndex="3" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="2" GridPane.rowIndex="3" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="3" GridPane.rowIndex="3" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="2" GridPane.rowIndex="5" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="1" GridPane.rowIndex="5" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="3" GridPane.rowIndex="5" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="4" GridPane.rowIndex="5" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="4" GridPane.rowIndex="3" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="5" GridPane.rowIndex="3" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="5" GridPane.rowIndex="5" />
<Label prefHeight="533.0" prefWidth="70.0" text="Label" GridPane.columnIndex="1" GridPane.rowIndex="7" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="2" GridPane.rowIndex="7" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="6" GridPane.rowIndex="1" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="7" GridPane.rowIndex="1" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="6" GridPane.rowIndex="3" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="3" GridPane.rowIndex="7" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="4" GridPane.rowIndex="7" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="5" GridPane.rowIndex="7" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="6" GridPane.rowIndex="5" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="6" GridPane.rowIndex="7" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="7" GridPane.rowIndex="7" />
<Label prefHeight="44.0" prefWidth="87.0" text="Label" GridPane.columnIndex="7" GridPane.rowIndex="5" />
<Label prefHeight="44.0" prefWidth="139.0" text="Label" GridPane.columnIndex="7" GridPane.rowIndex="3" />
<TextArea fx:id="week3" prefHeight="100.00009999999747" prefWidth="70.0" text="Week x Year x" wrapText="true" GridPane.columnIndex="0" GridPane.rowIndex="6" />
<Button fx:id="start" mnemonicParsing="false" onAction="#ClickStart" prefHeight="30.0" prefWidth="70.0" text="Start" GridPane.columnIndex="0" GridPane.rowIndex="1" />
</children>
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="70.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="150.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="150.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="150.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="150.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="150.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="150.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="150.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="70.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="100.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="100.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="100.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="100.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
</rowConstraints>
</GridPane>
</children>
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
</rowConstraints>
</GridPane>
</children>
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" vgrow="SOMETIMES" />
</rowConstraints>
</GridPane>
The problem is that when I run the application and I press my Start button, the label doesn't change to the text given(By default is on 'empty').
Since you already have the solution in the comments, I'll just give you a short explanation of why deleting
lab1 = new Label();
solved the problem.
When you declared lab1 in your fxml file you told the JavaFX FXMLLoader to instantiate thisLabel for you. So essentially it did the new Label() call for you. It then passes a reference to the Label that it created to the variable lab1 of your class Main. When you changed lab1 to reference your newly created label in lab1 = new Label(); you overwrote the reference to the label that is in your UI. That new label is not yet added to any Scene and is not shown, so when you change its text, the change is not visible.

How to do "responsive" design in javafx?

I've got some troubles with javafx.
I've got a FXML file with two tables views and text fields above each and between them.
This FXML is included in another FXML, in a tabPane.
The app is a big application, with many fxmls and includes inside.
So i can't bind my fxml with the scene.
The issue comes with the height of the view.
In my FXML's "row constraints" the sum of all percent of them is 100, but the visual is not good, there is an overflow with small resolutions like 1360x768.
I solved the issue with a scrollPane and the option "AS_Needed", but i don't understand why my tableviews are not reduced when the screen is small.
For example :
the row of the tableview is : <RowConstraints percentHeight="20"/>
if i put the value 15 instead of 20 the tableview is reduced. But The sum of all Row Constraints isn't 100 anymore. And if i keep 20, there is an overflow...
Does anybody have a solution ?
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import fr.sdgib.app.tools.* ?>
<GridPane fx:id="gp" alignment="TOP_CENTER" styleClass="gpDetails" gridLinesVisible="true" xmlns="http://javafx.com/javafx/8.0.40"
xmlns:fx="http://javafx.com/fxml/1" fx:controller="xxx.xxx.xxx.xxx.xxxController">
<children>
<Label styleClass="lblSousTitre" text="Contrats : " GridPane.columnIndex="1" GridPane.rowIndex="0" GridPane.columnSpan="2"/>
<Label text="Recherche :" GridPane.columnIndex="1" GridPane.rowIndex="1"/>
<TextField fx:id="tfRechercheContrat" promptText="Recherche" GridPane.columnIndex="2" GridPane.rowIndex="1" onKeyPressed="#rechercherContrat"/>
<TableView fx:id="tvContrat" GridPane.columnIndex="1" GridPane.rowIndex="2" GridPane.columnSpan="2">
<columns>
<TableColumn fx:id="colNum" text="NUMERO DE CONTRAT"/>
<TableColumn fx:id="colMontantFixe" text="MONTANT FIXE"/>
<TableColumn fx:id="colMontant" text="MONTANT"/>
<TableColumn fx:id="colType" text="TYPE"/>
</columns>
</TableView>
<GridPane fx:id="gpFormContrat" gridLinesVisible="false" GridPane.columnIndex="1" GridPane.rowIndex="3" visible="true" GridPane.columnSpan="2">
<children>
<Label text="Type : " GridPane.columnIndex="0" GridPane.rowIndex="0"/>
<ComboBox fx:id="cbxType" styleClass="cbxFiche" GridPane.columnIndex="1" GridPane.rowIndex="0" disable="true"/>
<Label text="xxx : " GridPane.columnIndex="3" GridPane.rowIndex="0"/>
<ComboBox fx:id="cbxxxx" styleClass="cbx" GridPane.columnIndex="4" GridPane.rowIndex="0" disable="true"/>
<Label fx:id="lblMontant1" text="Montant xxx: " GridPane.columnIndex="0" GridPane.rowIndex="1"/>
<TextFieldLimited fx:id="tfMontant1" maxlength="200" promptText="Montant " GridPane.columnIndex="1" GridPane.rowIndex="1" disable="true"/>
<Label fx:id="lblMontant 2" text="Montant xxx : " GridPane.columnIndex="3" GridPane.rowIndex="1"/>
<TextFieldLimited fx:id="tfMontant2" maxlength="200" promptText="Montant 2" GridPane.columnIndex="4" GridPane.rowIndex="1" />
<Label fx:id="lblErrorContrat" GridPane.columnIndex="0" GridPane.rowIndex="2" GridPane.columnSpan="5"/>
<Button fx:id="btnSupprimerContrat" styleClass="btnSupprimer" text="SUPPRIMER" visible="true" GridPane.columnIndex="4" GridPane.halignment="CENTER" GridPane.rowIndex="3" disable="true" onAction="#supprimerContrat"/>
<Button fx:id="btnValiderContrat" styleClass="btnValider" text="VALIDER" visible="true" GridPane.columnIndex="4" GridPane.halignment="RIGHT" GridPane.rowIndex="3" disable="true" onAction="#validerContrat"/>
</children>
<columnConstraints>
<ColumnConstraints percentWidth="20"/>
<ColumnConstraints percentWidth="28"/>
<ColumnConstraints percentWidth="2"/>
<ColumnConstraints percentWidth="20"/>
<ColumnConstraints percentWidth="30"/>
</columnConstraints>
<rowConstraints>
<RowConstraints />
<RowConstraints />
<RowConstraints />
<RowConstraints />
</rowConstraints>
</GridPane>
<Label styleClass="lblSousTitre" text="Contrats disponibles : " GridPane.columnIndex="1" GridPane.rowIndex="4" GridPane.columnSpan="2"/>
<Label text="Recherche :" GridPane.columnIndex="1" GridPane.rowIndex="5"/>
<TextField fx:id="tfRechercheContratDispo" promptText="Recherche" GridPane.columnIndex="2" GridPane.rowIndex="5" onKeyPressed="#rechercherContratDispo"/>
<TableView fx:id="tvContratDispo" GridPane.columnIndex="1" GridPane.rowIndex="6" GridPane.columnSpan="2">
<columns>
<TableColumn fx:id="colNumDispo" text="NUMERO DE CONTRAT"/>
<TableColumn fx:id="colMontantFixeDispo" text="MONTANT FIXE"/>
<TableColumn fx:id="colMontantDispo" text="MONTANT"/>
<TableColumn fx:id="colTypeDispo" text="TYPE"/>
</columns>
</TableView>
</children>
<columnConstraints>
<ColumnConstraints percentWidth="5" />
<ColumnConstraints percentWidth="10" />
<ColumnConstraints percentWidth="80" />
<ColumnConstraints percentWidth="5" />
</columnConstraints>
<rowConstraints>
<RowConstraints percentHeight="5" />
<RowConstraints percentHeight="5" />
<RowConstraints percentHeight="30" />
<RowConstraints percentHeight="22" />
<RowConstraints percentHeight="5" />
<RowConstraints percentHeight="5" />
<RowConstraints percentHeight="26" />
<RowConstraints percentHeight="2" />
</rowConstraints>
</GridPane>
here 1368x768 : http://imgur.com/grBoRQH
and 1920x1080 : http://imgur.com/EnXFqCl

On hover focused blue background color

I am having one strange problem, though I have good knowdedge about css and all. But in javafx I am facing strange situation. When I take cursor away from the MenuItem, the background color goes blue.
Here is my code
<MenuButton id="scMenuButton" fx:id="searchCriteriaMenu" mnemonicParsing="false" nodeOrientation="LEFT_TO_RIGHT" text="Search Template" textFill="WHITE" wrapText="true">
<items>
<!-- <MenuItem id="scMenuItem" fx:id="scMenuItem" mnemonicParsing="false" style="-fx-background-color: transparent; -fx-padding: 0; -fx-margin: 0;">
<graphic> -->
<CustomMenuItem id="#searchCustomMenuItem" fx:id="scMenuItem" hideOnClick="false" mnemonicParsing="false" style="-fx-background-color: transparent; -fx-padding: 0; -fx-margin: 0;" styleClass="redBorder">
<content>
<VBox id="searchMbox" fx:id="advancedSearchVbox" prefHeight="406.0" prefWidth="359.0" style="-fx-font-weight: bold;" visible="false">
<children>
<AnchorPane id="searchAnchorPane" minHeight="0.0" minWidth="0.0" prefHeight="615.0" prefWidth="200.0" styleClass="noborder">
<children>
<HBox layoutY="76.0" minHeight="168.0" minWidth="345.0" prefHeight="168.0" prefWidth="357.0">
<children>
<ScrollPane hbarPolicy="NEVER" maxHeight="230.0" minWidth="355.0" prefHeight="216.0" prefWidth="355.0" vbarPolicy="AS_NEEDED">
<content>
<VBox fx:id="userSelectedValues" fillWidth="true" layoutY="5.0" maxWidth="355.0">
</VBox>
</content>
</ScrollPane>
</children>
</HBox>
<Group layoutY="-100.0">
<children>
<HBox layoutX="7.0" layoutY="350.0" prefHeight="35.0" prefWidth="348.0">
<children>
<Text layoutX="7.0" layoutY="335.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Template Name">
<HBox.margin>
<Insets right="5.0" top="9.0" />
</HBox.margin>
</Text>
<ComboBox fx:id="templateNameComboBox" layoutX="94.0" layoutY="330.0" prefWidth="248.0" promptText="Select Template Name">
<HBox.margin>
<Insets left="7.0" />
</HBox.margin>
</ComboBox>
</children>
</HBox>
<HBox layoutX="7.0" layoutY="385.0" prefHeight="35.0" prefWidth="348.0">
<children>
<Text strokeType="OUTSIDE" strokeWidth="0.0" text="Type of template">
<HBox.margin>
<Insets top="9.0" />
</HBox.margin>
</Text>
<ComboBox fx:id="templateTypeComboBox" prefWidth="248.0" promptText="Select Template Type">
<items>
<FXCollections fx:factory="observableArrayList">
<String fx:value="Private" />
<String fx:value="Public" />
</FXCollections>
</items>
<HBox.margin>
<Insets left="5.0" />
</HBox.margin>
</ComboBox>
</children>
</HBox>
<HBox alignment="TOP_CENTER" layoutX="-8.0" layoutY="422.0" prefHeight="100.0" prefWidth="360.0">
<children>
<CheckBox fx:id="defaultTemplate" mnemonicParsing="false" />
<Text strokeType="OUTSIDE" strokeWidth="0.0" text="Set as a default template">
<HBox.margin>
<Insets top="3.0" />
</HBox.margin>
</Text>
</children>
</HBox>
<HBox layoutX="5.0" layoutY="450.0" prefHeight="45.0" prefWidth="352.0">
<children>
<Button mnemonicParsing="false" onAction="#onSaveTemplate" prefHeight="45.0" prefWidth="67.0" styleClass="advancedRedButton" text="Save Template" textAlignment="CENTER" wrapText="true">
<cursor>
<Cursor fx:constant="HAND" />
</cursor></Button>
<Button mnemonicParsing="false" onAction="#onEditTemplate" prefHeight="45.0" prefWidth="67.0" styleClass="advancedRedButton" text="Edit Template" textAlignment="CENTER" wrapText="true">
<HBox.margin>
<Insets left="8.0" />
</HBox.margin>
<cursor>
<Cursor fx:constant="HAND" />
</cursor>
</Button>
<Button mnemonicParsing="false" onAction="#onDeleteTemplate" prefHeight="45.0" prefWidth="67.0" styleClass="advancedRedButton" text="Delete Template" textAlignment="CENTER" wrapText="true">
<HBox.margin>
<Insets left="8.0" />
</HBox.margin>
<cursor>
<Cursor fx:constant="HAND" />
</cursor>
</Button>
<Button mnemonicParsing="false" onAction="#onClearTemplate" prefHeight="45.0" prefWidth="55.0" styleClass="advancedRedButton" text="Clear" textAlignment="CENTER" wrapText="true">
<HBox.margin>
<Insets left="8.0" />
</HBox.margin>
<cursor>
<Cursor fx:constant="HAND" />
</cursor>
</Button>
<Button mnemonicParsing="false" onAction="#advancedSearch" prefHeight="45.0" prefWidth="55.0" styleClass="advancedRedButton" text="Search">
<HBox.margin>
<Insets left="8.0" />
</HBox.margin>
<cursor>
<Cursor fx:constant="HAND" />
</cursor>
</Button>
</children>
</HBox>
</children>
</Group>
<HBox layoutX="5.0" layoutY="5.0" prefHeight="73.0" prefWidth="348.0">
<children>
<GridPane fx:id="gridPane" hgap="3.0" layoutX="6.6" layoutY="60.6" prefHeight="43.0" prefWidth="348.0" vgap="1.0" AnchorPane.bottomAnchor="30.0" AnchorPane.leftAnchor="-3.0" AnchorPane.rightAnchor="-10.0" AnchorPane.topAnchor="51.0">
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" maxWidth="132.99999237060547" minWidth="10.0" prefWidth="126.0" />
<ColumnConstraints hgrow="SOMETIMES" maxWidth="102.0" minWidth="10.0" prefWidth="102.0" />
<ColumnConstraints hgrow="SOMETIMES" maxWidth="115.0" minWidth="10.0" prefWidth="86.0" />
<ColumnConstraints hgrow="SOMETIMES" maxWidth="76.0" minWidth="10.0" prefWidth="28.0" />
<ColumnConstraints />
</columnConstraints>
<rowConstraints>
<RowConstraints maxHeight="140.0" minHeight="10.0" prefHeight="24.0" vgrow="SOMETIMES" />
<RowConstraints maxHeight="275.0" minHeight="10.0" prefHeight="48.0" vgrow="SOMETIMES" />
</rowConstraints>
<children>
<Text strokeType="OUTSIDE" strokeWidth="0.0" text="Field" textAlignment="CENTER" wrappingWidth="35.9765625" GridPane.halignment="CENTER" GridPane.valignment="CENTER">
<styleClass>
<String fx:value="boldFont" />
<String fx:value="px16Font" />
</styleClass>
</Text>
<Text strokeType="OUTSIDE" strokeWidth="0.0" text="Operator" GridPane.columnIndex="1" GridPane.halignment="CENTER">
<styleClass>
<String fx:value="boldFont" />
<String fx:value="px16Font" />
</styleClass>
</Text>
<Text strokeType="OUTSIDE" strokeWidth="0.0" text="Value" GridPane.columnIndex="2" GridPane.halignment="CENTER">
<styleClass>
<String fx:value="boldFont" />
<String fx:value="px16Font" />
</styleClass>
</Text>
<ComboBox fx:id="fieldName" prefWidth="150.0" promptText="Select Field" GridPane.rowIndex="1">
<items>
<FXCollections fx:factory="observableArrayList">
<String fx:value="CLSMESSAGEID" />
<String fx:value="PAYMENTTYPE" />
<String fx:value="REQUESTTYPE" />
<String fx:value="VALUEDATE" />
</FXCollections>
</items>
</ComboBox>
<ComboBox fx:id="operator" prefWidth="150.0" promptText="Select Operator" GridPane.columnIndex="1" GridPane.rowIndex="1">
<items>
<FXCollections fx:factory="observableArrayList">
<String fx:value="IN" />
<String fx:value="NOT IN" />
<String fx:value="EQUALS" />
<String fx:value="NOT EQUALS" />
<String fx:value="LESS THAN" />
<String fx:value="LESS THAN EQUALS" />
<String fx:value="GREATER THAN" />
<String fx:value="GREATER THAN EQUALS" />
</FXCollections>
</items>
</ComboBox>
<TextField fx:id="fieldValue" GridPane.columnIndex="2" GridPane.rowIndex="1" />
<Button fx:id="addImage" mnemonicParsing="false" onAction="#addOptions" prefHeight="20.0" prefWidth="20.0" styleClass="addImg" GridPane.columnIndex="3" GridPane.rowIndex="1">
<GridPane.margin>
<Insets left="5.0" />
</GridPane.margin>
<cursor>
<Cursor fx:constant="HAND" />
</cursor>
</Button>
</children>
</GridPane>
</children>
</HBox>
</children>
</AnchorPane>
</children>
</VBox>
</content>
</CustomMenuItem>
<!-- </graphic>
</MenuItem> -->
</items>
<HBox.margin>
<Insets left="6.0" />
</HBox.margin>
<cursor>
<Cursor fx:constant="HAND" />
</cursor>
<styleClass>
<String fx:value="redButton" />
<String fx:value="whiteText" />
</styleClass>
</MenuButton>

Float hbox to parent

I am having fxml file which will show popup bottom right. But at first my fxml size is some what 500*700. If I make that file to maximum then, that HBox should go to bottom-right but right now it is sticking at its initial position.
How can I make that HBox floating as per the screen?
<?xml version="1.0" encoding="UTF-8"?>
<VBox minHeight="600.0" prefWidth="800.0" stylesheets="#NonRepudiation.css" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
<children>
<!-- <HBox> -->
<!-- <padding> -->
<!-- <Insets bottom="5.0" left="5.0" right="5.0" top="20.0" /> -->
<!-- </padding> -->
<!-- </HBox> -->
<HBox>
<children>
<TitledPane animated="true" layoutY="34.0" minWidth="-Infinity" prefHeight="580.0" prefWidth="366.0" style="-fx-font-weight: bold;" text="Filter Criteria" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.topAnchor="64.0">
<content>
<AnchorPane maxWidth="-Infinity" minWidth="-Infinity" prefHeight="580.0" prefWidth="356.0">
<children>
<TitledPane animated="true" minWidth="-Infinity" style="-fx-font-weight: bold;" styleClass="hiddenHeader" text="Filter Criteria" translateX="-20.0">
<font>
<Font name="Calibri Bold" size="11.0" />
</font>
</TitledPane>
<VBox prefHeight="580.0" prefWidth="359.0" style="-fx-font-weight: bold;">
<children>
<TitledPane animated="true" prefHeight="145.0" prefWidth="359.0" style="-fx-font-weight: bold;" styleClass="custom-pane" text="Quick Search">
<content>
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="90.0" prefWidth="357.0">
<children>
<VBox layoutX="10.0" layoutY="20.0">
<children>
<!--<HBox layoutX="10.0" layoutY="0.0" prefHeight="35.0"
prefWidth="318.0" spacing="8.0" styleClass="vbox-column"> <children> <Label
prefHeight="14.0" prefWidth="94.0" text="Value Date From"> <HBox.margin>
<Insets right="2.0" top="5.0" /> </HBox.margin> </Label> <DatePicker prefWidth="94.0"
/> <Label prefHeight="14.0" prefWidth="20.0" text=" To"> <HBox.margin> <Insets
top="5.0" /> </HBox.margin> </Label> <DatePicker prefWidth="94.0" /> </children>
<padding> <Insets top="10.0" /> </padding> </HBox> -->
<HBox layoutX="10.0" layoutY="20.0" prefHeight="35.0" prefWidth="345.0" spacing="8.0" styleClass="vbox-column">
<children>
<Label prefHeight="14.0" prefWidth="91.0" text="Deal Number">
<HBox.margin>
<Insets right="2.0" top="5.0" />
</HBox.margin>
</Label>
<TextField fx:id="dealNumber" prefWidth="160.0" />
</children>
<padding>
<Insets top="10.0" />
</padding>
</HBox>
<HBox layoutX="10.0" layoutY="50.0" prefHeight="35.0" prefWidth="345.0" spacing="8.0" styleClass="vbox-column">
<children>
<Label prefHeight="14.0" prefWidth="91.0" text="Digest Reference">
<HBox.margin>
<Insets right="2.0" top="5.0" />
</HBox.margin>
</Label>
<TextField fx:id="digestReference" prefWidth="160.0" />
<Button maxHeight="-Infinity" minHeight="22.0" mnemonicParsing="false" onAction="#onQuickSearch" styleClass="advancedRedButton" text="Search" />
</children>
<padding>
<Insets top="10.0" />
</padding>
</HBox>
</children>
</VBox>
</children>
</AnchorPane>
</content>
</TitledPane>
<TitledPane animated="true" prefHeight="430.0" prefWidth="359.0" style="-fx-border-width: 1 1 0 1;" styleClass="custom-pane" text="Advanced Search">
<content>
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="580.0" prefWidth="357.0">
<children>
<HBox layoutX="7.0" layoutY="1.0" prefHeight="336.0" prefWidth="341.0">
<children>
<GridPane hgap="3.0" layoutX="6.6" layoutY="40.0" prefHeight="223.0" prefWidth="341.0" vgap="1.0" AnchorPane.bottomAnchor="30.0" AnchorPane.leftAnchor="-3.0" AnchorPane.rightAnchor="-10.0" AnchorPane.topAnchor="51.0">
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" maxWidth="132.99999237060547" minWidth="10.0" prefWidth="122.0" />
<ColumnConstraints hgrow="SOMETIMES" maxWidth="101.0" minWidth="10.0" prefWidth="92.0" />
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints maxHeight="43.0" minHeight="7.0" prefHeight="22.0" vgrow="SOMETIMES" />
<RowConstraints maxHeight="88.0" minHeight="10.0" prefHeight="28.0" vgrow="SOMETIMES" />
<RowConstraints maxHeight="107.0" minHeight="10.0" prefHeight="29.0" vgrow="SOMETIMES" />
<RowConstraints maxHeight="119.0" minHeight="10.0" prefHeight="29.0" vgrow="SOMETIMES" />
<RowConstraints maxHeight="133.0" minHeight="0.0" prefHeight="20.0" vgrow="SOMETIMES" />
<RowConstraints maxHeight="138.0" minHeight="0.0" prefHeight="79.0" vgrow="SOMETIMES" />
</rowConstraints>
<children>
<Text strokeType="OUTSIDE" strokeWidth="0.0" style="-fx-font-weight: bold; -fx-font-size: 14px;" text="Field" textAlignment="CENTER" wrappingWidth="35.9765625" GridPane.halignment="CENTER" GridPane.valignment="CENTER">
</Text>
<Text strokeType="OUTSIDE" strokeWidth="0.0" style="-fx-font-weight: bold; -fx-font-size: 14px;" text="Operator" GridPane.columnIndex="1" GridPane.halignment="CENTER">
</Text>
<Text strokeType="OUTSIDE" strokeWidth="0.0" style="-fx-font-weight: bold; -fx-font-size: 14px;" text="Value" GridPane.columnIndex="2" GridPane.halignment="CENTER">
</Text>
<ComboBox fx:id="advOperator1" prefWidth="150.0" promptText="Select Operator" GridPane.columnIndex="1" GridPane.rowIndex="1">
<items>
<FXCollections fx:factory="observableArrayList">
<String fx:value="IN" />
<String fx:value="NOT IN" />
<String fx:value="EQUALS" />
<String fx:value="NOT EQUALS" />
<String fx:value="LESS THAN" />
<String fx:value="LESS THAN EQUALS" />
<String fx:value="GREATER THAN" />
<String fx:value="GREATER THAN EQUALS" />
</FXCollections>
</items>
</ComboBox>
<ComboBox fx:id="advOperator2" prefWidth="150.0" promptText="Select Operator" GridPane.columnIndex="1" GridPane.rowIndex="2">
<items>
<FXCollections fx:factory="observableArrayList">
<String fx:value="IN" />
<String fx:value="NOT IN" />
<String fx:value="EQUALS" />
<String fx:value="NOT EQUALS" />
<String fx:value="LESS THAN" />
<String fx:value="LESS THAN EQUALS" />
<String fx:value="GREATER THAN" />
<String fx:value="GREATER THAN EQUALS" />
</FXCollections>
</items>
</ComboBox>
<ComboBox fx:id="advOperator3" prefWidth="150.0" promptText="Select Operator" GridPane.columnIndex="1" GridPane.rowIndex="3">
<items>
<FXCollections fx:factory="observableArrayList">
<String fx:value="IN" />
<String fx:value="NOT IN" />
<String fx:value="EQUALS" />
<String fx:value="NOT EQUALS" />
<String fx:value="LESS THAN" />
<String fx:value="LESS THAN EQUALS" />
<String fx:value="GREATER THAN" />
<String fx:value="GREATER THAN EQUALS" />
</FXCollections>
</items>
</ComboBox>
<!-- <ComboBox prefWidth="150.0" promptText="Message Type"
GridPane.rowIndex="5" /> <ComboBox prefWidth="150.0" promptText="Equals"
GridPane.columnIndex="1" GridPane.rowIndex="5" /> <ComboBox prefWidth="150.0"
promptText="CCY" GridPane.rowIndex="6" /> <ComboBox prefWidth="150.0" promptText="IN"
GridPane.columnIndex="1" GridPane.rowIndex="6" /> -->
<TextField GridPane.columnIndex="2" GridPane.rowIndex="1" />
<TextField GridPane.columnIndex="2" GridPane.rowIndex="2" />
<TextField fx:id="advText1" GridPane.columnIndex="2" GridPane.rowIndex="1" />
<TextField fx:id="advText2" GridPane.columnIndex="2" GridPane.rowIndex="2" />
<TextField fx:id="advText3" GridPane.columnIndex="2" GridPane.rowIndex="3" />
<Label text="Select Field" GridPane.rowIndex="1">
<GridPane.margin>
<Insets left="5.0" />
</GridPane.margin>
</Label>
<Label text="Select Field" GridPane.rowIndex="2">
<GridPane.margin>
<Insets left="5.0" />
</GridPane.margin>
</Label>
<Label text="Select Field" GridPane.rowIndex="3">
<padding>
<Insets left="5.0" />
</padding>
</Label>
<Label text="Update Date" GridPane.rowIndex="4">
<padding>
<Insets left="5.0" />
</padding>
</Label>
<!-- <TextField GridPane.columnIndex="2" GridPane.rowIndex="4"
/> <TextField GridPane.columnIndex="2" GridPane.rowIndex="6" /> -->
</children>
</GridPane>
</children>
</HBox>
<HBox layoutX="7.0" layoutY="245.0" prefHeight="35.0" prefWidth="348.0">
<children>
<Text layoutX="7.0" layoutY="250.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Template Name">
<HBox.margin>
<Insets right="5.0" top="9.0" />
</HBox.margin>
</Text>
<ComboBox layoutX="94.0" layoutY="319.0" prefWidth="248.0" promptText="Default Template">
<items>
<FXCollections fx:factory="observableArrayList">
<String fx:value="Private" />
<String fx:value="Public" />
</FXCollections>
</items>
<HBox.margin>
<Insets left="7.0" />
</HBox.margin>
</ComboBox>
</children>
</HBox>
<HBox layoutX="7.0" layoutY="285.0" prefHeight="35.0" prefWidth="348.0">
<children>
<Text strokeType="OUTSIDE" strokeWidth="0.0" text="Type of template">
<HBox.margin>
<Insets top="9.0" />
</HBox.margin>
</Text>
<ComboBox prefWidth="248.0" promptText="Public">
<HBox.margin>
<Insets left="5.0" />
</HBox.margin>
</ComboBox>
</children>
</HBox>
<HBox layoutX="5.0" layoutY="325.0" prefHeight="45.0" prefWidth="352.0">
<children>
<Button mnemonicParsing="false" prefHeight="45.0" prefWidth="67.0" styleClass="advancedRedButton" text="Save Template" textAlignment="CENTER" wrapText="true" />
<Button mnemonicParsing="false" prefHeight="45.0" prefWidth="67.0" styleClass="advancedRedButton" text="Edit Template" textAlignment="CENTER" wrapText="true">
<HBox.margin>
<Insets left="8.0" />
</HBox.margin>
</Button>
<Button mnemonicParsing="false" prefHeight="45.0" prefWidth="67.0" styleClass="advancedRedButton" text="Delete Template" textAlignment="CENTER" wrapText="true">
<HBox.margin>
<Insets left="8.0" />
</HBox.margin>
</Button>
<Button mnemonicParsing="false" prefHeight="45.0" prefWidth="55.0" styleClass="advancedRedButton" text="Clear" textAlignment="CENTER" wrapText="true">
<HBox.margin>
<Insets left="8.0" />
</HBox.margin>
</Button>
<Button mnemonicParsing="false" onAction="#onAdvancedSearch" prefHeight="45.0" prefWidth="55.0" styleClass="advancedRedButton" text="Search">
<HBox.margin>
<Insets left="8.0" />
</HBox.margin>
</Button>
</children>
</HBox>
<HBox layoutX="140.0" layoutY="206.0" prefHeight="22.0" prefWidth="251.0">
<children>
<DatePicker layoutX="28.0" layoutY="230.0" prefWidth="92.0">
<HBox.margin>
<Insets right="5.0" />
</HBox.margin>
</DatePicker>
<Text layoutX="131.0" layoutY="247.0" strokeType="OUTSIDE" strokeWidth="0.0" text="To">
<HBox.margin>
<Insets right="5.0" top="5.0" />
</HBox.margin>
</Text>
<DatePicker layoutX="173.0" layoutY="232.0" prefWidth="92.0" />
</children>
</HBox>
</children>
</AnchorPane>
</content>
</TitledPane>
</children>
</VBox>
</children>
</AnchorPane>
</content>
<graphic>
<Label layoutX="-20.0" styleClass="triggerLink" text="Filter Criteria" />
</graphic>
<styleClass>
<String fx:value="arrowPane" />
<String fx:value="greyBorder" />
</styleClass>
</TitledPane>
<AnchorPane minHeight="500.0" minWidth="434.0" HBox.hgrow="ALWAYS">
<children>
<HBox fillHeight="true" minHeight="500.0" minWidth="434.0" styleClass="greyBorder" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" HBox.hgrow="ALWAYS">
<children>
<TableView fx:id="tableView" HBox.hgrow="ALWAYS" VBox.vgrow="ALWAYS">
<columns>
<TableColumn style="-fx-font-family: Calibri; -fx-font-size: 11px;" text="MessageId">
<cellValueFactory>
<PropertyValueFactory property="messageId" />
</cellValueFactory>
</TableColumn>
<TableColumn prefWidth="110.0" style="-fx-font-family: Calibri; -fx-font-size: 11px;" text="Digest Reference">
<cellValueFactory>
<PropertyValueFactory property="digestReference" />
</cellValueFactory>
</TableColumn>
<TableColumn prefWidth="115.0" style="-fx-font-family: Calibri; -fx-font-size: 11px;" text="Message Reference">
<cellValueFactory>
<PropertyValueFactory property="messageRef" />
</cellValueFactory>
</TableColumn>
<TableColumn prefWidth="115.0" style="-fx-font-family: Calibri; -fx-font-size: 11px;" text="Deal Number">
<cellValueFactory>
<PropertyValueFactory property="dealNo" />
</cellValueFactory>
</TableColumn>
<TableColumn style="-fx-font-family: Calibri; -fx-font-size: 11px;" text="Digest Value">
<cellValueFactory>
<PropertyValueFactory property="digestValue" />
</cellValueFactory>
</TableColumn>
<TableColumn prefWidth="100.0" style="-fx-font-family: Calibri; -fx-font-size: 11px;" text="Updated Date Time">
<cellValueFactory>
<PropertyValueFactory property="updateTime" />
</cellValueFactory>
</TableColumn>
</columns>
</TableView>
</children>
</HBox>
<HBox fx:id="columnConfigHbox" fillHeight="false" layoutX="310.0" layoutY="427.0">
<children>
<TableView fx:id="columnConfigTable" prefHeight="150.0" prefWidth="110.0" styleClass="noBorderRight" HBox.hgrow="ALWAYS" VBox.vgrow="ALWAYS">
<columns>
<TableColumn editable="false" minWidth="80.0" prefWidth="90.0" sortable="false" style="-fx-font-family: Calibri; -fx-font-size: 11px;" text="Column Config">
<cellValueFactory>
<PropertyValueFactory property="columnConfig" />
</cellValueFactory>
</TableColumn>
</columns>
<columnResizePolicy>
<TableView fx:constant="CONSTRAINED_RESIZE_POLICY" />
</columnResizePolicy>
</TableView>
<Button minHeight="15.0" minWidth="15.0" mnemonicParsing="false" onAction="#closeThis" styleClass="closeThis" />
</children>
</HBox>
<!-- <GridPane fx:id="columnConfig" layoutX="320.0" layoutY="480.0" visible="false">
<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 minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
</rowConstraints>
<children>
<Text strokeType="OUTSIDE" strokeWidth="0.0" text="CCY" />
<Text strokeType="OUTSIDE" strokeWidth="0.0" text="CCY Amount" GridPane.rowIndex="1" />
<Text strokeType="OUTSIDE" strokeWidth="0.0" text="CTR CCY" GridPane.rowIndex="2" />
</children>
</GridPane> -->
</children>
</AnchorPane>
</children>
</HBox>
</children>
<styleClass>
<!-- <String fx:value="Sapphire" /> -->
<String fx:value="defaultFont" />
</styleClass>
</VBox>

Resources