如何在JavaFX项目中使用CSS文件？

Question

我正在尝试构建一个JavaFX Application ，我想在FXML file附加CSS file但是当我尝试运行应用程序时，我遇到了一个问题： Property "stylesheets" does not exist or is read-only. 在控制台我不知道究竟是什么问题（请注意，如果我删除CSS文件一切正常）。 CSS文件“csstyle.css”包含：

/*
 * Empty Stylesheet file.
 */

 .mainFxmlClass {
  -fx-background-color: blue;
  }

并且我在写的Stylesheet在FXML file的名称CSS file也是在Style Class ： .mainFxmlClass 。 所以我想知道错误，请帮助我，谢谢:)

Answer 1

你有两个问题：

第一个已经在这里解决了 。 去掉

stylesheets="@csstyle.css"

并在根容器的<children>标记之后添加它。 由于您没有显示您的FXML文件如何，这应该是这样的：

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.*?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import java.net.*?>

<AnchorPane styleClass="mainFxmlClass" ...>
   <children>
         ...
   </children>
   <stylesheets>
      <URL value="@cssstyle.css" />
   </stylesheets>
</AnchorPane>  

第二个就是这个：

styleClass=".mainFxmlClass"

删除点：

styleClass="mainFxmlClass"

编辑

鉴于这些解决方案不起作用以及OP正在使用JDK 7和JavaFX 2.0，这些其他解决方案可能有所帮助：

更换：

styleClass="mainFxmlClass"

有：

<styleClass>
    <String fx:value="mainFxmlClass"/>
</styleClass> 

所以你的FXML会是这样的：

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.*?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import java.net.*?>

<AnchorPane ...>
   <children>
         ...
   </children>
   <styleClass>
       <String fx:value="mainFxmlClass"/>
   </styleClass> 
   <stylesheets>
      <URL value="@cssstyle.css" />
   </stylesheets>
</AnchorPane> 

再试一次。

最后，如果它不起作用，请删除<stylesheets>标记，并在Scene上设置样式表文件：

Scene scene = new Scene(root);
scene.getStylesheets().add(getClass().getResource("cssstyle.css").toExternalForm());

所以你的FXML会是这样的：

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.*?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>

<AnchorPane ...>
   <children>
         ...
   </children>
   <styleClass>
       <String fx:value="mainFxmlClass"/>
   </styleClass>
</AnchorPane> 

建议将JavaFX更新到更新的版本（2.2.45是Java 7的最后一个版本），并从增加的许多新功能中受益。