在幻灯片中逐一显示随机图像的时间线

Question

我想一个接一个地显示我的图像。下面的代码只在将持续时间以秒为单位时才逐一显示图像，如下所示：

 new KeyFrame(Duration.seconds(1), new KeyValue(imageView.imageProperty(), image1)),
 new KeyFrame(Duration.seconds(2), new KeyValue(imageView.imageProperty(), image2)),
 new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), image3)),
 new KeyFrame(Duration.seconds(4), new KeyValue(imageView.imageProperty(), image4)),

因此，我的代码将显示image1 firstn图像2秒，image3三分之二等等。

1)我希望它每次都能显示随机图像。

2)不依赖于持续时间。因为如果我把Duration.seconds(3)放在所有的文件中，它只会显示第一个。

代码如下：

package imagedisplayy;

import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
import javafx.util.Duration;
/**
 *
 * @author D
 */
public class ImageDisplayy extends Application {

    @Override
    public void start(Stage primaryStage) {
        Image image1 = new Image("file:lib/1.jpg");
        Image image2 = new Image("file:lib/2.jpg");
        Image image3 = new Image("file:lib/3.jpg");
        Image image4 = new Image("file:lib/4.jpg");
        ImageView imageView = new ImageView();
        Timeline timeline = new Timeline(

                new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), image1)),
                new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), image2)),  
                new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), image3)),
                new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), image4)),   
                new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), null))
                );
        timeline.play();
        StackPane root = new StackPane();
        root.getChildren().add(imageView);
        primaryStage.setScene(new Scene(root, 800, 600));
        primaryStage.show();
    }

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

Answer 1

这是一个基于数组的解决方案，它循环显示随机选择的图像。数组中的所有图像将以随机顺序显示一次，然后对数组进行洗牌，允许以不同的随机顺序再次显示所有图像。

import javafx.animation.*;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.image.*;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
import javafx.util.Duration;

import java.util.*;
import java.util.stream.Collectors;

public class ImageDisplay extends Application {

    private List<Image> images;
    private Iterator<Image> imageIterator;

    @Override
    public void start(Stage stage) {
        images = Arrays.stream(IMAGE_LOCS)
                .map(Image::new)
                .collect(Collectors.toList());
        Collections.shuffle(images);
        imageIterator = images.iterator();
        ImageView imageView = new ImageView();

        Timeline timeline = new Timeline(
                new KeyFrame(
                        Duration.ZERO,
                        e -> {
                            imageView.setImage(imageIterator.next());
                            System.out.println(
                                 "Displaying " + imageView.getImage().impl_getUrl()
                            );
                        }
                ),
                new KeyFrame(Duration.seconds(1))
        );
        timeline.setCycleCount(images.size());
        timeline.setOnFinished(event -> {
            Collections.shuffle(images);
            imageIterator = images.iterator();
            timeline.playFromStart();
        });
        timeline.play();

        StackPane layout = new StackPane(imageView);
        stage.setScene(new Scene(layout));
        stage.show();
    }

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

    // image license: linkware - backlink to http://www.fasticon.com
    private static final String[] IMAGE_LOCS = {
        "http://icons.iconarchive.com/icons/fasticon/fish-toys/128/Blue-Fish-icon.png",
        "http://icons.iconarchive.com/icons/fasticon/fish-toys/128/Red-Fish-icon.png",
        "http://icons.iconarchive.com/icons/fasticon/fish-toys/128/Yellow-Fish-icon.png",
        "http://icons.iconarchive.com/icons/fasticon/fish-toys/128/Green-Fish-icon.png"
    };
}

因为我们每次洗牌，最后显示的图像有可能被洗牌为下一个循环中的第一个图像(连续显示两次)。如果您不希望在周期之间更改顺序，只需在播放时间结束时删除执行的混乱命令即可。

注意，为了简单起见，代码使用impl_getUrl()将显示的图像urls输出到控制台--生产代码中不推荐使用impl方法。

Answer 2

在堆栈窗格中，显示所有四个图像的时间为3秒，您需要它们逐一显示。变化

 new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), image1)),
            new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), image2)),  
            new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), image3)),
            new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), image4)),   
            new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), null))
            );

至

     new KeyFrame(Duration.ZERO, new KeyValue(imageView.imageProperty(), image1)),
            new KeyFrame(Duration.seconds(1), new KeyValue(imageView.imageProperty(), image2)),  
            new KeyFrame(Duration.seconds(2), new KeyValue(imageView.imageProperty(), image3)),
            new KeyFrame(Duration.seconds(3), new KeyValue(imageView.imageProperty(), image4)),   
            new KeyFrame(Duration.seconds(4), new KeyValue(imageView.imageProperty(), null))
            );