无法加载css

Question

我正在测试这个代码：

LayoutSample.java

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.layout.FlowPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;

public class LayoutSample extends Application
{

    public static void main(String[] args)
    {
        launch(LayoutSample.class, args);
    }

    @Override
    public void start(Stage stage)
    {

        FlowPane flow = new FlowPane();
        flow.setPadding(new Insets(5, 5, 5, 5));
        flow.setVgap(5);
        flow.setHgap(5);
        flow.setPrefWrapLength(170); // preferred width allows for two columns
        flow.setStyle("-fx-background-color: white;");

        //ImageView pages[] = new ImageView[8];
        for (int i = 0; i < 28; i++)
        {
//            pages[i] = new ImageView(
//                    new Image(LayoutSample.class.getResourceAsStream(
//                    "graphics/chart_" + (i + 1) + ".png")));
            flow.getChildren().add(generateRectangle());
        }

        Scene scene = new Scene(flow);
        /////
        String cssURL = "ButtonsDemo.css";
        String css = this.getClass().getResource(cssURL).toExternalForm();
        scene.getStylesheets().add(css);
        ////
        stage.setScene(scene);
        stage.setTitle("Layout Sample");
        stage.show();
    }

    public Rectangle generateRectangle()
    {

        Rectangle rect2 = new Rectangle(10, 10, 10, 10);
        rect2.setId("app");
        rect2.setArcHeight(8);
        rect2.setArcWidth(8);
        rect2.setFill(Color.AZURE);
        //rect2.setX(10);
        //rect2.setY(160);
        rect2.setStrokeWidth(1);
        rect2.setStroke(Color.BLACK);
        rect2.setWidth(220);
        rect2.setHeight(180);

        return rect2;
    }
}

ButtonsDemo.css

#app {
    -fx-background-color:
    linear-gradient(to bottom, #f2f2f2, #d4d4d4);
}

但是css代码不会呈现在矩形上。你能告诉我这是java代码正确吗？我怀疑我没有设置矩形Id。

Answer 1

CSS是正确加载的，但是您的样式角色被忽略了，因为它不适用于要应用它的Node类型。

要使用-fx-background-color，节点必须从地域派生。

矩形不是区域。

有关适用于这两种类型的属性的定义，请参见CSS区域参考资料和矩形。

另外，如果您使用-fx-fill来设置矩形的梯度填充，我猜这是您实际上想要做的，那么您也不应该在源代码中设置填充。