How to change font size in the stylesheet of the tables in java

Question

My goal

I want to give the user the option to resize the header and rows text size of all the tables in my app (there are plenty of them so changing the CSS of each one is not an option for me), by a slider, I'm using CSS styleSheet to modify in my table style, and I have attached it to the root.

My Table Css

.table-view .column-header {
    -fx-font-size: 14px;
}

My question

is there any way to modify the default header font size (14px) in the stylesheet above from java (outside of the stylesheet)

Note

• As i have already mentioned the stylesheet is attached to root, not directly to the tables.

• I'm using JavaFX 16

Answer 1

This solution requires JavaFX 17 to use a data URL.

Call the provided function, passing in some parent node that contains the tables whose headers you want to size.

It will remove all existing user style sheets you have on the node, so don't call it on a node that has existing style sheets applied to it.

private void setTableHeaderFontSize(Region parent, int size) {
    parent.getStylesheets().setAll(
         """
         data:text/css,
         .table-view .column-header {
              -fx-font-size: 
         """
         + size + "px;}"
    );
}

Example App

The example below passes a table node to the CSS styling function, but you don't need to apply it directly on a table, you could apply it on any parent node and it would apply to any table children in the node hierarchy.

import javafx.application.Application;
import javafx.beans.property.*;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.stage.Stage;

public class RecordTableViewer extends Application {
    public record Person(String last, String first, int age) {}

    private final IntegerProperty fontSize = new SimpleIntegerProperty();

    @Override
    public void start(Stage stage) {
        TableView<Person> table = createTable();
        populateTable(table);

        Pane controls = createControls();

        VBox layout = new VBox(
                10,
                controls,
                table
        );
        layout.setPadding(new Insets(10));
        layout.setPrefSize(300, 300);

        setTableHeaderFontSize(table, fontSize.intValue());
        fontSize.addListener((observable, oldValue, newValue) ->
                setTableHeaderFontSize(table, newValue.intValue())
        );

        stage.setScene(new Scene(layout));
        stage.show();
    }

    private TableView<Person> createTable() {
        TableView<Person> table = new TableView<>();

        TableColumn<Person, String> lastColumn = new TableColumn<>("Last");
        lastColumn.setCellValueFactory(
                p -> new SimpleStringProperty(p.getValue().last())
        );

        TableColumn<Person, String> firstColumn = new TableColumn<>("First");
        firstColumn.setCellValueFactory(
                p -> new SimpleStringProperty(p.getValue().first())
        );

        TableColumn<Person, Integer> ageColumn = new TableColumn<>("Age");
        ageColumn.setCellValueFactory(
                p -> new SimpleIntegerProperty(p.getValue().age()).asObject()
        );
        ageColumn.setPrefWidth(60);

        //noinspection unchecked
        table.getColumns().addAll(lastColumn, firstColumn, ageColumn);

        return table;
    }

    private void populateTable(TableView<Person> table) {
        table.getItems().setAll(
                new Person("Smith", "Justin", 41),
                new Person("Smith", "Sheila", 42),
                new Person("Morrison", "Paul", 58),
                new Person("Tyx", "Kylee", 40),
                new Person("Lincoln", "Abraham", 200)
        );
    }

    private HBox createControls() {
        Slider fontSizeSlider = new Slider(8, 24, 14);
        fontSizeSlider.setMajorTickUnit(2);
        fontSizeSlider.setMinorTickCount(0);
        fontSizeSlider.setShowTickMarks(true);

        fontSize.setValue((int) Math.round(fontSizeSlider.getValue()));
        fontSizeSlider.valueProperty().addListener((observable, oldValue, newValue) ->
                fontSize.setValue((int) Math.round(newValue.doubleValue()))
        );

        Label fontSizeLabel = new Label();
        fontSizeLabel.textProperty().bind(
                fontSize.asString()
        );

        return new HBox(
                10,
                new Label("Table header size: "),
                fontSizeSlider,
                fontSizeLabel
        );
    }

    private void setTableHeaderFontSize(Region parent, int size) {
        parent.getStylesheets().setAll("""
                data:text/css,
                .table-view .column-header {
                     -fx-font-size: 
                """
                + size + "px;}"
        );
    }
}