基本结构

JavaFX程序基本结构：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.stage.Stage;public class MyJavaFX extends Application {@Override // Override the start method in the Application classpublic void start (Stage primaryStage){// Create a scene and place a butten in the sceneButton btOK = new Button("OK");Scene scene = new Scene(btOK,200,200);primaryStage.setTitle("MyJavaFX");primaryStage.setScene(scene);primaryStage.show();}/*** The main method is only needed for the IDE with limites* JavaFX support. Not needed for running from the command line.** 这个主方法在不完全支持JavaFX的IDE中使用，命令行运行可以不写主方法* 不写main的话，JVM自动调用launch方法来运行程序*/public static void main(String[] args) {Application.launch(args);}
}

运行结果：

代码说明：

         创建的主类需要继承抽象类 javafx.application.Application 来定义编写 JavaFX 程序。主类重写了 javafx.application.Application类中的start方法。当一个JavaFX程序启动的时候，JVM会使用它的默认构造方法来创建类的一个实例，同时调用它的start方法。start方法一般用于将UI组件放入一个场景（Sence），并且在舞台（Stage）中显示该场景。

Button btOK = new Button("OK");
Scene scene = new Scene(btOK,200,200);

创建了一个按钮并把它放到scene场景中。一个Sence对象可以使用构造方法Scene(node,width,height)创建 。这个构造方法指定了场景的宽度和高度并且将节点置于一个场景中。

public void start (Stage primaryStage){ ... }

一个Stage对象是一个窗体。当应用程序启动的时候，一个主舞台对象由JVM自动创建。JavaFX应用剧院的类比来命名Stage和Scene类。可以认为舞台是一个支持场景的平台，节点如同在场景中演出的演员。

    Stage stage = new Stage(); stage.setTitle("Second Stage"); stage.setScene(new Scene(new Button("New Stage"), 100, 100));        stage.show(); // Display the stagestage.setResizable(false); // 固定窗口大小

可以通过创建一个新的Stage实例来创建另外一个窗口。默认情况下，用户可以改变窗口大小，如果不让用户更改的话可以使用stage.setResizable(false)。

 面板、UI组件以及形状

面板、UI组件和形状是Node的子类型

和其他UI框架类似JavaFX也提供了面板（Pane）功能，一般是用来充当容器类，来整体方便布局设计。将各个节点放到一个面板中，然后将面板再置于一个场景中。

• 节点(Node）是可视化组件，比如一个形状、一个图像视图、一个UI组件或者一个面板。
• 形状是指文字、直线、圆、椭圆、矩形、弧、多边形、折线等。
• UI 组件是指标签、按钮、复选框、 单选按钮、文本域、文本输入区域等。

 

请注意，Scene 可以包含 Control 或者 Pane, 但是不能包含 Shape 和 ImageView。Pane 可以包含 Node 的任何子类型。可以使用构造方法 Scene(Parent, width, height)或者 Scene(Parent)创建 Scene。后一个构造方法中场景的尺寸将自动确定。Node 的每个子类都 有一个无参的构造方法，用于创建一个默认的节点。

public void start(Stage primaryStage) {// Create a scene and place a button in the sceneStackPane pane = new StackPane();pane.getChildren().add(new Button("OK"));    Scene scene = new Scene(pane, 200, 50);primaryStage.setTitle("Button in a pane"); // Set the stage titleprimaryStage.setScene(scene); // Place the scene in the stageprimaryStage.show(); // Display the stage}

    程序创建一个 StackPane，然后将一个按钮作为面板的组成部分（child)加入。getChildren()方法返回 javafx.collections.ObservableList 的一个实例。 ObservableList 类似于 ArrayList, 用于存储一个元素集合。调用 add(e)将一个元素加人列表。StackPane 将节点置于面板中央，并且置于其他节点之上。这里只有一个节点在面板中。StackPane会得到一个节点的偏好尺寸。所以我们看到按钮以它的偏好尺寸显示。

 

 public void start(Stage primaryStage) {// Create a circle and set its propertiesCircle circle = new Circle();circle.setCenterX(100);circle.setCenterY(100);circle.setRadius(50);circle.setStroke(Color.BLACK);  // 笔画颜色circle.setFill(Color.BROWN);           // 填充颜色 采用无色// Create a pane to hold the circle Pane pane = new Pane();pane.getChildren().add(circle);// Create a scene and place it in the stageScene scene = new Scene(pane, 200, 200);primaryStage.setTitle("ShowCircle"); // Set the stage titleprimaryStage.setScene(scene); // Place the scene in the stageprimaryStage.show(); // Display the stage}

程序创建了一个 Circle 并将它的圆心设置在（ 100, 100 ) ， 同时这里也是场景的中央，因为创建场景时给出的宽度和高度都是 200。圆的半径设为50。请注意，Java 图形的尺寸单位都使用像素。

笔划颜色（即画圆所采用的颜色）设置为黑色。

填充颜色（即用于填充圆的 颜色）设置为棕色。可以将颜色设置为 null 表明采用无色。

 

程序创建了一个 Pane并将圆置于面板中。请注意，在 Java 的坐标系中，面板左上角的坐标是（0,0)，这不同于传统坐标系中（ 0, 0 ) 位于窗体的中央。在 Java 坐标系中，x坐标从左到右递增， y坐标从上到下 递增。

 

面板置于场景中，然后场景设置于舞台中。圆显示在舞台中央。然而，如果改变窗体的大小，圆不再居中。

当窗体改变大小的时候为了依然显示圆居中，圆心的 x 和y 坐标需要重新设置在面板的中央。可以通过设置属性绑定来达到效果。

属性绑定

可以将一个目标对象绑定到源对象中。源对象的修改将自动反映到目标对象中。

  @Override // Override the start method in the Application classpublic void start(Stage primaryStage) {    // Create a pane to hold the circle Pane pane = new Pane();// Create a circle and set its propertiesCircle circle = new Circle();circle.centerXProperty().bind(pane.widthProperty().divide(2));circle.centerYProperty().bind(pane.heightProperty().divide(2));circle.setRadius(50);circle.setStroke(Color.BLACK); circle.setFill(Color.WHITE);pane.getChildren().add(circle); // Add circle to the pane// Create a scene and place it in the stageScene scene = new Scene(pane, 200, 200);primaryStage.setTitle("ShowCircleCentered"); // Set the stage titleprimaryStage.setScene(scene); // Place the scene in the stageprimaryStage.show(); // Display the stage}

 

如同许多 JavaFX 类中的属 性一样，在属性绑定中，该属性既可以作为目标，也可以作为源。目标监听源中的变化，一旦源中发生变化，目标将自动更新自身。一个目标采用 bind 方法和源进行绑定：

target.bind(source);

如果目标和源同时都是绑定属性和可观察属性，它们就可以使用 bindBidirectional 方法进行双向绑定:

    public static void main(String[] args) {DoubleProperty d1 =new SimpleDoubleProperty(1);DoubleProperty d2 =new SimpleDoubleProperty(2);// 双向绑定d1.bindBidirectional(d2); // 这里设置完属性后，后边就不可以在设置成其他绑定了！System.out.println("d1 is " + d1.getValue() +" and d2 is "+ d2.getValue());d2.setValue(70.2); // 单向绑定，d1的值随d2的值改变而改变，并且不能设置d1的值System.out.println("d1 is " + d1.getValue() +" and d2 is "+ d2.getValue());d1.setValue(5);System.out.println("d1 is " + d1.getValue() +" and d2 is "+ d2.getValue());}

 

节点的通用属性和方法

有很多先介绍两个：style 和 rotate

style属性

样式属性使用前缀 - fx- 进行定义，每个节点拥有它自己的样式属性。设定样式的语法是 styleName:value

circle.setStyle("-fx-stroke:black; -fx-fill:red;");
// 设置了一个圆的两个 JavaFX CSS 属性。该语句等价于下面两个语句：
circle.setStroke(Color.BLACK):
circle.setFill(Color.RED);

如果使用了一个不正确的 JavaFX CSS, 程序依然可以编译和运行，但是样式将被忽略。

rotate属性

rotate属性可以设定一个以度为单位的角度，让节点围绕它的中心旋转该角度。如果设置 的角度是正的，表示旋转是顺时针；否则，逆时针。

//将一个按钮旋转 80°
button.setRotate(80):

 @Override // Override the start method in the Application classpublic void start(Stage primaryStage) {// Create a scene and place a button in the sceneStackPane pane = new StackPane();Button btOK = new Button("OK");btOK.setStyle("-fx-border-color: blue;");pane.getChildren().add(btOK);    pane.setRotate(45);pane.setStyle("-fx-border-color: red; -fx-background-color: lightgray;");Scene scene = new Scene(pane, 200, 250);primaryStage.setTitle("NodeStyleRotateDemo"); // Set the stage titleprimaryStage.setScene(scene); // Place the scene in the stageprimaryStage.show(); // Display the stage}