ProgressIndicator透明背景

时间:2014-05-28 12:53:11

标签: css javafx javafx-8

所以我有这段代码:

    final StackPane g = new StackPane();        
    final ProgressIndicator p1 = new ProgressIndicator();
    p1.setPrefSize(100, 100);  
    p1.progressProperty().addListener(new ChangeListener<Number>() {

        @SuppressWarnings("rawtypes") 
        @Override
        public void changed(ObservableValue ov, Number oldVal, Number newVal) {

            if (p1.getProgress() < 0.3) {
                p1.setStyle("-fx-progress-color: red;");
            } else if (p1.getProgress() < 0.65) {
                p1.setStyle("-fx-progress-color: orange;");
            } else {
                p1.setStyle("-fx-progress-color: green;");
            }

        }
    });
    timeline.setCycleCount(Timeline.INDEFINITE);
    timeline.setAutoReverse(true);

    final KeyValue kv = new KeyValue(p1.progressProperty(), 1);
    final KeyFrame kf1 = new KeyFrame(Duration.millis(3000), kv);
    timeline.getKeyFrames().add(kf1);


    g.getChildren().addAll(p1); //veil
    g.setAlignment(Pos.CENTER);

然后我将堆栈窗格添加到场景,将场景添加到舞台。

我有两个阶段,初始阶段有我所有的事情,这个额外的阶段有进度指示器。问题在于:包含进度指示器的舞台有一个白色方块(方框)作为背景,非常适合其他舞台,因为通常具有相同的白色背景。但是当初始背景不是白色时,我可以看到进度指示器阶段的白色背景。所以这是我的问题:如何让这个背景透明?我尝试了BlendMode类,但这似乎不起作用。有任何想法吗?

提前致谢!

3 个答案:

答案 0 :(得分:0)

使用外部样式表

.progress-indicator .indicator {
    -fx-background-color: transparent ;
}

这是一个完整的例子(我使用外部样式表来管理颜色,但无论如何都会这样做):

import javafx.application.Application;
import javafx.application.Platform;
import javafx.concurrent.Task;
import javafx.css.PseudoClass;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.Control;
import javafx.scene.control.ProgressIndicator;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class ProgressIndicatorTest extends Application {

    @Override
    public void start(Stage primaryStage) {
        StackPane root = new StackPane();
        ProgressIndicator pi = new ProgressIndicator();
        Task<Void> counter = new Task<Void>() {
            @Override
            public Void call() throws Exception {
                for (int i = 1; i <= 100; i++) {
                    Thread.sleep(50);
                    updateProgress(i, 100);
                }
                return null;
            }
        };
        pi.progressProperty().bind(counter.progressProperty());
        pi.progressProperty().addListener((obs, oldProgress, newProgress) -> {
            PseudoClass warning = PseudoClass.getPseudoClass("warning");
            PseudoClass critical = PseudoClass.getPseudoClass("critical");
            if (newProgress.doubleValue() < 0.3) {
                pi.pseudoClassStateChanged(warning, false);
                pi.pseudoClassStateChanged(critical, true);
            } else if (newProgress.doubleValue() < 0.65) {
                pi.pseudoClassStateChanged(warning, true);
                pi.pseudoClassStateChanged(critical, false);
            } else {
                pi.pseudoClassStateChanged(warning, false);
                pi.pseudoClassStateChanged(critical, false);
            }
        });
        pi.setMaxSize(Control.USE_PREF_SIZE, Control.USE_PREF_SIZE);
        root.setStyle("-fx-background-color: antiqueWhite;");
        root.getChildren().add(pi);
        Scene scene = new Scene(root, 400, 400);
        scene.getStylesheets().add("progress.css");
        primaryStage.setScene(scene);
        primaryStage.show();
        new Thread(counter).start();
    }

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

progress.css:

.progress-indicator .indicator {
    -fx-background-color: transparent ;
}
.progress-indicator {
    -fx-progress-color: green ;
}
.progress-indicator:critical {
    -fx-progress-color: red ;
}
.progress-indicator:warning {
    -fx-progress-color: orange ;
}

答案 1 :(得分:0)

尝试使用css(基于Java 8u40的错误修复):

.progress-indicator:indeterminate > .spinner {
    /** Applying to undo styling from .spinner, reported in RT-37965 */
    -fx-background-color: transparent;
    -fx-background-insets: 0;
    -fx-background-radius: 0;
}

答案 2 :(得分:0)

对我来说,以上所有答案均无效。

我终于通过以下方式使它起作用:

progressIndicator.getScene().getRoot().setStyle("-fx-background-color: transparent");

如果使用场景,请通过以下操作使场景透明:

scene.setFill(null);