JavaFX display scene background image

问题

I’m developing a JavaFX application on Eclipse Kepler using the built-in FX library from Java SDK1.7.0_45. I want to display a background image in a scene. Following the tutorial provided in the Java documentation, following code should work:

public class Main extends Application {
    public static void main(String[] args) {
    Application.launch(args);
    }

    @Override
    public void start(Stage primaryStage) {
    GridPane grid = new GridPane();
    Scene scene = new Scene(grid, 300, 275);
    primaryStage.setScene(scene);
    scene.getStylesheets().add(Main.class.getResource("Login.css").toExternalForm());
    primaryStage.show();
    }

}

My CSV file looks like this:

.root {
 -fx-background-image: url("background.jpg");

}

But I just get a blank screen instead. I have 3 files in the src/application folder: background.jpg, Main.java and Login.css.

I have tried adding a backslash, putting the image into a separate folder, providing an absolute path, providing several types of images, using ../application/background.jpg, changing the code to file:background.jpg, providing the URL directly into the code and dismissing the CSS file, using an imageview instead, ..... but nothing works.

I've taken a look at several other stackoverflow links, all seemed to fail:

JavaFX How to set scene background image (renders a blank screen)
Setting background image by javafx code (not css) exception)
Cannot load image in JavaFX
and many more.

The strange thing is, when I supply an image from a server as a hyperlink, everything works fine. Supplying the path to a local file never works though. What am I doing wrong? Can somebody show me how to display a local image? Is this a bug?

回答1:

This worked fine for me with a .png, the only noticeable difference I had as opposed to you, was that I split up the .css file, and my background.png into a sub-package of the main one. Example:

my directory structure looks as follows:

sotestproject ----|
                  |
                  |---package sotestProject ---SOTestProject.java
                                    |
                                    |
                                    |
                                    |
                               package sotestProject.style
                                           |
                                           |---Login.css
                                           |
                                           |---background.png

using this breakdown, the following files with code successfully produced a background with an image:

SoTestProject.java:

package sotestproject;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;

/**
 *
 * @author William
 */
public class SOTestProject extends Application {

    @Override
    public void start(Stage primaryStage) {
            GridPane grid = new GridPane();
            Scene scene = new Scene(grid, 300, 275);
            primaryStage.setScene(scene);
            scene.getStylesheets().add(SOTestProject.class.getResource("style/Login.css").toExternalForm());
            primaryStage.show();
    }

    /**
     * The main() method is ignored in correctly deployed JavaFX application.
     * main() serves only as fallback in case the application can not be
     * launched through deployment artifacts, e.g., in IDEs with limited FX
     * support. NetBeans ignores main().
     *
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

}

.root {
    -fx-background-image: url("background.png");
}

And then obviously my background.png is in the same directory as the .css file. The main 'change' in code is to note that with the scene.getStyleSheet() I used a reference to style/ instead of just the resource.

I hope this helps!

One thing to note: I'm compiling against the 32-bit jdk 7.0_45. That shouldn't make any difference, but there it is.

回答2:

Partly thanks to the answer from WillBD, I decided to ditch Eclipse Kepler and start all over in Netbeans. I used the exact same code I provided in my question and now everything works just fine. I guess this is a bug between JavaFX and Eclipse Kepler.

回答3:

Image file must be in the 'bin/application' directory and add your css definitions to the 'src/application/filename.css'

回答4:

I've had the same problem in NetBeans and tried basically everything. Eventually, I discovered that the file extension "jpg" was written in capital letters in this "project hierarchy box" on the left side of NetBeans.

I changed that part of my code to all capital letters and tadaaa everything worked just fine.

来源：https://stackoverflow.com/questions/20710847/javafx-display-scene-background-image

标签

image

background

javafx

local

eclipse-kepler