如何更改 RangeSlider (JavaFX) 中内部幻灯片的颜色？

Question

我正在尝试更改 RangeSlider

的 css

我在我的 FXML 文件中使用这个 Maven 依赖项

    <dependency>
        <groupId>org.controlsfx</groupId>
        <artifactId>controlsfx</artifactId>
        <version>8.40.12</version>
    </dependency

它在 fxml 文件中的 ID 是：

<RangeSlider fx:id="rangeSlider"

我将它注入到控制器中：

@FXML
private RangeSlider rangeSlider

然后我设置一个 Id 来改变它的外观 CSS :

@Override
public void initialize(URL url, ResourceBundle rb){

    rangeSlider.adjustHighValue(30);
    rangeSlider.setId("rangeSlider");
}

在 CSS 一侧：

#rangeSlider .thumb {
    -fx-background-color: #2196f3;
}

#rangeSlider .track{
    -fx-background-color: #151928;
}

我不知道如何更改内部蓝色

非常感谢任何帮助

Answer 1

负责拇指之间颜色的节点是 StackPane，样式为 class range-bar。 -fx-background-color 默认为 -fx-focus-color，但您可以覆盖此属性:

#rangeSlider .range-bar {
    -fx-background-color: red;
}

如果想看详情，请参考RangeSliderSkin.initRangeBar code and/or rangeslider.css。

如何更改 RangeSlider (JavaFX) 中内部幻灯片的颜色？

How to change the color of the inner slide in a RangeSlider (JavaFX)?

css

javafx

controlsfx

javafx-css