JavaFX高级教程：JavaFX2.0的FXML语言（中文版)
4星 · 超过85%的资源 需积分: 50 29 浏览量
2013-01-28
16:16:15
上传
评论 1
收藏 57KB DOCX 举报 
（翻译） JavaFX
高级教程： JavaFX2.0
的
FXML
语言
博客分类：
血泪体验
javafx FXML
原文地址 http://download.oracle.com/javafx/2.0/fxml_get_started/jfxpub-fxml_get_started.htm
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
- 1
- 2
前往页