如何在JavaFX中获得一个小型ProgressBar

Question

我试图让iTunes像进度条一样非常小(高度约为5px),但我似乎不能低于19或20px.

我尝试设置-fx-max-height无效,也在周围的窗格上.请注意,此值确实会改变高度 - 我只是不能低于约20px.

任何想法如何实现？我想避免使用普通矩形来表示进度,因为语义的丧失和辅助技术的支持.

谢谢.

Answer 1

该ProgressBar默认样式就是为什么你不能降低其高度的原因.

正如我们在modena.css文件中看到的progress-barCSS选择器:

.progress-bar > .bar {
    -fx-background-color: linear-gradient(to bottom, derive(-fx-accent, -7%), derive(-fx-accent, 0%), derive(-fx-accent, -3%), derive(-fx-accent, -9%) );
    -fx-background-insets: 3 3 4 3;
    /*-fx-background-radius: 0.583em; *//* 7 */
    -fx-background-radius: 2;
    -fx-padding: 0.75em;
}

两个CSS属性负责:-fx-padding蓝色内部条-fx-background-insets的高度和周围灰色条的高度.

因此,您可以根据需要自定义此选择器.例如,使用这些属性,您将拥有5像素高度:

.progress-bar > .bar {
    -fx-background-insets: 1 1 2 1;
    -fx-padding: 0.20em;
}

您的代码无需高度设置:

@Override
public void start(Stage primaryStage) {

    ProgressBar pb = new ProgressBar(0.4);
    pb.setPrefWidth(200);
    StackPane root = new StackPane(pb);

    Scene scene = new Scene(root, 300, 200);
    scene.getStylesheets().add(getClass().getResource("root.css").toExternalForm());
    primaryStage.setTitle("Hello World!");
    primaryStage.setScene(scene);
    primaryStage.show();
}