'Get image to show in Java GUI application from an Array

So I need this done for a programming project but basically when I click the button "roll" I need two dice images to appear in my window during the action event. Here is what I have so far can someone please help me figure this out?

public class Main extends Application {
    
    
    Button roll;
    Stage window;
    ImageView imageview;
    Random random = new Random();

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

    @Override
    public void start(Stage primaryStage) throws Exception {
        window = primaryStage;
        primaryStage.setTitle("Dice Game");
        
        GridPane grid = new GridPane();
        grid.setPadding(new Insets(15, 15, 15, 15));
        grid.setVgap(5);
        grid.setHgap(5);
        
        //Into label
            Label intro = new Label("Hit roll to see your role!");
            GridPane.setConstraints(intro, 0, 0);
        
            
        //button setup  
        roll = new Button("Roll!");
        GridPane.setConstraints(roll, 0, 5);
        
        //FileInputStream dices = new FileInputStream("C:\\Users\\Arber\\Desktop\\Die\\Die1.png");
       // Image image = new Image(dices);
       // ImageView imageView = new ImageView(image);
       // GridPane.setConstraints(imageView, 7, 5);
        
      //  FileInputStream dices2 = new FileInputStream("C:\\Users\\Arber\\Desktop\\Die\\Die2.png");
       // Image image2 = new Image(dices2);
       // ImageView imageView2 = new ImageView(image2);
       // GridPane.setConstraints(imageView2, 7, 2);
        
        
        
        int dieNum = random.nextInt(6);
        Image dice1 = new Image("C:\\Users\\Arber\\Desktop\\Die\\Die1.png");
        Image dice2 = new Image("C:\\Users\\Arber\\Desktop\\Die\\Die2.png");
        Image dice3 = new Image("C:\\Users\\Arber\\Desktop\\Die\\Die3.png");
        Image dice4 = new Image("C:\\Users\\Arber\\Desktop\\Die\\Die4.png");
        Image dice5 = new Image("C:\\Users\\Arber\\Desktop\\Die\\Die5.png");
        Image dice6 = new Image("C:\\Users\\Arber\\Desktop\\Die\\Die6.png");
        
        Image[] imageArray = {dice1,dice2,dice3,dice4,dice5,dice6};
        
        roll.setOnAction(e -> {
            ImageView imageView2 = new ImageView();
            GridPane.setConstraints(imageView2, 7, 2);
        });
        
        
        grid.getChildren().addAll(intro, roll);
        Scene scene = new Scene(grid, 500, 500);
        window.setScene(scene);
        window.show();
        
    }

    
}


Solution 1:[1]

You need to make sure you've added the ImageView to the Scene, otherwise you're just creating a bunch of short lived objects.

I would create and add an instance of the ImageView as part of the primary initialisation phase and then simply update the image on each button press

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;

import java.util.Random;

public class App extends Application {

    private final Random random = new Random();

    @Override
    public void start(Stage stage) {
        stage.setTitle("Dice Game");

        GridPane grid = new GridPane();
        grid.setPadding(new Insets(15, 15, 15, 15));
        grid.setVgap(5);
        grid.setHgap(5);

        //Into label
        Label intro = new Label("Hit roll to see your role!");
        GridPane.setConstraints(intro, 0, 0);

        //button setup  
        Button roll = new Button("Roll!");
        GridPane.setConstraints(roll, 0, 5);

        Image[] dieFaces = {
                new Image(getClass().getResourceAsStream("/images/Die01.png")),
                new Image(getClass().getResourceAsStream("/images/Die02.png")),
                new Image(getClass().getResourceAsStream("/images/Die03.png")),
                new Image(getClass().getResourceAsStream("/images/Die04.png")),
                new Image(getClass().getResourceAsStream("/images/Die05.png")),
                new Image(getClass().getResourceAsStream("/images/Die06.png"))
        };
        
        ImageView dieImageView = new ImageView();
        grid.getChildren().add(dieImageView);
        GridPane.setConstraints(dieImageView, 7, 2);
        roll.setOnAction(e -> {
            int dieNum = random.nextInt(6);
            dieImageView.setImage(dieFaces[dieNum]);
        });

        grid.getChildren().addAll(intro, roll);
        Scene scene = new Scene(grid, 500, 500);
        stage.setScene(scene);
        stage.show();
    }

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

}

nb: I've embedded my images into my (maven) project, so I'm using getClass().getResourceAsStream(...) to load them, you might need a different workflow

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 jewelsea