Javafx，css，为分屏设置背景图片？

Question

我正在尝试将图片设置为拆分窗格的背景。所以目标是，无论我如何通过拖动它们之间的分隔线来调整两个锚定窗格的大小，我都希望背景图片保持不变。

我尝试了几件事，但都没有成功。我试图在 Scene Builder 中将 css 添加到拆分窗格：

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

这行不通...对于简单的图像视图，它也行不通，因为它使自己成为一个 3. 分割区域，我不能将它放在两个分割区域下面。

直到现在我都找不到解决这个问题的技术...你有什么想法吗？谢谢！

Answer 1

.root指的是Scene的根。在外部 CSS 文件中尝试以下操作：

.split-pane {
 -fx-background-image: url("DSCF0806.JPG");
 }

例如：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.SplitPane;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class SplitPaneWithBackground extends Application {

    @Override
    public void start(Stage primaryStage) {
        SplitPane splitPane = new SplitPane();
        splitPane.getItems().addAll(new StackPane(new Label("Left")), 
                new StackPane(new Label("Right")));


        BorderPane root = new BorderPane(splitPane);
        Scene scene = new Scene(root, 600, 400);
        scene.getStylesheets().add("split-pane-background.css");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

文件拆分窗格-background.css:

.split-pane {
    /*
    The image used below is copyright of Fedaro (Fernando da Rosa) y Santiago Roland
    (http://commons.wikimedia.org/wiki/User:Fedaro) and is used under the terms of the
    Creative Commons Attribution-Share Alike Unported 3.0 license. 
    (http://creativecommons.org/licenses/by-sa/3.0/deed.en).
    */
    -fx-background-image: url("http://upload.wikimedia.org/wikipedia/commons/a/a7/Nebulosa_de_Eta_Carinae_o_NGC_3372.jpg");
    -fx-background-size: cover ;
}
.label {
    -fx-background-color: rgba(255, 255, 255, 0.5) ;
    -fx-padding: 10 ;
}

Javafx，css，为分屏设置背景图片？

Javafx, css, setting a background image for a splitpane?

css

background

javafx