java fx 基础教程,JavaFx中文入门教程- 概述 | 学步园

概述

总得说来，JavaFx有一下几个特征：

用一种声明式的语法来定制GUI组件，使得代码的结构尽可能和GUI组件的实际布局比较接近。

声明式的数据绑定和即时更新，简单方便的自定义组件。应用程序的数据和界面组件之间即时刷新， 自动同步。

静态类型，最大程度上的和Java的相似性，使得代码结构、代码重用和封装等方面都保持一致，使得我们可以用Java来创建和维护大型项目。

能够用来相当复杂的GUI组建

更加简单方便的使用Swing

接下来部分，我们对JavaFx做一个快速预览，把JavaFx进行一个简单的展示，在接下来的章节里面，进行详细的讲解。

脚本

JavaFx的脚本代码是由一个个声明和表达式组成的，运行一个脚本，就是从头到后顺序执行脚本中的一个个声明和表达式。

例如：overview01.fx

var ten : Integer = 10;

java.lang.System.out.println("Twice {ten} is {2 * ten}.");

输出为：

Twice 10 is 20.

类

JavaFx中的类定义和Java保持了很大程度的一致，不过，还是有一些差异需要注意。例如：数据是作为属性，而不是字段，行为通过函数来实现，而不是方法。下面的代码定义了一个矩形：

class Rectangle {

attribute width: Integer;

attribute height: Integer;

function grow(): Void {

grow(1);

}

function grow(amount: Integer): Void {

width += amount;

height += amount;

}

}

另外，最大的一个不同之处，JavaFx支持多继承。

对象

对象初始化，给我们提供了一个简单的方式来创建并初始化一个对象。比如我们初始化一个Rectangle，并把他的width和height初始化为100.

Rectangle {

width: 100

height: 100

}

如果需要保存一个引用，用var，来创建变量(引用)。

var myRect = Rectangle {

width: 100

height: 100

}

数组

数组里存放了一系列有序的对象，大体上跟Java中的数组是一样的(虽然从行为上讲比较接近于ArrayList)。用来存放多个值，并且，通过下标来访问数组元素，下标从0开始。

var week = ["Monday","Tuesday","Wednesday","Thursday",

"Friday","Saturday","Sunday"];

var mon = week[0];

var wed = week[2];

var fri = week[4];

JavaFx对数组片段的支持，是十分方便的。

var week = ["Monday","Tuesday","Wednesday","Thursday",

"Friday","Saturday","Sunday"];

var weekdays = week[0..4]; // first slice

var weekend = week[5..6]; // second slice

数据绑定

数据绑定提供了一个简单的方式，来同步多个对象之间的状态。当两个对象绑定在一起之后，当第一个对象发生变化时，第二个对象的值会自动即时更新。数据绑定常用在界面组件和后台数据对象之间的同步。

import javafx.application.Frame;

import javafx.application.Stage;

import javafx.scene.text.Text;

var myString = "Hello World!";

Frame {

width: 50

height: 50

visible: true

stage: Stage {

content: Text {

content: bind myString

}

}

}

// 在脚本的其他地方修改了MyString的值，这个时候，界面Text组件

// 会自动刷新为新的值

触发器

触发器是指一个代码块，当某个条件一旦成立就会被运行。比如，当某个属性的值被赋值为不太合适的值的时候，我们可以进行一个提示信息。看一下触发器的使用方法：overview02.fx

import java.lang.System;

ReplaceDemo {

mySensitiveData: "Will anyone notice?"

}

class ReplaceDemo {

attribute mySensitiveData: String

on replace {

System.out.println("I noticed a change!");

};

}

编译运行，看一下输出：

#javafxc overview02.fx -d .

#javafx example.overview02

I noticed a change!