How to load images from css file in JavaFX 8

Question

I have this css file that loads images in a JavaFX 8 application:

#pill-left { -fx-padding: 5; -fx-border-image-source: url("/com/dx57dc/images/left-btn.png"); -fx-border-image-slice: 4 4 4 4 fill; -fx-border-image-width: 4 4 4 4; -fx-border-image-insets: 0; -fx-border-image-repeat: stretch; -fx-background-color: null !important; } #pill-left:selected { -fx-border-image-source: url("/com/dx57dc/images/left-btn-selected.png"); } #pill-left .label { -fx-text-fill: #d3d3d3; -fx-effect: dropshadow( one-pass-box , rgba(0,0,0,0.75) , 0, 0.0 , 0 , -1 ); } #pill-left:selected .label { /* -fx-text-fill: black; */ -fx-text-fill: white; -fx-effect: dropshadow( one-pass-box , white , 0, 0.0 , 0 , 1 ); } #pill-center { -fx-padding: 5; -fx-border-image-source: url("/com/dx57dc/images/center-btn.png"); -fx-border-image-slice: 4 4 4 4 fill; -fx-border-image-width: 4 4 4 4; -fx-border-image-insets: 0; -fx-border-image-repeat: stretch; -fx-background-color: null !important; } #pill-center:selected { -fx-border-image-source: url("/com/dx57dc/images/center-btn-selected.png"); } #pill-center .label { -fx-text-fill: #d3d3d3; -fx-effect: dropshadow( one-pass-box , rgba(0,0,0,0.75) , 0, 0.0 , 0 , -1 ); } #pill-center:selected .label { -fx-text-fill: black; -fx-effect: dropshadow( one-pass-box , white , 0, 0.0 , 0 , 1 ); } #pill-right { -fx-padding: 5; -fx-border-image-source: url("/com/dx57dc/images/right-btn.png"); -fx-border-image-slice: 4 4 4 4 fill; -fx-border-image-width: 4 4 4 4; -fx-border-image-insets: 0; -fx-border-image-repeat: stretch; -fx-background-color: null !important; } #pill-right:selected { -fx-border-image-source: url("/com/dx57dc/images/right-btn-selected.png"); } #pill-right .label { -fx-text-fill: #d3d3d3; -fx-effect: dropshadow( one-pass-box , rgba(0,0,0,0.75) , 0, 0.0 , 0 , -1 ); } #pill-right:selected .label { -fx-text-fill: black; -fx-effect: dropshadow( one-pass-box , white , 0, 0.0 , 0 , 1 ); } 

Images are located in the Java package com.dx57dc.images

In Java 7_25, this code works as expected, but in JavaFX 8 b99 I get this error:

 ava.lang.NullPointerException at com.sun.javafx.sg.prism.NGRegion.renderContent(NGRegion.java:1129) at com.sun.javafx.sg.prism.NGNode.doRender(NGNode.java:1598) at com.sun.javafx.sg.prism.NGNode.render(NGNode.java:1520) at com.sun.javafx.sg.prism.NGGroup.renderChildren(NGGroup.java:233) at com.sun.javafx.sg.prism.NGGroup.renderContent(NGGroup.java:199) at com.sun.javafx.sg.prism.NGRegion.renderContent(NGRegion.java:1249) at com.sun.javafx.sg.prism.NGNode.doRender(NGNode.java:1598) at com.sun.javafx.sg.prism.NGNode.render(NGNode.java:1520) at com.sun.javafx.sg.prism.NGGroup.renderChildren(NGGroup.java:233) at com.sun.javafx.sg.prism.NGGroup.renderContent(NGGroup.java:199) at com.sun.javafx.sg.prism.NGRegion.renderContent(NGRegion.java:1249) at com.sun.javafx.sg.prism.NGNode.doRender(NGNode.java:1598) at com.sun.javafx.sg.prism.NGNode.render(NGNode.java:1520) at com.sun.javafx.tk.quantum.ViewPainter.doPaint(ViewPainter.java:99) at com.sun.javafx.tk.quantum.AbstractPainter.paintImpl(AbstractPainter.java:210) at com.sun.javafx.tk.quantum.PresentingPainter.run(PresentingPainter.java:95) at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:471) at java.util.concurrent.FutureTask.runAndReset(FutureTask.java:304) at com.sun.javafx.tk.RenderJob.run(RenderJob.java:58) at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1145) at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:615) at com.sun.javafx.tk.quantum.QuantumRenderer$PipelineRunnable.run(QuantumRenderer.java:129) at java.lang.Thread.run(Thread.java:724) D3D Vram Pool: 13,331,480 used (5.0%), 13,331,480 managed (5.0%), 268,435,456 total 20 total resources being managed 4 permanent resources (20.0%) 1 resources locked (5.0%) 7 resources contain interesting data (35.0%) 0 resources disappeared (0.0%) D3D Vram Pool: 13,331,480 used (5.0%), 13,331,480 managed (5.0%), 268,435,456 total 20 total resources being managed 4 permanent resources (20.0%) 1 resources locked (5.0%) 7 resources contain interesting data (35.0%) 0 resources disappeared (0.0%) D3D Vram Pool: 13,331,480 used (5.0%), 13,331,480 managed (5.0%), 268,435,456 total 20 total resources being managed 4 permanent resources (20.0%) 1 resources locked (5.0%) 7 resources contain interesting data (35.0%) 0 resources disappeared (0.0%) 

What is the correct way to load images from css in Java 8?

Answer 1

I have a structure like this:

 view |--css | |- style.css | |--img |- image.png 

And use the image as follows:

  -fx-background-image: url("../img/image.png"); 

So if

/ com / dx57dc / image /

already refers to your css file, try the previous point ["./com/dx57dc/images/"], and then go back to your shared parent folder with (several) "../"

Klaus