使用eclipse和JavaFX Scene Builder进行快速构建JavaFX应用程序

http://blog.csdn.net/wingfourever/article/details/7726724

使用eclipse和JavaFX Scene Builder进行快速构建JavaFX应用程序

2012-07-08 18:25 18641人阅读 评论(11) 收藏 举报

 分类：

JavaFX（52） 

版权声明：本文为博主原创文章，未经博主允许不得转载。

了解过JavaFX的都知道，JavaFX自从2.0版本开始，已经完全抛弃了之前的script语言，才用纯java来实现。这样的好处就是1.让使用Java的IDE进行JavaFX的开发成为可能，2.Java与JavaFX的API相互调用更容易 3.JavaFX的程序部署也更简单.

e(fx)clipse就是一个eclipse上用来开发JavaFX的插件。不仅如此，在官网上还可以下载包含e(fx)clipse插件的完整版eclipse。

官方网站为:http://www.efxclipse.org/。

就我个人感觉，在eclipse上开发比使用netbeans要舒适的多。

另外，Oracle推出了JavaFX Scene Builder，用来进行JavaFX的可视化开发。

首先我们从官方网站下载JavaFX Scene Builder。

打开程序，可以看到以下画面：

如图所示，左上方是JavaFX控件列表，左下方是UI层结构，中间是可视化设计区域，右边是控件属性。

那么，我们就构建一个简单的记事本程序吧！

首先使用JavaFX Scene Builder 创建以下界面。

这就是一个简单的记事本的界面了。上面是一个MenuBar，中间是一个TextArea用来显示打开的文本内容。在

TextArea上添加了一个ContextMenu，也就是所谓的右键菜单。

这里要注意一点:fx:id是一个很重要的属性，在事件逻辑层要获取JavaFX Scene Builder编辑的XML中的控件，需要通过fx:id来获取。

另外，还要在右边属性的events中指定事件的方法。

如下图所示，Menu中的Open事件对应onMenuOpen方法。

这样，一个简易记事本的界面就创建好了。我们在JavaFX Scene Builder中将它保存为study.xml。

接着，我们在e(fx)clipse中，新建一个JavaFX Project。记住要在preference里设定JavaFX SDK的位置(类似Android开发)。

创建一个类MyApp 继承于javafx.application.Application。

1. import javafx.application.Application;
2. import javafx.fxml.FXMLLoader;
3. import javafx.scene.Parent;
4. import javafx.scene.Scene;
5. import javafx.stage.Stage;
6. import javafx.stage.StageStyle;
7. public class MyApp extends Application {
8. public static void main(String[] args) {
9. Application.launch(MyApp.class, args);
10. }
11. @Override
12. public void start(Stage stage) throws Exception {
13. Parent root = FXMLLoader.load(getClass().getResource("study.fxml"));
14. Scene scene = new Scene(root, 600, 400);
15. stage.initStyle(StageStyle.DECORATED);
16. stage.setScene(scene);
17. stage.setTitle("JavaFX记事本");
18. stage.show();
19. }
20. }

如上图所示，我们使用JavaFX中提供的FXMLLoader来加载我们编辑好的JavaFX界面。study.fxml应该放在与MyApp类相同的目录，通过getClass().getResource()获取该类目录的资源。

上面的MyApp类中也出现了几个JavaFX中的类，Parent, Scene, Stage。那么这几个类到底有什么用呢？

Stage是JavaFX最顶层的容器，最原始的Stage(也就是start方法后的参数)是根据系统平台进行创建的(也是跨平台的重点)。当然，你也可以在程序其他地方创建Stage。

Scene是包括控件等所有内容的容器，应用程序必须指定Scene的根节点。既可以像上面代码中初始化时传入根节点，也可以通过setRoot方法来设定根节点。

Parent是所有包含子节点的节点的基类。它是一个继承于Node的抽象类。因此Loader里其实是用到了向上转型。

由上面的解释，可以很容易的知道JavaFX中是用到的树形结构。

另外，JavaFX使用很常见的反射机制将UI层和事件层完全分离了。查看上面的study.xml，你就可以看到根节点有一个fx:controller属性。这个属性就是指定事件处理的类。比如我们现在应用程序中处理事件的类为Test.java。那么就修改fx:controller = "org.wing.javafx.project01.Test" 前面的是包名。

那么，下面来写我们的事件处理类吧。

1. import java.io.File;
2. import javax.swing.JOptionPane;
3. import javafx.event.ActionEvent;
4. import javafx.fxml.FXML;
5. import javafx.scene.Scene;
6. import javafx.scene.control.TextArea;
7. import javafx.scene.layout.AnchorPane;
8. import javafx.stage.FileChooser;
9. public class Test {
10. @FXML
11. private AnchorPane layoutPane;
12. @FXML
13. private TextArea  fileContent;
14. private File result;
15. @FXML
16. private void onMenuOpen(ActionEvent event) {
17. FileChooser fileChooser = new FileChooser();
18. result = fileChooser.showOpenDialog(layoutPane.getScene().getWindow());
19. if (result != null) {
20. fileContent.setText(FileTools.readFile(result));
21. }
22. }
23. @FXML
24. private void onMenuSave(ActionEvent event) {
25. if(result != null){
26. FileTools.writeFile(result, fileContent.getText());
27. }
28. }
29. @FXML
30. private void onMenuClose(ActionEvent event) {
31. System.exit(0);
32. }
33. @FXML
34. private void onMenuDelete(ActionEvent event) {
35. fileContent.replaceSelection("");
36. }
37. @FXML
38. private void onMenuAbout(ActionEvent event) {
39. JOptionPane.showMessageDialog(null, "JavaFX记事本是一款使用JavaFX开发的记事本。" ,"关于",  JOptionPane.PLAIN_MESSAGE);
40. }
41. @FXML
42. private void onContextSelectAll(ActionEvent event) {
43. fileContent.selectAll();
44. }
45. }

看上面的代码，你会发现与JavaFX映射的变量和方法都有@FXML标注。而变量的名称需要对应study.xml中控件的fx:id属性。事件处理的方法同样也是对应xml中定义的事件名称。

在MenuOpen事件中打开一个文件选择器，然后获取选择的文件，读取文本文件的内容，最后设置到TextArea中。至于FileTools，则是临时下的文本文件读取的类。

在MenuSave事件中，将TextArea中的内容保存到刚打开的文件中。

上面还调用了Swing中的JOptionPane的显示Message的方法。由此可见，在如今的JavaFX中可以很轻易的使用Java Api。

另外，下面的是FileTools的代码，很简单的文本文件读写。

1. import java.io.BufferedReader;
2. import java.io.BufferedWriter;
3. import java.io.File;
4. import java.io.FileReader;
5. import java.io.FileWriter;
6. public class FileTools {
7. public static String readFile(File file) {
8. StringBuilder resultStr = new StringBuilder();
9. try {
10. BufferedReader bReader = new BufferedReader(new FileReader(file));
11. String line = bReader.readLine();
12. while (line != null) {
13. resultStr.append(line);
14. line = bReader.readLine();
15. }
16. bReader.close();
17. } catch (Exception e) {
18. e.printStackTrace();
19. }
20. return resultStr.toString();
21. }
22. public static void writeFile(File file, String str) {
23. try {
24. BufferedWriter bWriter = new BufferedWriter(new FileWriter(file));
25. bWriter.write(str);
26. bWriter.close();
27. } catch (Exception e) {
28. e.printStackTrace();
29. }
30. }
31. }

最后来运行我们的JavaFX程序吧。

是不是很简单？

由于JavaFX Scene Builder这个JavaFX可视化工具的发布，e(fx)clipse这样基于eclipse的插件的出现，可以令Java程序员快速的进行JavaFX的开发，而且现在将事件层和UI层进行了很好分离，代码整体的结构也更加的清晰了。

就让我们期待一下JavaFX的成长吧。

转载请注明:http://blog.csdn.net/ml3947