Check if component is visible

Question

I implemented a gallery displaying some images. This worked fine for the few images, I had in my example. However as soon as there are more images (>100) memory becomes an issue, as all images are initialized when the gallery is loaded.
Is there an easy way to implement lazy loading? I figure it would suffice to know which component (e.g. HBox) is visible, everything above and below could be loaded when it becomes visible (or I could load on or two rows that are not visible to improve scrolling)

Answer 1

I implemented a quick test with the ListView and a CellFactory:
package javafxtest.image;
import java.io.File;
import java.net.MalformedURLException;
import java.util.ArrayList;
import java.util.logging.Level;
import java.util.logging.Logger;
import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.ListCell;
import javafx.scene.control.ListView;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.image.ImageViewBuilder;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
import javafx.util.Callback;
public class ImageGallery extends Application {
    @Override
    public void start(Stage primaryStage) {
        ListView<String> imageNames = new ListView<>();
        File dir = new File("/home/andi/Pictures");
        ArrayList<String> list = new ArrayList<>();
        for (File f : dir.listFiles()) {
            try {
                list.add(f.toURI().toURL().toExternalForm());
            } catch (MalformedURLException ex) {
                Logger.getLogger(ImageGallery.class.getName()).log(Level.SEVERE, null, ex);
        ObservableList<String> names = FXCollections.observableArrayList(list);
        imageNames.setItems(names);
        imageNames.setCellFactory(new Callback<ListView<String>,
            ListCell<String>>() {
                @Override
                public ListCell<String> call(ListView<String> list) {
                    return new ImageListCell();
        StackPane root = new StackPane();
        root.getChildren().add(imageNames);
        Scene scene = new Scene(root, 500, 600);
        primaryStage.setTitle("Image Gallery");
        primaryStage.setScene(scene);
        primaryStage.show();
    public static void main(String[] args) {
        launch(args);
    private static class ImageListCell extends ListCell<String> {
        @Override
        protected void updateItem(String item, boolean empty) {
            super.updateItem(item, empty);
            if (item != null) {
                Image img = new Image(item);
System.out.println("Update timestamp: "+System.currentTimeMillis()+" load image "+item);
                ImageView imageView = ImageViewBuilder.create()
                        .image(img).build();
                setGraphic(imageView);
}Checking this piece of code with the profiler shows that the memory usage increases constantly the more I scroll through the list. Perhaps I'm missing here something? If the cell would be reused, the GC should be able to collect all the image instances that are no longer visible and thereby keep the memory usage more or less at the same level.
Taking a look at the memory results, I can see that there are some ImageListCell instances, but the big part of the memory is consumed by byte arrays. I suppose the image data goes into those arrays.