How to populate a TableView that is defined in an fxml file that is designed in JavaFx Scene Builder

Chrispie picture Chrispie · Jun 24, 2012 · Viewed 55.1k times · Source

I would like to know how do I populate a TableView with data... All the examples I have seen creates a TableView with columns and everything and add it to the scene. All done in the java code itself.

What I want to know: if I design my "form" in JavaFx Scene builder. Defining all the tables and columns in there. How do I access it to populate it from java? Or if someone can point me to a proper tutorial on this please.

I have defined my form in JavaFx Scene Builder - only a TableView with 3 Columns

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.paint.*?>

<AnchorPane id="AnchorPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="288.0" prefWidth="293.0" xmlns:fx="http://javafx.com/fxml">
<children>
    <TableView fx:id="tableView" layoutX="35.0" layoutY="28.0" prefHeight="200.0" prefWidth="227.0">
    <columns>
        <TableColumn prefWidth="75.0" text="UserId" fx:id="UserId" />
        <TableColumn prefWidth="75.0" text="UserName" fx:id="UserName" />
        <TableColumn prefWidth="75.0" text="Active" fx:id="Active" />
    </columns>
    </TableView>
</children>
</AnchorPane>

I have my data in a ResultSet in my Java code.

ResultSet rs = c.createStatement().executeQuery(SQL);

I need to populate the TableView.

Thanks

Answer

Uluk Biy picture Uluk Biy · Jun 25, 2012

To access to tableview you need to define a controller of your FXML page. Add

fx:controller="path.to.MyController"

attribute to the AnchorPane in FXML file. Then create the controller and link TableView, TableColumns from FXML file by putting @FXML annotation in front of these variables:

package path.to;

public class MyController implements Initializable {

    @FXML private TableView<User> tableView;
    @FXML private TableColumn<User, String> UserId;
    @FXML private TableColumn<User, String> UserName;
    @FXML private TableColumn<User, String> Active;

    @Override
    public void initialize(URL location, ResourceBundle resources) {
        UserId.setCellValueFactory(new PropertyValueFactory<User, String>("id"));
        UserName.setCellValueFactory(new PropertyValueFactory<User, String>("name"));
        Active.setCellValueFactory(new PropertyValueFactory<User, String>("active"));

        tableView.getItems().setAll(parseUserList());
    }
    private List<User> parseUserList(){
        // parse and construct User datamodel list by looping your ResultSet rs
        // and return the list   
    }
}

The tableview is populated in the initialize method. Note that in controller we are not creating new tableview or tablecolumns, since they are already created whlle the FXML file is being loaded. Also note that the TableView and Tablecolumn variable names must be the same with fx:id values in the corresponding FXML file. So while UserId, UserName and Active names are not convenient namings, change them both in FXML file and in Controller to names like userIdCol, userNameCol and userActiveCol respectively.