JavaFx以编程方式设置外部背景图片 [英] JavaFx set external background image programmatically
问题描述
我无法动态设置锚定窗格的背景图片。
为了开发目的，我把外部资源放在项目的dist文件夹中，所以文件是可用的。
I have problems setting a background image of an anchor pane dynamically. For developing purpose i put the external resources in the dist folder of the project, so the files are availiable.
AnchorPane的代码：
Code for the AnchorPane:
AnchorPane root = new AnchorPane();
// this works fine, styles inside the css are used in components on the root pane
root.getStylesheets().add("file:/D:/ProjectFolder/global.css");
我不知道的是如何设置背景图像的路径。
通过CSS和JavaFX引用读取相对于css文件应该给出的路径。
What i can't figure out is how to set the path for a background image. Reading through the CSS and JavaFX references the path should be given relative to the css file. I also tried to creare URLs and URIs and absolute paths.
// path of compiled jar
"D:/ProjectFolder/project.jar"
// path of css file
"D:/ProjectFolder/global.css"
// path of background file
"D:/ProjectFolder/Resources/Wallpapers/worldmap.jpg"
所有这些都不起作用：
root.setStyle("-fx-background-image: url('Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
root.setStyle("-fx-background-image: url('/Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
root.setStyle("-fx-background-image: url('./Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
root.setStyle("-fx-background-image: url('@Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
root.setStyle("-fx-background-image: url('@/Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
root.setStyle("-fx-background-image: url('@./Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
root.setStyle("-fx-background-image: url('D:/ProjectFolder/Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
root.setStyle("-fx-background-image: url('file:/D:/ProjectFolder/Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
（在一个sidenote文件存在，我检查文件夹和文件的名称case，也正确）
(on a sidenote the files exist, i checked the names of folders and files for case, this is correct too)
用于测试目的：
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class BackGroundTest extends Application {
private int backgroundtest = 0;
private AnchorPane root;
@Override
public void start(Stage primaryStage) {
Button btn = new Button();
btn.setText("Test Background");
btn.setOnAction(new EventHandler<ActionEvent>() {
@Override
public void handle(ActionEvent event) {
switch (backgroundtest) {
case 0: {
root.setStyle("-fx-background-image: url('Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
break;
}
case 1: {
root.setStyle("-fx-background-image: url('/Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
break;
}
case 2: {
root.setStyle("-fx-background-image: url('./Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
break;
}
case 3: {
root.setStyle("-fx-background-image: url('@Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
break;
}
case 4: {
root.setStyle("-fx-background-image: url('@/Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
break;
}
case 5: {
root.setStyle("-fx-background-image: url('@./Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
break;
}
case 6: {
root.setStyle("-fx-background-image: url('D:/ProjectFolder/Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
break;
}
case 7: {
root.setStyle("-fx-background-image: url('file:/D:/ProjectFolder/Resources/Wallpapers/worldmap.jpg'); -fx-background-repeat: stretch; -fx-background-size: stretch; -fx-background-position: center center;");
break;
}
}
backgroundtest++;
if (backgroundtest == 8) {backgroundtest = 0;}
}
});
root = new AnchorPane();
root.getStylesheets().add("file:/D:/ProjectFolder/global.css");
StackPane stack = new StackPane();
root.getChildren().add(stack);
AnchorPane.setBottomAnchor(stack, 0d);
AnchorPane.setLeftAnchor(stack, 0d);
AnchorPane.setRightAnchor(stack, 0d);
AnchorPane.setTopAnchor(stack, 0d);
stack.getChildren().add(btn);
Scene scene = new Scene(root, 800, 600);
primaryStage.setTitle("Test Background");
primaryStage.setScene(scene);
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);
}
}
css档案：
.button {
-fx-background-color:
rgb(0, 50, 0, 0.08),
rgb(0, 0, 0, 0.8),
#090a0c,
linear-gradient(#4a5661 0%, #1f2429 20%, #1f242a 80%),
linear-gradient(#242a2e, #23282e),
radial-gradient(center 50% 0%, radius 100%, rgba(135,142,148,0.9), rgba(255,255,255,0));
-fx-background-radius: 7, 6, 5, 4, 3, 5;
-fx-background-insets: -3 -3 -4 -3, -3, 0, 1, 2, 0;
-fx-font-family: "Arial";
-fx-font-size: 14;
-fx-text-fill: white;
-fx-padding: 5 10 5 10;
-fx-effect: dropshadow( one-pass-box , rgb(0, 255, 0, 0.6), 10, 0.5 , 0 , 1 );
}
这一切都很好，如果我包括css和图像到jar文件，但我想使用外部文件。
It all works well if i include the css and the image into the jar file, but i want to use external files. Setting the path relative to the css file like all the references say does not seem to work, so what would be the correct path ?
推荐答案
String filename = "worldmap.jpg";
HostServices services = this.getHostServices();
String url = services.resolveURI(services.getCodeBase(), "Resources/Wallpapers/" + filename);
结果字符串与我的情况相同7 tho，我不知道为什么它不工作
The resulting string is the same as in my case 7 tho, i dont know why it did not work before and now does.
我第一次在SceneController的构造函数中设置背景，现在我设置了一个额外的方法，在场景添加后调用
I set the background in the constructor of the SceneController the first time, now i set it in an extra method that gets called after the scene is added to the stage, maybe that has something to do it, but i cant figure out where the mistake realy lies.
对于任何有类似问题的人来说，这是一个答案，它是最好使用HostServices来解析如上例所示的路径。
As for an answer to anyone haveing similar problems, it is best to use the HostServices to resolve paths like in the example above.
这篇关于JavaFx以编程方式设置外部背景图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
