在FadeTransition期间，图像闪烁瞬间 - Javafx

Question

我目前正在尝试构建游戏，并且我有一个图像的介绍序列，附带文字，用于游戏的背景故事。在开始时，我淡入带有文字的图像，然后淡出两个。然后，我在前一个淡入淡出完成后开始下一个图像 - 文本配对，我这样做直到背景故事完成，但是当我这样做时，图像和文本在淡入开始之前瞬间闪烁一瞬间图像和文字。我已经尝试了很多东西，但似乎无法摆脱闪烁，有人可以帮忙吗？

这是我在介绍中用于此部分的功能：

private void backgroundStory (Stage stage, MediaPlayer mediaPlayer, String nameEntry, int width, int height, Color color) {

            Group backstoryRoot = changeScene(stage, width, height, color);
            GridPane backstoryPane = new GridPane();

            backstoryRoot.getChildren().add(backstoryPane);

            Label storyLabel1 = createLabel("Sometimes, life can get monotonous...");

            backstoryPane.getColumnConstraints().add(new ColumnConstraints(width));
            RowConstraints initialConstraint = new RowConstraints ((height/2)+20);
            backstoryPane.getRowConstraints().add(initialConstraint);

            int fadeDuration = 4000;
            FadeTransition storyTextTransition1 = storyTextFade(storyLabel1, fadeDuration);
            backstoryPane.getChildren().add(storyLabel1);
            GridPane.setValignment(storyLabel1, VPos.BOTTOM);
            GridPane.setHalignment(storyLabel1, HPos.CENTER);

            storyTextTransition1.setOnFinished(new EventHandler<ActionEvent>() {

                @Override
                public void handle(ActionEvent event) {

                    backstoryPane.getChildren().remove(storyLabel1);
                    backstoryPane.getRowConstraints().remove(initialConstraint);
                    backstoryPane.getRowConstraints().add(new RowConstraints(25));

                    VBox vbox = new VBox (10);
                    backstoryPane.add(vbox, 0, 1);
                    vbox.setAlignment(Pos.TOP_CENTER);

                    ImageView dayAndNight = createImage ("Images/Day_And_Night.jpg");
                    Label storyLabel2 = createLabel("I was living in the city, following the same routine day and night.");
                    vbox.getChildren().add(dayAndNight);
                    vbox.getChildren().add(storyLabel2);
                    storyImageFade(dayAndNight, fadeDuration);
                    FadeTransition storyTextTransition2 = storyTextFade(storyLabel2, fadeDuration);

                    String officeReception = "Images/Office_Reception.jpg";
                    String receptionText = "Seeing the same faces every morning.";

                    FadeTransition storyTextTransition3 = nextPicture (storyTextTransition2, officeReception, receptionText, fadeDuration, vbox);


                    String office = "Images/Office.jpg";
                    String officeText = "Doing the same work every day.";
                    FadeTransition storyTextTransition4 = nextPicture (storyTextTransition3, office, officeText, fadeDuration, vbox);
                }
            });


            //mediaPlayer.stop();
            //introExplanation (stage, nameEntry, width, height, color);
        }

这些是在其中调用的函数：

private Label createLabel(String labelText) {
            Label storyLabel = new Label(labelText);
            Font storyFont = Font.font( "Blackadder ITC", 25 );
            storyLabel.setTextFill(Color.INDIANRED);
            storyLabel.setFont(storyFont);
            return storyLabel;
        }

        private FadeTransition storyTextFade(Label label, int duration) {
            FadeTransition storyTransition = new FadeTransition(Duration.millis(duration), label);
            storyTransition.setFromValue(0);
            storyTransition.setToValue(1);
            storyTransition.setCycleCount(2);
            storyTransition.setAutoReverse(true);
            storyTransition.play();
            return storyTransition;
        }

        private void storyImageFade(ImageView image, int duration) {
            FadeTransition imageTransition = new FadeTransition(Duration.millis(duration), image);
            imageTransition.setFromValue(0);
            imageTransition.setToValue(1);
            imageTransition.setCycleCount(2);
            imageTransition.setAutoReverse(true);
            imageTransition.play();
        }

        private ImageView createImage (String imageName) {
            Image image = new Image(imageName);
            ImageView imageview = new ImageView(image);
            imageview.setFitWidth(500);
            imageview.setFitHeight(500);
            //imageview.setPreserveRatio(true);
            imageview.setSmooth(true);
            imageview.setCache(true);
            return imageview;
        }

        private FadeTransition nextPicture (FadeTransition transition, String image, String imageLabel, int fadeDuration, VBox vbox) {
            ArrayList<FadeTransition> transitionList = new ArrayList<FadeTransition>();
            transition.setOnFinished(new EventHandler<ActionEvent>() {

                @Override
                public void handle(ActionEvent event) {

                    vbox.getChildren().clear();
                    ImageView imageview = createImage (image);
                    storyImageFade(imageview, fadeDuration);

                    Label storyLabel = createLabel(imageLabel);
                    FadeTransition storyTextTransition = storyTextFade(storyLabel, fadeDuration);
                    transitionList.add(storyTextTransition);

                    vbox.getChildren().add(imageview);
                    vbox.getChildren().add(storyLabel);
                }
            });
            return transitionList.get(0);
        }

谢谢！

Answer 1

这是我的第一个回复，如果我没有做出适当回应，我会道歉。

在场景之间转换时，我遇到了同样的问题。我的解决方案是在将节点添加到容器之前将节点不透明度设置为0 。

对于您的情况，似乎所有标签和图像都是在createLabel和createImage方法中创建的，结果值是正在淡化的值。

private Label createLabel(String labelText) {
    Label storyLabel = new Label(labelText);
    Font storyFont = Font.font( "Blackadder ITC", 25 );
    storyLabel.setTextFill(Color.INDIANRED);
    storyLabel.setFont(storyFont);

    // Set the opacity before returning the object
    storyLabel.setOpacity(0);

    return storyLabel;
}

private ImageView createImage (String imageName) {
    Image image = new Image(imageName);
    ImageView imageview = new ImageView(image);
    imageview.setFitWidth(500);
    imageview.setFitHeight(500);
    //imageview.setPreserveRatio(true);
    imageview.setSmooth(true);
    imageview.setCache(true);

    // Set the opacity before returning the object
    imageview.setOpacity(0);

    return imageview;
}

我希望这会有所帮助。