JavaFX Tab fit full size of header

Question

I want the tabs in my tabpane to fit the complete size of the tabpane which they are in. So basically there shall be no header area visible, everything should be covered by

Answer 1

You can simply add a listener to the TabPane to detect any changes and adjust the width and/or height of the tabs accordingly.

@FXML
private JFXTabPane tabPane;

Divide the width by number of tabs:

tabPane.widthProperty().addListener((observable, oldValue, newValue) ->
    {
        tabPane.setTabMinWidth(tabPane.getWidth() / tabPane.getTabs().size());
        tabPane.setTabMaxWidth(tabPane.getWidth() / tabPane.getTabs().size());      
    });

Answer 2

It's true, the property objects of tabs are READ-Only. This means that you cannot manually set the properties. However, the values of the read-only properties can be bound to other properties, also the properties have some manipulation methods e.g. divide, subtract, please check the documentation for extended information.

You can call the .tabminWidthProperty() on the tabpane and bind it to the width-property value of the parent of the layout.

Here's the code to size all available tabs equally filling the whole screen:

tabpane.tabMinWidthProperty().bind(root.widthProperty().divide(tabpane.getTabs().size()).subtract(20));

I subtracted 20 to avoid the horizontal/vertical scrollbar. Surely there is also a way to disable them to pop up at all, but I'm an Android Dev and a greenhorn in JavaFx.

Answer 3

I'm not sure if this is do-able in CSS, and there might be a simpler way in Java to do this, but I wrote a class that extends TabPane in order to stretch the tabs to fill all the space.

public class StretchedTabPane extends TabPane {

    public StretchedTabPane() {
        super();
        setUpChangeListeners();
    }

    public StretchedTabPane(Tab... tabs) {
        super(tabs);
        setUpChangeListeners();
    }

    private void setUpChangeListeners() {

        widthProperty().addListener(new ChangeListener<Number>() {
            @Override public void changed(ObservableValue<? extends Number> value, Number oldWidth, Number newWidth) {
                Side side = getSide();
                int numTabs = getTabs().size();
                if ((side == Side.BOTTOM || side == Side.TOP) && numTabs != 0) {
                    setTabMinWidth(newWidth.intValue() / numTabs - (20));
                    setTabMaxWidth(newWidth.intValue() / numTabs - (20));
                }
            }
        });

        heightProperty().addListener(new ChangeListener<Number>() {
            @Override public void changed(ObservableValue<? extends Number> value, Number oldHeight, Number newHeight) {
                Side side = getSide();
                int numTabs = getTabs().size();
                if ((side == Side.LEFT || side == Side.RIGHT) && numTabs != 0) {
                    setTabMinWidth(newHeight.intValue() / numTabs - (20));
                    setTabMaxWidth(newHeight.intValue() / numTabs - (20));
               }
           }
        });

        getTabs().addListener(new ListChangeListener<Tab>() {
            public void onChanged(ListChangeListener.Change<? extends Tab> change){
                Side side = getSide();
                int numTabs = getTabs().size();
                if (numTabs != 0) {
                    if (side == Side.LEFT|| side == Side.RIGHT) {
                        setTabMinWidth(heightProperty().intValue() / numTabs - (20));
                        setTabMaxWidth(heightProperty().intValue() / numTabs - (20));
                    }
                    if (side == Side.BOTTOM || side == Side.TOP) {
                        setTabMinWidth(widthProperty().intValue() / numTabs - (20));
                        setTabMaxWidth(widthProperty().intValue() / numTabs - (20));
                    }
                }
            }
        });
   }
}

This will automatically adjust the width of each tab when the height, width or number of tabs changes.