如何在 javafx TabPane 中的第一个 Tab 左侧添加空格？

Question

我有一个 JavaFX 应用程序，我需要将选项卡窗格中的第一个选项卡稍微向右移动，以便稍后在创建的间隙中添加一个按钮。我设法通过向选项卡中的每个选项卡添加样式“-fx-translate-x: 20px;”来做到这一点，但结果不是我所期望的，因为最后一个选项卡仅部分显示。下面是一个重现问题的小 fxml 示例，我正在做的事情有问题还是有其他方法可以实现？感谢您的帮助

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane id="AnchorPane" prefHeight="200" prefWidth="320" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8.0.40" fx:controller="FXMLDocumentController">
   <children>
      <TabPane prefHeight="200.0" prefWidth="320.0" tabClosingPolicy="UNAVAILABLE">
        <tabs>
          <Tab style="-fx-translate-x: 20px;" text="Tab 1">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
            </content>
          </Tab>
          <Tab style="-fx-translate-x: 20px;" text="Tab 2">
            <content>
              <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
            </content>
          </Tab>
        </tabs>
      </TabPane>
   </children>
</AnchorPane>

Answer 1

您可以将 css 文件应用到场景以访问标签窗格的子结构。以下将所有选项卡向右缩进 50（通过将左侧填充设置为 50px）。

cssFile.css：

.tab-pane .tab-header-area {
    -fx-padding: 0 0 0 50;
}

在项目中：

scene.getStylesheets().add("mypackage/cssFile.css");