JavaFX：如何从节点或场景获取.root CSS属性值

嘿，这个问题我之前做JavaFX+WebView混合开发时也踩过坑！确实搜索JavaFX CSS相关内容时很容易搜到不相关的，特别是自定义属性这块。

要解决从Scene里获取你定义的-color-1和-color-2这两个属性值，其实核心是找到这些属性绑定的节点——也就是Scene的根节点（因为你在.root选择器里定义的样式，对应的就是Scene的根节点），然后通过JavaFX的API取出属性值。

具体步骤和代码示例： #

1. 获取Scene的根节点
   首先你需要拿到当前Scene的根节点，它就是.root选择器对应的对象：

   Parent rootNode = yourScene.getRoot();
   

2. 取出自定义CSS属性的值
   JavaFX的节点提供了getStyleableProperty()方法，可以直接通过属性名称（注意要带上-前缀，和你CSS里写的一致）获取对应的属性值：

   // 获取-color-1的原始值
   String color1 = rootNode.getStyleableProperty("-color-1").getValue().toString();
   // 获取-color-2的值（这里会自动计算derive后的最终颜色，不需要你自己处理派生逻辑）
   String color2 = rootNode.getStyleableProperty("-color-2").getValue().toString();
   

   如果你担心属性可能不存在（比如CSS没加载成功），可以加个安全判断：

   Optional<StyleableProperty<?>> color1Prop = rootNode.getCssMetaData().stream()
       .filter(metaData -> metaData.getProperty().equals("-color-1"))
       .map(CssMetaData::getStyleableProperty)
       .findFirst();
   
   if (color1Prop.isPresent()) {
       String colorValue = color1Prop.get().getValue().toString();
       // 后续处理逻辑
   }
   

3. 将颜色值应用到WebView的HTML内容
   拿到颜色值后，你可以直接把它拼接到HTML的样式里，或者通过WebEngine注入到页面中：

   WebView webView = new WebView();
   WebEngine engine = webView.getEngine();
   
   // 拼接HTML内容，把JavaFX的颜色值代入
   String htmlContent = String.format("""
       <html>
           <head>
               <style>
                   body {
                       color: %s; /* 使用FX里的-color-1 */
                       font-family: sans-serif;
                   }
                   .highlight {
                       color: %s; /* 使用FX里的-color-2 */
                       font-weight: bold;
                   }
               </style>
           </head>
           <body>
               这是使用JavaFX字体颜色的普通文本，
               <span class="highlight">这是使用强调色的文本</span>。
           </body>
       </html>
   """, color1, color2);
   
   engine.loadContent(htmlContent);
   

重要注意事项： #

• 确保CSS已经生效：一定要在Scene显示（stage.show()）之后再去获取属性值，否则CSS可能还没加载解析，拿到的是默认值或者null。
• 关于derive函数：JavaFX会自动计算derive(-color-1, 50%)的最终颜色值，你直接获取-color-2就能拿到派生后的具体颜色代码，不需要自己去计算。

内容的提问来源于stack exchange，提问作者halirutan