JavaFX ControlsFX CSS for RangeSlider

Question

我刚刚下载了JavaFX ControlsFX库，目前已陷入困境。我正在使用库中的一个自定义组件，称为RangeSlider，但需要为CSS中的每个拇指操作样式。我到处找遍了，但似乎找不到有用的东西。有办法吗？我知道，对于常规的java Slider组件，可以这样做：

.slider .thumb {
     // Style code here
 }

但是，当我在RangeSlider中使用这样的东西时，没有什么是可行的。这是有意义的，因为有两个滑块，但我已经尝试了100个组合的子结构名称将是无效的。

任务:我试图改变每个拇指图标，我也有兴趣改变两个拇指之间的颜色(目前是蓝色)。

希望这是非常明显的事情，谢谢！

Answer 1

RangeSlider的默认样式类是range-slider。您可以在rangeslider.css文件(在controlsfx.jar上)或在存储库上找到所有样式规则。

如果要更改拇指(这些是StackPane对象)，可以使用-fx-shape

.range-slider .low-thumb {
    -fx-shape: "M2.998-0.07L3-1.499l2.998,4L3,6.501l-0.002-1.43l1.976-2.57L2.998-0.07z";
}
.range-slider .high-thumb {
    -fx-shape: "M5.997,5.072L5.995,6.501l-2.998-4l2.998-4l0.002,1.43l-1.976,2.57L5.997,5.072z";
}

这将改变范围栏的颜色：

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

​

​