Java FX8 Tabs on the left side with horizontal tabs - javafx

Question

I require a tabbed pane with tabs on the left side, the tab text/graphic needs to be horizontal
I did this on Scenebuilder few months back.
However when I add additional tabs via Java code, the tabs is on the left side but the graphic text is vertical unlike the tabs created using Scene builder.
In the attached image first two tabs are created through Scenebuilder and they are in the correct orientation, the third one was dynamically added using Java code.
Tab studentAdmission = new Tab();
studentAdmission.setContent((Parent)new FXMLLoader(getClass().getResource("Customer_View.fxml")).load());
studentAdmission.setGraphic(new Label("Student Admission"));
mainTab.getTabs().add(studentAdmission);
Could some one advise why this tab doesn't rotate as the other one.

Answer 1

Just figured out after posting the question that you need to add a StackPane containing a group containing a label to achieve this.
Tab studentAdmission = new Tab();
studentAdmission.setContent((Parent)new FXMLLoader(getClass().getResource("Customer_View.fxml")).load());
Label l = new Label("Student Admission");
l.setRotate(90);
StackPane stp = new StackPane(new Group(l));
studentAdmission.setGraphic(stp);
mainTab.getTabs().add(studentAdmission);

Answer 2

// Firstly
tabPane.setSide(Side.LEFT);
tabPane.setRotateGraphic(true);
Label l = new Label("Titel Tab1");
l.setRotate(90);
StackPane stp = new StackPane(new Group(l));
stp.setRotate(90);
tab1.setGraphic(stp);
l = new Label("Titel Tab2");
l.setRotate(90);
stp = new StackPane(new Group(l));
stp.setRotate(90);
tab2.setGraphic(stp);
tabPane.setTabMinHeight(100);
tabPane.setTabMaxHeight(100);

Answer 3

I needed to get something similar to this, but with left-aligned titles. I ended up with this solution.
TabPane setup:
TabPane tabPane = new TabPane();
tabPane.setSide(Side.LEFT);
tabPane.setRotateGraphic(true);
tabPane.setTabMinHeight(200); // Determines tab width. I know, its odd.
tabPane.setTabMaxHeight(200);
tabPane.getStyleClass().add("horizontal-tab-pane");
Tab setup:
Tab tab = new Tab(title, content);
tab.setClosable(false);
tab.setGraphic(graphic); // Graphic required. If you don't want one, use an empty label.
Platform.runLater(() -> {
// Get the "tab-container" node. This is what we want to rotate/shift for easy left-alignment.
// You can omit the last "getParent()" with a few tweaks for centered labels
Parent tabContainer = tab.getGraphic().getParent().getParent();
tabContainer.setRotate(90);
// By default the display will originate from the center.
// Applying a negative Y transformation will move it left.
// Should be the 'TabMinHeight/2'
tabContainer.setTranslateY(-100);
});
And the css:
.horizontal-tab-pane *.tab {
/* Determines the tab height */
-fx-pref-width: 60px;
/* Everything else is just aesthetics */
-fx-padding: 20px;
-fx-background-insets: 2 -1 -1 -1;
-fx-border-width: 1 0 1 1;
-fx-border-color: rgb(55, 55, 56) black black black;
}
.horizontal-tab-pane *.tab:selected {
-fx-background-color: rgb(45, 45, 46);
-fx-border-color: rgb(75, 125, 200) black rgb(45, 45, 46) black;
}