左侧带有水平选项卡的 Java FX8 选项卡

Question

我需要一个左侧有选项卡的选项卡式窗格，选项卡文本/图形需要是水平的

几个月前我在 Scenebuilder 上做过这个。

但是，当我通过 Java 代码添加其他选项卡时，选项卡位于左侧，但图形文本是垂直的，这与使用 Scene builder 创建的选项卡不同。

在附图中，前两个选项卡是通过 Scenebuilder 创建的，它们的方向正确，第三个选项卡是使用 Java 代码动态添加的。

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);

有人能告诉我为什么这个标签不会像另一个一样旋转吗？

Answer 1

我需要得到类似的东西，但标题是左对齐的。我最终得到了这个解决方案。

TabPane 设置：

TabPane tabPane = new TabPane();
tabPane.setSide(Side.LEFT);
tabPane.setRotateGraphic(true);
tabPane.setTabMinHeight(200); // Determines tab height. I know, its odd.
tabPane.setTabMaxHeight(200);
tabPane.getStyleClass().add("horizontal-tab-pane");

Tab 设置：

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);
});

还有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;
}

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

刚刚发布问题后发现您需要添加一个包含包含标签的组的 StackPane 才能实现此目的。

  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);