JavaFX 2和CSS类

Question

我正在使用JavaFX 2.0进行练习,绘制一个带有2个线系列的XYChart并在CSS文件中设置颜色,笔触等.

点击此链接

http://docs.oracle.com/javafx/2.0/charts/css-styles.htm

它说:

所有JavaFX图表都具有可通过.chart,.chart-content,.chart-title和.chart-legend CSS类设置的公共属性.

我的问题是:我在哪里可以找到所有这些CSS类的列表？我找不到任何地方.

JavaFX CSS参考链接

http://docs.oracle.com/javafx/2.0/api/javafx/scene/doc-files/cssref.html

列出所有属性,但不列出CSS类

谢谢

Answer 1

1. 本教程http://docs.oracle.com/javafx/2.0/css_tutorial/jfxpub-css_tutorial.htm建议查看caspian.css具有所有组件的默认样式的文件.你可以从sdk获得它:

   jar -xf jfxrt.jar com/sun/javafx/scene/control/skin/caspian/caspian.css
   

2. 正如您已经提到的另一个有用的来源是ccs-refjavadoc中的文档:http://docs.oracle.com/javafx/2/api/javafx/scene/doc-files/cssref.html

Answer 2

默认样式可以在caspian css中找到(链接用于JavaFX 2.2,链接用于Java 8).

您可以使用ScenicView工具以交互方式查看样式类.

您可以递归地打印图表中的节点,以便在运行时查找它们的类型以及应用于它们的css类.在将场景附加到显示的阶段之后应该打印节点,以使css布局有机会在节点上执行并将正确的样式类应用于它们.通常,我还通过css类查找节点,以在代码中动态地设置或操作它们.

以下是您可以为图表调整的示例.

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.scene.*;
import javafx.scene.chart.*;
import javafx.stage.Stage;

public class SimpleChart extends Application {
  public static void main(String[] args) { launch(args); }
  @Override public void start(Stage stage) {
    final AreaChart chart = new AreaChart(
      new NumberAxis(), new NumberAxis(),
      FXCollections.observableArrayList(
         new XYChart.Series("April", FXCollections.observableArrayList(
           new XYChart.Data(0, 4), new XYChart.Data(1, 10), new XYChart.Data(2, 18)
         )),
         new XYChart.Series("May", FXCollections.observableArrayList(
           new XYChart.Data(0, 20), new XYChart.Data(1, 15), new XYChart.Data(2, 12)
         ))
      )      
    );
    chart.setTitle("Temperature Monitoring (in Degrees C)");
    stage.setScene(new Scene(chart, 800, 600));
    stage.show();

    printNodes(chart, 0);
  }

  public void printNodes(Node node, int depth) {
    for (int i = 0; i < depth; i++) System.out.print(" ");
    System.out.println(node);
    if (node instanceof Parent) 
      for (Node child : ((Parent) node).getChildrenUnmodifiable()) 
        printNodes(child, depth + 1);
  }
}

输出是:

AreaChart@fb17e5[styleClass=root chart]
 Label[id=null, styleClass=label chart-title]
  LabelSkin[id=null, styleClass=label chart-title]
   LabeledText@f0548c[styleClass=text]
 Chart$1@f617ce[styleClass=chart-content]
  Region@41d471[styleClass=chart-plot-background]
  XYChart$1@1e26fe1
   Path@ccec5f[styleClass=chart-alternative-column-fill]
   Path@1b289cd[styleClass=chart-alternative-row-fill]
   Path@751a9b[styleClass=chart-vertical-grid-lines]
   Path@25e068[styleClass=chart-horizontal-grid-lines]
   Line@afceff[styleClass=chart-vertical-zero-line]
   Line@3ed81c[styleClass=chart-horizontal-zero-line]
   Group@1de52ea[styleClass=plot-content]
    Group@b66999
     Path@255d[styleClass=chart-series-area-fill series0 default-color0]
     Path@1952ad4[styleClass=chart-series-area-line series0 default-color0]
    StackPane@1cedaf2[styleClass=chart-area-symbol series0 data0 default-color0]
    StackPane@1887d29[styleClass=chart-area-symbol series0 data1 default-color0]
    StackPane@1d13cab[styleClass=chart-area-symbol series0 data2 default-color0]
    Group@15426ec
     Path@1e606a9[styleClass=chart-series-area-fill series1 default-color1]
     Path@bf7baa[styleClass=chart-series-area-line series1 default-color1]
    StackPane@1c758d7[styleClass=chart-area-symbol series1 data0 default-color1]
    StackPane@99a1b5[styleClass=chart-area-symbol series1 data1 default-color1]
    StackPane@4788f3[styleClass=chart-area-symbol series1 data2 default-color1]
  NumberAxis@11f25f3[styleClass=axis]
   Label[id=null, styleClass=label axis-label]
    LabelSkin[id=null, styleClass=label axis-label]
     LabeledText@bb303[styleClass=text]
   Path@ab12f1[styleClass=axis-tick-mark]
   Path@acaa28[styleClass=axis-minor-tick-mark]
   Text@1c2a074[styleClass=text tick-mark]
   Text@8ebcab[styleClass=text tick-mark]
   Text@d600e3[styleClass=text tick-mark]
   Text@10eb552[styleClass=text tick-mark]
   Text@14b5854[styleClass=text tick-mark]
   Text@a51ac9[styleClass=text tick-mark]
   Text@804b08[styleClass=text tick-mark]
   Text@d7a8bb[styleClass=text tick-mark]
   Text@1776b55[styleClass=text tick-mark]
   Text@ee1793[styleClass=text tick-mark]
   Text@102b5a9[styleClass=text tick-mark]
  NumberAxis@1f4899c[styleClass=axis]
   Label[id=null, styleClass=label axis-label]
    LabelSkin[id=null, styleClass=label axis-label]
     LabeledText@12d40de[styleClass=text]
   Path@11d3cb1[styleClass=axis-tick-mark]
   Path@7bc9a9[styleClass=axis-minor-tick-mark]
   Text@25b987[styleClass=text tick-mark]
   Text@c4720[styleClass=text tick-mark]
   Text@2f958[styleClass=text tick-mark]
   Text@1a51ac0[styleClass=text tick-mark]
   Text@26e232[styleClass=text tick-mark]
   Text@8b5b5[styleClass=text tick-mark]
   Text@1843ea1[styleClass=text tick-mark]
   Text@c8d74b[styleClass=text tick-mark]
   Text@12cc880[styleClass=text tick-mark]
   Text@1439c50[styleClass=text tick-mark]
   Text@10c4148[styleClass=text tick-mark]
 Legend@2a46d1[styleClass=chart-legend]
  Label[id=null, styleClass=label chart-legend-item]
   LabelSkin[id=null, styleClass=label chart-legend-item]
    Region@1990ca[styleClass=chart-legend-item-symbol chart-area-symbol series0 area-legend-symbol default-color0]
    LabeledText@70f11d[styleClass=text]
  Label[id=null, styleClass=label chart-legend-item]
   LabelSkin[id=null, styleClass=label chart-legend-item]
    Region@1ec15c7[styleClass=chart-legend-item-symbol chart-area-symbol series1 area-legend-symbol default-color1]
    LabeledText@89c1ee[styleClass=text]