Skip to content

TableView not correctly sizing at creation/initialization #269

@stefanofornari

Description

@stefanofornari

Describe the bug
MFXTableView does not seem to be correctly sized when created. Startnig a scroll action, it resizes correctly (see attached video).

MRE(Minimal Reproducible Example)

TableMain.fmxl

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

<!--?import ste.w3.easywallet.ui.table.EasyWalletTableView?-->
<?import javafx.geometry.Insets?>
<?import javafx.scene.layout.VBox?>
<?import io.github.palexdev.materialfx.controls.MFXTableView?>

<VBox alignment="CENTER" spacing="5.0" xmlns="http://javafx.com/javafx/19" xmlns:fx="http://javafx.com/fxml/1" fx:controller="ste.w3.easywallet.ui.table.TableMainController">
    <padding>
        <Insets bottom="15.0" />
    </padding>
    <children>
        <MFXTableView fx:id="table" />
    </children>
</VBox>

TableMain.java

public class TableMain extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        stage.setTitle("TableView Test");
        stage.setWidth(800);

https://user-images.githubusercontent.com/43138/209996110-22ad600a-210b-416a-8f24-653b657586b9.mp4


        stage.setHeight(600);
        stage.getIcons().add(new Image(TableMain.class.getResourceAsStream("/images/easy-wallet-icon-64x64.png")));
        stage.getIcons().add(new Image(TableMain.class.getResourceAsStream("/images/easy-wallet-icon-128x128.png")));

        Scene scene = new Scene(
            FXMLLoader.load(TableMain.class.getResource("/fxml/TableMain.fxml"))
        );

        stage.setScene(scene);

        stage.show();
    }
}

TableMainController.java

public class TableMainController {

    @FXML
    protected MFXTableView table;

    public TableMainController() {
    }

    @FXML
    public void initialize() {
        table.autosizeColumnsOnInitialization();
        setupTable();
    }

    private void setupTable() {
        MFXTableColumn<Transaction> whenColumn = new MFXTableColumn<>("when", false, Comparator.comparing(Transaction::when));
        MFXTableColumn<Transaction> currencyColumn = new MFXTableColumn<>("currency", false, Comparator.comparing(Transaction::currency));
        MFXTableColumn<Transaction> amountColumn = new MFXTableColumn<>("amount", false, Comparator.comparing(Transaction::amount));
        MFXTableColumn<Transaction> fromColumn = new MFXTableColumn<>("from", false, Comparator.comparing(Transaction::from));

        whenColumn.setRowCellFactory(transaction -> new MFXTableRowCell<>(Transaction::when));
        currencyColumn.setRowCellFactory(transaction -> new MFXTableRowCell<>(Transaction::currency));
        amountColumn.setRowCellFactory(transaction -> new MFXTableRowCell<>(Transaction::amount));
        fromColumn.setRowCellFactory(transaction -> new MFXTableRowCell<>(Transaction::from));

        table.getTableColumns().addAll(whenColumn, currencyColumn, amountColumn, fromColumn);
        table.getFilters().addAll(
                new StringFilter<>("when", Transaction::whenZ),
                new StringFilter<>("currency", Transaction::currency),
                new StringFilter<>("amount", Transaction::amount),
                new StringFilter<>("from", Transaction::from)
        );

        ObservableList<Transaction> data = FXCollections.observableArrayList();

        for (int i = 1; i <= 50; ++i) {
            data.add(
                    new Transaction(
                            Instant.parse(String.format("2022-11-10T10:%02d:00Z", i)),
                            "USD",
                            String.format("%1$02d.%1$02d", i),
                            String.format("12345678901234567890123456789012345678%02d", i),
                            String.format("hahs%02d", i)
                    )
            );
        }
        table.setItems(data);
    }

    private class Transaction {

        public final String hash, from, amount, currency;
        public final Instant when;

        public Transaction() {
            this(null, null, null, null, null);
        }

        public Transaction(Instant when, String currency, String amount, String from, String hash) {
            this.when = when;
            this.currency = currency;
            this.amount = amount;
            this.from = from;
            this.hash = hash;
        }

        public Instant when() {
            return when;
        }

        public String currency() {
            return currency;
        }

        public String amount() {
            return amount;
        }

        public String from() {
            return from;
        }

        public String hash() {
            return hash;
        }

        public String whenZ() {
            return when.toString();
        }
    }
}

To Reproduce
Run the MRE

Expected behavior
The table size and position is correct since the beginning.

Screenshots
see video...

bug.tableview.mp4

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions