JavaFX progress indicator in interface construction

1

I need to create a progress indicator so that the user realizes that the program is performing something behind.

Briefly, I want to load images into a% grid style gallery, but when I try to load those images sometimes it may take some time for the program to appear to be embossed.

The gallery is based on this link: link

Code:

importController.FxmlSplashLoadingController;importjava.io.File;importjava.io.FileInputStream;importjava.io.FileNotFoundException;importjava.io.IOException;importjava.util.logging.Level;importjava.util.logging.Logger;importjavafx.application.Application;importjavafx.application.Platform;importjavafx.concurrent.Task;importjavafx.concurrent.WorkerStateEvent;importjavafx.event.ActionEvent;importjavafx.event.EventHandler;importjavafx.fxml.FXMLLoader;importjavafx.geometry.Insets;importjavafx.scene.Parent;importjavafx.scene.Scene;importjavafx.scene.control.Button;importjavafx.scene.control.ScrollPane;importjavafx.scene.image.Image;importjavafx.scene.image.ImageView;importjavafx.scene.input.MouseButton;importjavafx.scene.input.MouseEvent;importjavafx.scene.layout.BorderPane;importjavafx.scene.layout.StackPane;importjavafx.scene.layout.TilePane;importjavafx.scene.paint.Color;importjavafx.stage.Modality;importjavafx.stage.Screen;importjavafx.stage.Stage;importjavafx.stage.StageStyle;publicclassTestExampleextendsApplication{Stagestage;TilePanetile;@Overridepublicvoidstart(StageprimaryStage)throwsException{stage=primaryStage;ScrollPaneroot=newScrollPane();tile=newTilePane();root.setStyle("-fx-background-color: DAE6F3;");
        tile.setPadding(new Insets(15, 15, 15, 15));
        tile.setHgap(15);

        //loading example
        Stage stageLoader = createLoaderSplashBar();
        //stageLoader.show();
        stageLoader.setAlwaysOnTop(true);
        // here runs the JavaFX thread
        // Boolean as generic parameter since you want to return it

        Task task = new Task<Void>() {
            @Override
            protected Void call() throws Exception {
                Platform.runLater(new Runnable() {
                    @Override
                    public void run() {
                        taskLongLoadImg();

                    }
                });

                return null;
            }
        };

        task.setOnRunning((e) -> stageLoader.show());
        task.setOnSucceeded((e) -> {
            stageLoader.hide();
            //Boolean returnValue = task.get();
            // process return value again in JavaFX thread
        });
        task.setOnFailed((e) -> {
            // eventual error handling by catching exceptions from task.get()  
        });
        new Thread(task).start();

        root.setHbarPolicy(ScrollPane.ScrollBarPolicy.NEVER); // Horizontal
        root.setVbarPolicy(ScrollPane.ScrollBarPolicy.AS_NEEDED); // Vertical scroll bar
        root.setFitToWidth(true);
        root.setContent(tile);

        primaryStage.setWidth(Screen.getPrimary().getVisualBounds().getWidth());
        primaryStage.setHeight(Screen.getPrimary().getVisualBounds()
                .getHeight());
        Scene scene = new Scene(root);
        primaryStage.setScene(scene);
        primaryStage.show();

    }

    public Stage createLoaderSplashBar() {

        Stage newStage = new Stage();
        FXMLLoader fxmlLoader = new FXMLLoader(getClass().getResource("/View/FxmlSplashLoading.fxml"));
        Parent root = null;
        try {
            root = (Parent) fxmlLoader.load();
        } catch (IOException ex) {
            System.out.println("Error  -  Loading FxmlSplashLoading.fxml");
            Logger.getLogger(TestExample.class.getName()).log(Level.SEVERE, null, ex);
        }
        FxmlSplashLoadingController controller = fxmlLoader.<FxmlSplashLoadingController>getController();

        controller.setStage(newStage);
        controller.setController(controller); // guardar o proprio controller para depois poder inserir texto na label
        newStage.setScene(new Scene(root));

//        newStage.focusedProperty().addListener((obs, wasFocused, isNowFocused) -> {
//            if (!isNowFocused) {
//                System.out.println("windows closed  .......");
//                newStage.hide();
//            }
//        });
        newStage.initStyle(StageStyle.UNDECORATED);
        newStage.initModality(Modality.WINDOW_MODAL);
//        newStage.show();

        return newStage;
    }

    public void taskLongLoadImg(){
            String path = "C:\Users\jsantos1991\Pictures\ImagesTeste";

        File folder = new File(path);
        File[] listOfFiles = folder.listFiles();

        for (final File file : listOfFiles) {
                System.out.println("file:" +file.getName());
                file.setReadOnly();
                ImageView imageView;
                imageView = createImageView(file);
                tile.getChildren().addAll(imageView);
                try {
                    Thread.sleep(300); // 
                } catch (InterruptedException ex) {
                    Logger.getLogger(TestExample.class.getName()).log(Level.SEVERE, null, ex);
                }
        }
    }

    private ImageView createImageView(final File imageFile) {
        // DEFAULT_THUMBNAIL_WIDTH is a constant you need to define
        // The last two arguments are: preserveRatio, and use smooth (slower)
        // resizing

        ImageView imageView = null;
        try {
            final Image image = new Image(new FileInputStream(imageFile), 150, 0, true,
                    true);
            imageView = new ImageView(image);
            imageView.setFitWidth(150);
            imageView.setOnMouseClicked(new EventHandler<MouseEvent>() {

                @Override
                public void handle(MouseEvent mouseEvent) {

                    if(mouseEvent.getButton().equals(MouseButton.PRIMARY)){

                        if(mouseEvent.getClickCount() == 2){
                            try {
                                BorderPane borderPane = new BorderPane();
                                ImageView imageView = new ImageView();
                                Image image = new Image(new FileInputStream(imageFile));
                                imageView.setImage(image);
                                imageView.setStyle("-fx-background-color: BLACK");
                                imageView.setFitHeight(stage.getHeight() - 10);
                                imageView.setPreserveRatio(true);
                                imageView.setSmooth(true);
                                imageView.setCache(true);
                                borderPane.setCenter(imageView);
                                borderPane.setStyle("-fx-background-color: BLACK");
                                Stage newStage = new Stage();
                                newStage.setWidth(stage.getWidth()-400);
                                newStage.setHeight(stage.getHeight()-400);
                                newStage.setTitle(imageFile.getName());
                                Scene scene = new Scene(borderPane,Color.BLACK);
                                newStage.setScene(scene);
                                newStage.show();

                                newStage.focusedProperty().addListener((obs, wasFocused, isNowFocused) -> {
                                    if (!isNowFocused) {
                                        System.out.println("focus out  .......");
                                        newStage.hide();
                                    }
                                });
                            } catch (FileNotFoundException e) {
                                e.printStackTrace();
                            }

                        }
                    }
                }
            });
        } catch (FileNotFoundException ex) {
            ex.printStackTrace();
        }
        return imageView;
    }


    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

}

In short, I wanted you to show an indicator of progress and that you could see TilePane adding images / to be updated from behind.

    
asked by anonymous 17.01.2018 / 11:26

1 answer

1

I made a test from the original code you posted and I was able to make a simple progress indicator.

Scene scene = new Scene(root);
primaryStage.setScene(scene);
primaryStage.show();

/* 
 * Coloque o código de carregamento após a abertura da janela principal
 * para não parecer que o programa travou
 */ 
File folder = new File(path);
File[] listOfFiles = folder.listFiles();

// Indicador de progresso em forma de bola    
ProgressIndicator pi = new ProgressIndicator(0.0);
tile.getChildren().add(pi);

/*
 * As Task são usadas para tarefas que não envolvem atualização da UI
 * pois toda atualização de UI deve ser executada pela FX Application Thread
 * Nesse caso deve-se usar o services
 */
Service carregarFotos = new Service() {
    @Override
    protected Task createTask() {
        Task<ObservableList> task = new Task<ObservableList>() {
            @Override
            protected ObservableList call() throws Exception {
                ObservableList<ImageView> itens = FXCollections.observableArrayList();

                // Aqui testei com a mesma imagem 30 vezes.
                // Utilizando um foreach você terá que ver um jeito de
                // mensurar o progresso atual e o total para o updateProgress funcionar
                for(int i = 0; i < 30; i++){
                    ImageView imageView = createImageView(folder);
                    itens.add(imageView);
                    updateProgress(i, 29);
                }
                    // Retorna o array de imagens carregadas
                    return itens;
                }
            };

            return task;
        };
    };

// Atrela o progresso da barra com o progresso da service
pi.progressProperty().bind(carregarFotos.progressProperty());

// Inicia o serviço
carregarFotos.start();

// Quando o service termina a execução pega o resultado da thread
// e adiciona ao tile
carregarFotos.setOnSucceeded((Event event) -> {
    ObservableList<ImageView> itens = (ObservableList<ImageView>) carregarFotos.getValue();
    tile.getChildren().addAll(itens);
});

Here is the photo of the tests during execution and after:

    
30.01.2018 / 00:01