进度条显示两种不同颜色的进展

时间:2017-07-13 13:36:29

标签: java javafx-8

我正在尝试用Java编写任务管理器,并且正在考虑使用进度条来显示任务的进度。整个进度条将指示整个任务。我计划展示灰色的整体取消进展,绿色的计划进度,以及完成的红色进度百分比,覆盖在绿色上。但是,我不知道Java是否允许我实现一个填充了两种颜色的进度条,一种覆盖在另一种颜色上。谁能开导我?

4 个答案:

答案 0 :(得分:3)

反思你的问题,我想到了一个快捷方式,重叠更多进度条并使背景透明

尝试使用css

.progress-bar > .track {
  -fx-background-color: transparent;
}
.progress-bar > .bar {
  -fx-background-color: transparent;}

答案 1 :(得分:2)

此链接可能对javafx有帮助: JavaFX ProgressBar: how to change bar color?

他们为进度条设置了前景色和背景色,所以有可能!

答案 2 :(得分:2)

这是一款有点模拟你想做的应用程序。此应用使用两个ProgressBar。背景ProgressBar颜色设置为绿色,其值设置为100.前景ProgressBar颜色设置为红色,它的作用类似于正常ProgressBar,并且每次增加.01 。5秒。

  

主:

import javafx.animation.KeyFrame;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.application.Platform;
import javafx.beans.property.DoubleProperty;
import javafx.beans.property.IntegerProperty;
import javafx.beans.property.SimpleDoubleProperty;
import javafx.beans.property.SimpleIntegerProperty;
import javafx.event.Event;
import javafx.event.EventHandler;
import javafx.geometry.Pos;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.ProgressBar;
import javafx.scene.control.ProgressIndicator;
import javafx.scene.layout.HBox;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
import javafx.util.Duration;

public class ProgressSample extends Application {

    private final DoubleProperty counter = new SimpleDoubleProperty(0.0);

    @Override
    public void start(Stage stage) {
        Group root = new Group();
        Scene scene = new Scene(root, 300, 250);
        stage.setScene(scene);
        stage.setTitle("Progress Controls");

        ProgressBar pbRed = new ProgressBar();
        pbRed.getStylesheets().add(getClass().getResource("ProgressBarColors.css").toExternalForm());
        pbRed.getStyleClass().add("red-bar");
        pbRed.progressProperty().bind(counter);

        ProgressBar pbGreen = new ProgressBar();        
        pbGreen.setStyle("-fx-accent: green;");
        pbGreen.setProgress(1);

        final ProgressIndicator piRed = new ProgressIndicator();

        ProgressIndicator piGreen = new ProgressIndicator();
        piGreen.setProgress(100);

        StackPane spOne = new StackPane();
        spOne.getChildren().addAll(pbGreen, pbRed);

        Timeline timeline = new Timeline();
        timeline.setCycleCount(Timeline.INDEFINITE);
        timeline.getKeyFrames().add(
                new KeyFrame(Duration.seconds(.5),
                        new EventHandler() {
                    // KeyFrame event handler
                    @Override
                    public void handle(Event event)
                    {
                        counter.set(counter.add(.01).get());
                        System.out.println(counter.get());
                    }
                }
                ));
        timeline.playFromStart();

        HBox hbox = new HBox();
        hbox.getChildren().add(spOne);

        final VBox vb = new VBox();
        vb.getChildren().add(hbox);        
        vb.setSpacing(5);
        scene.setRoot(vb);
        stage.show();
    }

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

CSS:

.progress-bar > .track  {
    /*-fx-background-color: transparent ;*/
    -fx-control-inner-background: transparent;
    -fx-text-box-border: transparent;
}

.red-bar    { -fx-accent: red;    }

enter image description here

答案 3 :(得分:0)

如果你想拥有多种颜色的进度条,你必须自己编写。