JavaFX - how to display values of two table columns in TableView with different order from one ObservableList?

Question

University student here currently working on a tournament application project, and I've got this current issue with GUI:

My matchmaking algorithm takes the player's numbers and matches the lowest number with the highest, for example if we have 8 players then we will have; P1 vs P8, P2 vs P7 and so on. I am currently trying to display this in a TableView using two columns. This means that column one needs to show P1, and column two needs to show P8 on the same row. I am sadly unable to figure out how to make this work, because the current code stacks the players on top of eachother like this:

My current code for this is as follows:

@FXML
private void initialize() {
    playerViewer.setPlaceholder(new Label("Players will be shown here"));

    SingleElimTournament tournament = new SingleElimTournament();

    for(int i = 1; i < 9; i++) {
        tournament.addPlayer(new Player("Player " + i, i));
    }

    int start = 0; //The id for first player according to a seed
    int end = tournament.getPlayerAmount() - 1; //The id for last player according to a seed
    while (start < end) {
        playerList.add(tournament.getPlayersList().get(start));
        playerList.add(tournament.getPlayersList().get(end));

        start++; //Moving on to the next match
        end--; //Moving on to the next match
    }

    columnOne.setCellValueFactory(new PropertyValueFactory<Player, String>("name"));
    columnTwo.setCellValueFactory(new PropertyValueFactory<Player, String>("name"));

    playerViewer.setItems(playerList);
}

What would I need to change for the columns to display the opposing players side-to-side instead of on top of eachother? Any advice is greatly appreciated.

You need a list of pairs of players as your underlying items list, not a list of players. — James_D, Mar 27 '22 at 20:12
Say, a `Map`, for [example](https://stackoverflow.com/a/69781121/230513). — trashgod, Mar 27 '22 at 23:50

score 1 · Accepted Answer · answered Mar 28 '22 at 13:58

Each row in the table represents a match with two players, not a single Player. So the data type for your TableView needs to be a data type that represents two players.

E.g. define a record:

record Match(Player first, Player second) {} ;

@FXML
private TableView<Match> playerViewer ;
@FXML
private TableColumn<Match, Player> columnOne ;
@FXML
private TableColumn<Match, Player> columnTwo ;

private ObservableList<Match> matchList = FXCollections.observableArrayList();

@FXML
private void initialize() {
    playerViewer.setPlaceholder(new Label("Players will be shown here"));

    SingleElimTournament tournament = new SingleElimTournament();

    for(int i = 1; i < 9; i++) {
        tournament.addPlayer(new Player("Player " + i, i));
    }

    int start = 0; //The id for first player according to a seed
    int end = tournament.getPlayerAmount() - 1; //The id for last player according to a seed
    while (start < end) {
        Player player1 = tournament.getPlayersList().get(start);
        Player player2 = tournament.getPlayersList().get(end);

        Match match = new Match(player1, player2);
        matchList.add(match);

        start++; //Moving on to the next match
        end--; //Moving on to the next match
    }

    columnOne.setCellValueFactory(cellData -> new SimpleObjectProperty<>(cellData.getValue().first()));
    columnTwo.setCellValueFactory(cellData -> new SimpleObjectProperty<>(cellData.getValue().second()));

    Callback<TableColumn<Match, Player>, TableCell<Match, Player>> cellFactory = col ->
        new TableCell<>() {
            @Override
            protected void updateItem(Player player, boolean empty) {
                super.updateItem(player, empty);
                if (empty || player == null) {
                    setText("");
                } else {
                    setText(player.getName());
                }
            }
        };

    columnOne.setCellFactory(cellFactory);
    columnTwo.setCellFactory(cellFactory);

    playerViewer.setItems(matchList);
}

JavaFX - how to display values of two table columns in TableView with different order from one ObservableList?

1 Answers1