How to lazy load a picture instead of waiting for it to be finished downloading in Java?

Question

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;


public class Testwebimage extends Application {

    public void start(Stage primaryStage) {

        Image image = new Image("http://i.imgur.com/hbjCOgg.jpg");
        ImageView imageView = new ImageView();
        imageView.setImage(image);

        StackPane root = new StackPane();
        root.getChildren().add(imageView);
        Scene scene = new Scene(root);

        primaryStage.setScene(scene);
        primaryStage.setMaximized(true);
        primaryStage.show();
    }
    public static void main(String[] args) {
        launch(args);
    }

I'm trying to create a program which displays an image straight from the url, but the problem I have is that it waits for the image to be fully loaded and then displays it, which means that if the image size is big, it will take a bunch of time to display the image, which can get annoying. But if it would show the image loading open, kind of like this.

Does anyone have any idea how to achieve something like this?

Answer 1

Here is an example of loading an image asynchronously. You can choose whether you want to use a local file or a remote URL.

package jfxfeatures.graphics.image.loading.async;

import java.io.File;
import java.net.MalformedURLException;

import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;

public class AsyncImageDemo extends Application {

    @Override
    public void start(Stage stage) {
        String imgURL = null;
        try {
            final String remoteURL = "http://farm5.staticflickr.com/4129/4960490401_71a3d05d28_o_d.jpg";
            final String remoteURL2 = "http://www.spacetelescope.org/static/archives/posters/large/earth02.jpg";
            final String localURL = new File("data/earth02.jpg").toURI().toURL().toExternalForm();
            final String localFile = "/earth02.jpg";

            //===========================
            // Select local or remote image source.
            imgURL = localFile;
            //===========================
        } catch (MalformedURLException e1) {
            e1.printStackTrace();
        }

        StackPane root = new StackPane();
        Scene scene = new Scene(root, 800, 800);
        scene.setFill(Color.BLACK);

        ImageView iv = new ImageView();
        iv.setPreserveRatio(true);
        iv.fitHeightProperty().bind(root.heightProperty());
        iv.fitWidthProperty().bind(root.widthProperty());
        root.getChildren().add(iv);

        stage.setTitle(getClass().getSimpleName());
        stage.setScene(scene);
        stage.show();

        if (imgURL != null) {
            Image image = new Image(imgURL, true);
            image.progressProperty().addListener(new ChangeListener<Number>() {
                @Override
                public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
                    System.out.println("Progress: " + Math.rint(newValue.doubleValue() * 100) + "%");
                }
            });
            iv.setImage(image);
        }
    }

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