无法让 JavaFX 分隔符设置不同颜色的样式

问题描述

我想要做的就是在 VBox 中的元素之间添加一个分隔符，但我希望分隔线的颜色与默认颜色不同。我们以红色为例。

我能找到的唯一可以改变线条颜色的 CSS 是这样的：

.separator {
    -fx-padding: 8;
}

.separator .line {
    -fx-background-color: red;
    -fx-pref-height: 5;
}

但这似乎添加了第二行，并且没有像您在此处看到的那样为主要行着色：

它需要看起来像这样：

这是一个显示问题的工作示例。如果您运行此代码，则需要将其添加到 POM 文件中：

<dependency>
    <groupId>com.simtechdata</groupId>
    <artifactId>Switcher</artifactId>
    <version>1.3.4</version>
</dependency>

并创建一个名为 Separator.css 的 CSS 文件并将其放在资源文件夹中。 css 文件的内容已经在这篇文章中（我发布的第一个代码片段）。

这是运行类：

package sample;

import com.simtechdata.Switcher;
import javafx.application.Application;
import javafx.scene.control.Label;
import javafx.scene.control.Separator;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;


public class Main extends Application {

    private final       ClassLoader resource       = ClassLoader.getSystemClassLoader();
    @Override
    public void start(Stage primaryStage) throws Exception{
        String separatorCSS = resource.getResource("Separator.css").toExternalForm();        AnchorPane ap = new AnchorPane();
        ap.setPrefWidth(300);
        ap.setPrefheight(400);
        Switcher.addScene(10,ap,300,400);
        ap.setStyle("-fx-background-color: black");
        Label label1 = new Label("Example Text");
        Label label2 = new Label("More Example Text");
        label1.setStyle("\t-fx-font-size: 24pt;\n" +
                       "\t-fx-font-family: \"Segoe UI Semibold\";\n" +
                       "\t-fx-text-fill: rgb(255,155,0);\n" +
                       "\t-fx-alignment: center;\n");
        label2.setStyle("\t-fx-font-size: 24pt;\n" +
                       "\t-fx-font-family: \"Segoe UI Semibold\";\n" +
                       "\t-fx-text-fill: rgb(255,0);\n" +
                       "\t-fx-alignment: center;\n");
        Separator separator = new Separator();
        separator.getStylesheets().add(separatorCSS);
        VBox vBox = new VBox();
        vBox.getChildren().addAll(label1,separator,label2);
        ap.getChildren().add(vBox);
        Switcher.showScene(10);
    }

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

有谁知道如何以编程方式或使用 CSS 更改 JavaFX 分隔符行的颜色？

谢谢，

迈克·西姆斯

解决方法

默认情况下，Separator has a border（对于水平分隔符，边框位于顶部）。这是您看到的白线。

去掉边框，例如：

.separator .line {
    -fx-background-color: red;
    -fx-pref-height: 5;
    -fx-border-color: null ;
}