当方向是水平时,我试图通过-fx-pref-height: 10px;
设置厚度,当滚动条方向是垂直时,我尝试通过-fx-pref-width: 10px;
设置厚度。但是不起作用。
.scroll-bar:horizontal .thumb {
-fx-background-color: derive(black, 90%);
-fx-background-insets: 2, 0, 0;
-fx-background-radius: 0em;
-fx-pref-height: 10px;
}
.scroll-bar:vertical .thumb {
-fx-background-color: derive(black, 90%);
-fx-background-insets: 2, 0, 0;
-fx-background-radius: 0em;
-fx-pref-width: 10px;
}
如何通过自定义css实现这一目标?
您可以设置滚动条的填充以缩小拇指的厚度。
.scroll-bar:vertical {
-fx-pref-width: 16.5;
-fx-padding: 3;
}
.scroll-bar:horizontal {
-fx-pref-height: 16.5;
-fx-padding: 3;
}
.scroll-bar, .scroll-bar:pressed, .scroll-bar:focused {
-fx-font-size: 15;
}