How to load Image file to ImageView?

Question

I am attempting to display an image file as soon as it is selected from a file chooser. The file chooser is restricted to .png and .jpg files with the selected files being stored in a variable of type File. To do this I have set up an ImageView, and I wish to set the image with this new file only problem is it is of type File not Image.

How can this be achieved? Code so far...

    public void fileSelection(){

        FileChooser fileChooser = new FileChooser();
        fileChooser.setTitle("Select Profile Picture");
        fileChooser.getExtensionFilters().addAll(new FileChooser.ExtensionFilter("Image Files", "*.png", "*jpg"));
        File selectedFile = fileChooser.showOpenDialog(null);
        File selectedFileInput = selectedFile;

        if(selectedFile != null) {
            selectedFileOutput.setText("File selected: " + selectedFile.getName());
            previewPicture.setImage();
        } else {
            selectedFileOutput.setText("Please select a profile picture...");
        }
    }

Bypath

Answer 1

You can simply create an image with

Image image = new Image(selectedFile.toURI().toString());

and then place it in the ImageView:

previewPicture.setImage(image);

Other constructors offer more control over resources required for loading the image. If you want to force the image to be a certain size, you can resize it on loading, which will save memory if the user chooses a large image but you only want to display a scaled-down version. Additionally, loading a large image may take time, so you should not load it on the UI thread. The Image constructors taking string versions of URLs have options to automatically load the image in a background thread. The following forces the width and height to be both no more than 240 pixels (while maintaining the original aspect ratio), and loads the image in the background (thus not blocking the UI):

Image image = new Image(selectedFile.toURI().toString(),
    240, // requested width
    240, // requested height
    true, // preserve ratio
    true, // smooth rescaling
    true // load in background
);

See the documentation for other available constructors.

Counterpart

Answer 2

You create image and set to the ImageView as follows

  Image image = new Image(new FileInputStream(selectedFile));
  previewPicture.setImage(image);

Modifier

Answer 3

I adding a late answer to demonstrate different image-file loading alternatives:

import java.io.File;
import java.net.URL;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.Pane;
import javafx.scene.layout.TilePane;
import javafx.stage.Stage;

public class ImagesFromFile extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception{
        primaryStage.setTitle("Load Images From File");
        primaryStage.setScene(new Scene(new ImagePanel().getPane()));
        primaryStage.show();
    }

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

/**
<pre>
Folders structure:

   -Project
    | - src
    |   | - package
    |   |       | - ImagePanel.java
    |   |       | - red_dot.png
    |   |
    |   | - resources
    |           | - blue_dot.png
    |
    | - black_dot.png
 </pre>
*/

class ImagePanel{

    private Pane pane;

    ImagePanel() {

        try{

            //not embedded resource. doesn't work when packaged in jar
            File file = new File("black_dot.png");
            Image imageFromProjectFolder = new Image(file.toURI().toString());//or new Image(new FileInputStream("black_dot.png"));
            ImageView view1 = new ImageView(imageFromProjectFolder);

            URL url = getClass().getResource("red_dot.png");
            Image imageFromSourceFolder =  new Image(url.openStream());
            ImageView view2 = new ImageView(imageFromSourceFolder); //or new ImageView("/package/red_dot.png");

            url = getClass().getResource("/resources/blue_dot.png");
            Image imageFromReourceFolder = new Image(url.openStream());
            ImageView view3 = new ImageView(imageFromReourceFolder); //or new ImageView("/resources/blue_dot.png");

            pane = new TilePane(view1, view2, view3);

        } catch (Exception ex) {ex.printStackTrace();}
    }

    Pane getPane(){
        return pane;
    }
} 

Transform

Answer 4

for Java AndroidStudio 2024

ImageView img = findViewById(R.id.img_screenshot);
File f = new File(fullfilename);
if (f.exists())
    img.setImageURI(Uri.fromFile(f));
else
    img.setImageResource(R.drawable.filenotfound);

Sobriety