Getting images to show on grid-pane dynamically

Question

My goal is to display images that are selected from a filechooser activated by button, and add those images to my gridpane. I am able to get the right URL file path name from the file chooser in order to make a correct imageview however when doing so my gridpane does not show any images being added..

public void makeBrowseButton(Stage primaryStage) {

    //attach handler
    browseButton.setOnAction(new EventHandler<ActionEvent>() {
        @Override public void handle(ActionEvent event) {
            FileChooser fileChooser = new FileChooser();                                                                            // create object
            fileChooser.getExtensionFilters()
                    .addAll(new FileChooser.ExtensionFilter("Image Files", "*.png", "*.jpg", "*.gif"));    //filter for music files
            //FileFilter filter = new FileNameExtensionFilter("JPEG file", "jpg", "jpeg");
            if (!parentPath.equalsIgnoreCase(
                    "")) {                                                                                //go to previous directory if exists
                File parentPathFile = new File(parentPath);
                fileChooser.setInitialDirectory(parentPathFile);
            }
            File selectedFile = fileChooser.showOpenDialog(primaryStage);

            if (selectedFile != null) {                                                  // display the dialog box
                String wholePath = selectedFile.getPath();
                String name = selectedFile.getName();
                String megaPath = selectedFile.getAbsolutePath();
                String megaUrl;
                try {
                    megaUrl = Paths.get(megaPath).toUri().toURL().toString();
                } catch (MalformedURLException e) {
                    throw new IllegalArgumentException(e);
                }

                parentPath = selectedFile.getParent();
                System.out.println("wholePath: " + wholePath);
                System.out.println("parent: " + parentPath);
                System.out.println("File Name: " + name);
                System.out.println("megaPath: " + megaUrl);
                //System.out.println("Canonical: " + Canonical);

                Image newAwesomeImage = new Image(megaUrl);
                paneofgridmonkeys.add(new ImageView(newAwesomeImage), 0, 0);
                //ImageView view = new ImageView();
                //view.setImage(newAwesomeImage);
                //paneofgridmonkeys.add(view, 1, 1);
                //paneofgridmonkeys.setConstraints(view, 0, 4);
                //paneofgridmonkeys.add(new Label("Changed the image!"), 0, 1);
                createDisplay(primaryStage);
            }
        }
    });
}

I've tried multiple ways of insterting an images and these are the filepaths im getting:

wholePath: \\jupiter\yr1005\Desktop\20190111_1340501.jpg
parent: \\jupiter\yr1005\Desktop
File Name: 20190111_1340501.jpg
megaPath: file://jupiter/yr1005/Desktop/20190111_1340501.jpg

(im using the megapath)

basically when i choose an image from filechooser I get no error but no image is shown after selection. I just get all the print statements in return.. an idea why?

This is my create Display method:

   public void createDisplay(Stage primaryStage) {

   primaryStage.setTitle(this.MONKEY_TITLE);
   GridPane paneofgridmonkeys = new GridPane();
   paneofgridmonkeys.setAlignment(Pos.CENTER);
   paneofgridmonkeys.setVgap(10);
   paneofgridmonkeys.add(browseButton, 10, 10);

   ScrollPane allTehFaces = new ScrollPane(paneofgridmonkeys);
   allTehFaces.setFitToWidth(true);
       primaryStage.setScene(new Scene(allTehFaces, 500, 500));primaryStage.show();
     }
   }

Answer 1

You're problem is in the createDisplay method; specifically this line:

   GridPane paneofgridmonkeys = new GridPane();

Here you're creating a locally-scoped GridPane called paneofgridmonkeys, which must be the name of another class-level variable called paneofgridmonkeys, since it's available to makeBrowseButton. When you do this in local scope, the new instance you've created becomes the one that's used inside of that method, rather than the class-level instance; thus the class-level one isn't the one being added to your scene, and you're not seeing the changes.