JavaFX tableview resizes to fit the window
I'm trying JavaFX and forcing my way because it's hypothetical and future I'm trying to create a 4 - column table The column and table should be resized to fill the parent pane I can't make this work for my life I've been trying for more than 4 hours, and the tableview hasn't resized
This is my fxml file
<?xml version="1.0" encoding="UTF-8"?> <?import java.lang.*?> <?import java.util.*?> <?import javafx.scene.*?> <?import javafx.scene.control.*?> <?import javafx.scene.layout.*?> <?import java.net.*?> <?import javafx.geometry.*?> <?import javafx.geometry.Insets?> <?import javafx.scene.control.*?> <?import javafx.scene.control.cell.*?> <?import javafx.scene.layout.*?> <?import javafx.scene.text.*?> <?import javafx.collections.*?> <?import t.cubed.fxml.*?> <BorderPane styleClass="root" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8" fx:controller="t.cubed.fxml.FXMLDocumentController"> <top> <MenuBar fx:id="menuBar" styleClass="menu-bar"> <menus> <Menu text="File"> <items> <MenuItem onAction="#handleOpenAction" text="Open" /> <MenuItem onAction="#handleExitAction" text="Exit" /> </items> </Menu> <Menu text="Edit"> <items> <MenuItem onAction="#handleWeightAction" text="Edit Weights" /> <MenuItem onAction="#handleFilterAction" text="Edit Filters" /> <MenuItem onAction="#handleOptionsAction" text="Options" /> </items> </Menu> </menus> </MenuBar> </top> <center> <GridPane> <!-- <padding> <Insets bottom="10.0" left="10.0" right="10.0" top="10.0"/> </padding> --> <TableView fx:id="testTable" GridPane.columnIndex="0" GridPane.rowIndex="0" GridPane.columnSpan="1"> <columnResizePolicy> <TableView fx:constant="CONSTRAINED_RESIZE_POLICY" /> </columnResizePolicy> <columns> <TableColumn text="TEST NUMBER"> <cellValueFactory> <PropertyValueFactory property="testNumber" /> </cellValueFactory> </TableColumn> <TableColumn text="TEST NAME"> <cellValueFactory> <PropertyValueFactory property="testName" /> </cellValueFactory> </TableColumn> <TableColumn text="TEST TIME(ms)"> <cellValueFactory> <PropertyValueFactory property="testTime" /> </cellValueFactory> </TableColumn> <TableColumn text="BEST MATCH"> <cellValueFactory> <PropertyValueFactory property="bestMatch" /> </cellValueFactory> </TableColumn> </columns> <items> <!-- <FXCollections fx:factory="observableArrayList"> <TestTableModel testNumber="100" testName="Test1234" testTime="0.34" bestMatch="99"/> </FXCollections> --> </items> </TableView> </GridPane> </center> <stylesheets> <URL value="@t-cubed.css" /> </stylesheets> </BorderPane>
Solution
How does a resizable layout work
The size of resizable items in JavaFX is managed by the layout manager where the items are placed
What do you need to do
For your specific problem, you need to set the gridpane size limit to manage the tableview you place in the grid
Look at gridpane Hgrow and gridpane Vgrow constraint added to tableview:
<TableView fx:id="testTable" GridPane.columnIndex="0" GridPane.columnSpan="1" GridPane.hgrow="ALWAYS" GridPane.vgrow="ALWAYS" GridPane.rowIndex="0">
Fxml just reflects the Java API, so you can do the same thing in the Java source, namely gridpane setHGrow(node,priority). However, if you use fxml for layout, it is recommended to define layout restrictions in fxml
Reconstructed sample
I loaded fxml in scene builder 2 and set corresponding constraints. When I use the preview function of scene builder, it seems to resize automatically
<?xml version="1.0" encoding="UTF-8"?> <?import java.lang.*?> <?import java.util.*?> <?import javafx.scene.*?> <?import javafx.scene.control.*?> <?import javafx.scene.layout.*?> <?import java.net.*?> <?import javafx.geometry.*?> <?import javafx.geometry.Insets?> <?import javafx.scene.control.*?> <?import javafx.scene.control.cell.*?> <?import javafx.scene.layout.*?> <?import javafx.scene.text.*?> <?import javafx.collections.*?> <?import t.cubed.fxml.*?> <BorderPane styleClass="root" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="t.cubed.fxml.FXMLDocumentController"> <top> <MenuBar fx:id="menuBar" styleClass="menu-bar"> <menus> <Menu text="File"> <items> <MenuItem onAction="#handleOpenAction" text="Open" /> <MenuItem onAction="#handleExitAction" text="Exit" /> </items> </Menu> <Menu text="Edit"> <items> <MenuItem onAction="#handleWeightAction" text="Edit Weights" /> <MenuItem onAction="#handleFilterAction" text="Edit Filters" /> <MenuItem onAction="#handleOptionsAction" text="Options" /> </items> </Menu> </menus> </MenuBar> </top> <center> <GridPane> <children> <!-- <padding> <Insets bottom="10.0" left="10.0" right="10.0" top="10.0"/> </padding> --> <TableView fx:id="testTable" GridPane.columnIndex="0" GridPane.columnSpan="1" GridPane.hgrow="ALWAYS" GridPane.rowIndex="0" GridPane.vgrow="ALWAYS"> <columnResizePolicy> <TableView fx:constant="CONSTRAINED_RESIZE_POLICY" /> </columnResizePolicy> <columns> <TableColumn text="TEST NUMBER"> <cellValueFactory> <PropertyValueFactory property="testNumber" /> </cellValueFactory> </TableColumn> <TableColumn text="TEST NAME"> <cellValueFactory> <PropertyValueFactory property="testName" /> </cellValueFactory> </TableColumn> <TableColumn text="TEST TIME(ms)"> <cellValueFactory> <PropertyValueFactory property="testTime" /> </cellValueFactory> </TableColumn> <TableColumn text="BEST MATCH"> <cellValueFactory> <PropertyValueFactory property="bestMatch" /> </cellValueFactory> </TableColumn> </columns> <items> <!-- <FXCollections fx:factory="observableArrayList"> <TestTableModel testNumber="100" testName="Test1234" testTime="0.34" bestMatch="99"/> </FXCollections> --> </items> </TableView> </children> <columnConstraints> <ColumnConstraints /> </columnConstraints> <rowConstraints> <RowConstraints /> </rowConstraints> </GridPane> </center> <stylesheets> <URL value="@t-cubed.css" /> </stylesheets> </BorderPane>
Some advice
You can place the tableview in the gridpane It's a little strange to use gridpane in your case, because gridpane will only place one node in gridpane Just place the tableview directly in the center of the borderpane, or use a simpler layout parent class (such as stackpane) to work normally But maybe it's just a reduced version of a more complex UI, so maybe that's why you use a gridpane
Further reading
If you have time, please read the layout in JavaFX in node, pane, group and gridpane Javadoc and try this little layout boundaries demo
Other issues for comment