[JavaFX2.0的FXML语言.docVIP

FXML是JavaFX 2.0新引入的。你可能会问What is FXML? 和Is FXML for me? FXML 是基于XML的一种声明性标记语言，用来定义应用的用户接口。FXML对于定义静态的布局很便利，诸如form, control, 和table。使用FXML也可以动态构造布局，不过要结合脚本。 ?FXML是一个优势是基于XML，所以多数开发者，尤其是web开发者和其他RIA平台的开发者会很熟悉它。另一个优势是FXML不是编译型语言，不需要编译后才能看出变化。第三个好处是可以很简单的看到应用场景的结构。反过来，也就很简单地可以在组内进行合作开发用户接口。 要对比JavaFX和FXML,看图Figure 1???.构成该应用的场景包括一个边框布局，在它的顶部和中间各有一个标签。 ? Figure 1 Border Pane Simple Example Description of Figure 1 Border Pane Simple Example??? ? Example 1???是相应的JavaFX代码. Example 1 JavaFX Scene Graph BorderPane border = new BorderPane(); Label toppanetext = new Label(Page Title); border.setTop(toppanetext); Label centerpanetext = new Label (Some data here); border.setCenter(centerpanetext); Example 2???是相应的FXML. Example 2 FXML Scene Graph BorderPane top Label text=Page Title/ /top center Label text=Some data here/ /center /BorderPane 展示FXML优势的最好方法是例子。本指南讲解如何创建Figure 2???中的登陆界面 . Figure 2 Login User Interface Description of Figure 2 Login User Interface??? 开始之前先熟悉一下Figure 3???中的用户接口. 该接口使用了一个包含两部分的边框布局。顶区域包括一个堆栈布局，里面是用文本Label Example覆盖一副图片。???中部区域是一个网格布局，有标签、文本框、密码框和按钮。 ? Figure 3 Layout of Login User Interface Description of Figure 3 Layout of Login User Interface??? ? 要创建该界面，我们需完成以下任务: Prepare for This Tutorial Set Up the Project Set Up the Application Basics Create the Properties File Create the FXML File Define a Border Pane Layout Stack Text Over an Image Add a Grid Layout and Controls Add a Button Event Use a Scripting Language Use a Style Sheet 准备 本指南使用NetBeans IDE.请确保NetBeans IDE的版本支持JavaFX 2.0。 要完成本文，应熟悉用JavaFX编用户接口。尤其要知道场景的知识，因为FXML的语法结构和JavaFX的场景很像。 建立工程 第一步是建立JavaFX工程。 从File菜单选择???New Project???. 在??JavaFX???application category中，选择JavaFX FXML Application，点???Next???. 输入名称 FXMLExample点击??Finish???. NetBeans IDE打开了工程。有三个文件：FXMLExample.java, Sample.fxml, and Sample.java. 下载浅蓝色渐变的??fx_boxback.jpg???图片到桌面，用来当背景。然后把它拖到fxmlexample文件夹下。 建立基础 每个 FXML 应用必须包含一些JavaFX代码，最少也有创建舞台和场景还有启动的代码。 打开FXMLExample.java???,删除NetBeans IDE生成的代码，用下面的代码代