javajavafxjavafx-css

How to use floating TabPane in JavaFX?


From TabPane javadoc:

A TabPane has two modes floating or recessed. Applying the styleclass STYLE_CLASS_FLOATING will change the TabPane mode to floating.

and

public static final String STYLE_CLASS_FLOATING TabPane mode will be changed to floating allowing the TabPane to be placed alongside other control.

But I can't understand what allowing the TabPane to be placed alongside other control means. Could anyone give an example of this feature and when it can be used?

This is my code making TabPane floating:

public class NewMain extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        var tabPane = new TabPane(new Tab("Tab1"), new Tab("Tab2"));
        tabPane.getStyleClass().add(TabPane.STYLE_CLASS_FLOATING);
        stage.setScene(new Scene(tabPane, 600, 400));

        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

Solution

  • The Modena example, seen below with the Caspian theme selected, illustrates floating vs. recessed tabs. Note how the former appear to stand off from the edge like file tabs, while the latter are recessed in the enclosing control.

    TabPane

    Could you give an example when floating tabs can be used?

    While the feature can be used anytime, it is limited to appearance and geometry. As seen in the TabPaneSkin method isFloatingStyleClass, the effect is to hide the border content and make the header background pane invisible. The result depends on the enclosing layout. As a concrete example, the variation below permits seamless visibility of a background gradient.

    Tab floating over gradient

    var tabPane = new TabPane(
        new Tab("Tab1", new Rectangle(200, 120, Color.RED)),
        new Tab("Tab2", new Rectangle(200, 120, Color.GREEN)),
        new Tab("Tab2", new Rectangle(200, 120, Color.BLUE)));
    tabPane.getStyleClass().add(TabPane.STYLE_CLASS_FLOATING);
    var root = new VBox(tabPane);
    VBox.setMargin(tabPane, new Insets(24));
    Stop[] stops = new Stop[]{new Stop(0, Color.SKYBLUE), new Stop(1, Color.ALICEBLUE)};
    root.setBackground(Background.fill(new LinearGradient(0, 0, 0, 1, true, CycleMethod.NO_CYCLE, stops)));
    stage.setScene(new Scene(root));
    stage.show();