如何删除TabPane背景阴影

Question

我found我可以使用CSS删除TabPane的背景。但是我如何使用setStyle？

来做到这一点

    TabPane tabPane = new TabPane();
    tabPane.setStyle("-fx-effect: null;");

修改

public class clicen extends Application
{


    @Override
    public void start(Stage primaryStage)
    {

        final Label label = new Label("New Connection");
        label.setFont(new Font("Arial", 20));
        Stage dialog = new Stage();

        dialog.initModality(Modality.APPLICATION_MODAL);
        dialog.initOwner(primaryStage);


        GridPane gridPane = new GridPane();
        //gridPane.setGridLinesVisible(true);
        gridPane.setPadding(new Insets(25));
        gridPane.setHgap(30);
        gridPane.setVgap(30);

        TabPane tabPane = new TabPane();

        Tab tabConn = new Tab("General");
        tabConn.setStyle("-fx-font-size: 12pt;");
        tabPane.setTabClosingPolicy(TabPane.TabClosingPolicy.UNAVAILABLE);
        Tab tabConnAdv = new Tab("Advanced");
        tabConnAdv.setStyle("-fx-font-size: 12pt;");
        tabPane.getTabs().add(tabConn);
        tabPane.getTabs().add(tabConnAdv);

        Text ncn = new Text("New Connection Properties");
        ncn.setFont(new Font("Arial", 20));

        /// internal grid pane

        GridPane ingridPane = new GridPane();
        //ingridPane.setGridLinesVisible(true);
        ingridPane.setPadding(new Insets(25));
        ingridPane.setHgap(30);
        ingridPane.setVgap(30);

        // internal gridpane
        Text textHost = new Text("Host");
        ingridPane.add(textHost, 0, 1);
        TextField hostIn = new TextField();
        ingridPane.add(hostIn, 1, 1);
        Text textUsername = new Text("Username");
        ingridPane.add(textUsername, 0, 2);
        TextField usernameIn = new TextField();
        ingridPane.add(usernameIn, 1, 2);
        Text taxtPassword = new Text("Password");
        ingridPane.add(taxtPassword, 0, 3);
        TextField passwdIn = new TextField();
        ingridPane.add(passwdIn, 1, 3);
        Text textPort = new Text("Port number");
        ingridPane.add(textPort, 0, 4);
        TextField portIn = new TextField();
        ingridPane.add(portIn, 1, 4);

        Button btnConnect = new Button("Connect");
        btnConnect.setStyle("-fx-background-color:\n"
                + "        rgba(0,0,0,0.08),\n"
                + "        linear-gradient(#9a9a9a, #909090),\n"
                + "        linear-gradient(white 0%, #f3f3f3 50%, #ececec 51%, #f2f2f2 100%);\n"
                + "    -fx-background-insets: 0 0 -1 0,0,1;\n"
                + "    -fx-background-radius: 4,4,3;\n"
                + "    -fx-padding: 7 36 6 36;\n"
                + "    -fx-text-fill: #242d35;\n"
                + "    -fx-font-size: 13px;");

        btnConnect.setOnAction(new EventHandler<ActionEvent>()
        {
            @Override
            public void handle(ActionEvent event)
            {
                System.exit(0);
            }
        });

        Button btnCancel = new Button("Cancel");
        btnCancel.setStyle("-fx-background-color:\n"
                + "        rgba(0,0,0,0.08),\n"
                + "        linear-gradient(#9a9a9a, #909090),\n"
                + "        linear-gradient(white 0%, #f3f3f3 50%, #ececec 51%, #f2f2f2 100%);\n"
                + "    -fx-background-insets: 0 0 -1 0,0,1;\n"
                + "    -fx-background-radius: 4,4,3;\n"
                + "    -fx-padding: 7 36 6 36;\n"
                + "    -fx-text-fill: #242d35;\n"
                + "    -fx-font-size: 13px;");

        btnCancel.setOnAction(new EventHandler<ActionEvent>()
        {
            @Override
            public void handle(ActionEvent event)
            {
                System.exit(0);
            }
        });


        tabConn.setContent(ingridPane);

        HBox hbox = new HBox(6);
        hbox.setSpacing(10);
        hbox.getChildren().add(btnConnect);
        hbox.getChildren().add(btnCancel);
        hbox.setAlignment(Pos.CENTER);

        gridPane.add(ncn, 0, 0);
        gridPane.add(tabPane, 0, 1);
        gridPane.add(hbox, 0, 2);
        gridPane.setAlignment(Pos.CENTER);

        Color bColor = Color.web("F5F5F5", 1.0);
        // Stage
        Scene scene = new Scene(gridPane, 800, 500, Color.WHITE);
        dialog.setScene(scene);
        dialog.setTitle("New Connection");
        //Image icon = new Image(getClass().getResource("/images/system-help.png").toExternalForm());
        //dialog.getIcons().add(icon);
        dialog.show();

        tabPane.lookup(".headers-region").setStyle("-fx-effect: null;");
    }
}

我测试了这段代码。它不起作用。

SOLUTON

tabPane.lookup(".tab-pane .tab-header-area .tab-header-background").setStyle("-fx-background-color: yellow;");

Answer 1

TabPane中有一个内置样式类，您可以使用它。

tabPane.getStyleClass().add("floating");

您可以在场景生成器中查看它

结果将是：

希望它有所帮助。

Answer 2

通过查找子节点并设置样式：

primaryStage.show();
// after the main stage is shown
tabPane.lookup(".headers-region").setStyle("-fx-effect: null;");