ImageView won't display the Image when it comes from project space - javafx-8

Question

So, I am new to JavaFX and as part of a project I am attempting to use ImageView to display some images. Before adding to my actual project, I set up the following to be sure I understood how to use ImageViews.
My Controller:
import javafx.fxml.FXML;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.stage.Stage;
public class TestController {
#FXML
ImageView imageView;
Image image;
public void start(Stage stage){
/*
* THIS WORKS!
*
* image = new Image("file:/C://Users//Owner//Pictures//MyProjectPhotos/picture.jpg");
*/
//BUT THIS DOESN'T :(
image = new Image("file:/JavaFXPractice/photos/picture.jpg");
imageView.setImage(image);
imageView.setOnMouseClicked(me -> System.out.println("hello"));
}
}
The fxml:
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.VBox?>
<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity"
minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0"
xmlns="http://javafx.com/javafx/8.0.65" xmlns:fx="http://javafx.com/fxml/1"
fx:controller="application.TestController">
<children>
<VBox layoutX="156.0" layoutY="88.0" prefHeight="272.0" prefWidth="378.0">
<children>
<ImageView fx:id="imageView" fitHeight="276.0" fitWidth="378.0"
pickOnBounds="true" preserveRatio="true" />
</children>
</VBox>
</children>
</AnchorPane>
And finally this:
import java.io.IOException;
import javafx.application.Application;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.AnchorPane;
import javafx.stage.Stage;
public class Main extends Application {
#Override
public void start(Stage primaryStage) throws Exception {
FXMLLoader loader = new FXMLLoader();
loader.setLocation(getClass().getResource("/view/TestPage.fxml"));
AnchorPane root = (AnchorPane) loader.load();
Scene scene = new Scene(root);
primaryStage.setScene(scene);
primaryStage.setResizable(false);
primaryStage.show();
TestController control = loader.getController();
control.start(primaryStage);
}
public static void main(String[] args) {
launch(args);
}
}
My problem is in the TestController class. As you can see in the multi-line comment (and also the comment/line of code below it), the image displays properly when I get it from my local machine, but not when I get it from my project space. I have tried for hours now to figure this out, but every single time I try to retrieve any photo from my project space, nothing appears on the ImageView. It is not null (neither is the Image), and there are no reported errors. I have also tried searching for an answer, but no luck so far.

Answer 1

You can load your images like this:
image = new Image(getClass().getResource("/photos/picture.jpg").toExternalForm());
under the assumption, that "photos" is a folder at the root of your project. This folder must be on the classpath. Depending on your IDE this can be achieved in different ways. In Eclipse this can be achieved by putting this folder into a "source folder". A typical structure is
project
src
...
res
photos
picture.jpg
where both "src" and "res" are source folders.