今天使用javafx新的gui和netbeans下的javafx插件做了一个页面，感觉挺好用

新的 JavaFX 1.0 SDK 预览版本月底就要发布了，当前1.0编译器项目已经相对稳定，改动不大了。 <br>  昨天netbeans下基于1.0的FX的开发插件也已经重新发布，使用此插件开发FX程序就比较方便了。新的插件提供了新的gui包，可以使用新的gui包。 <br> 今天使用该插件开发了一个页面，代码贴在最下面。 开发后感觉： <br> 1、新的编译器和API功能已经相当完善和稳定，使用了不少功能，均能正确运行。<br>  2、语法简洁。虽然开发工具的代码援助功能还不强，但只要对着API帮助文档并熟悉API的继承关系（看上一篇blog），很容易就写出来了。<br>  3、开发工具的脚本编译验证功能完善，如果有脚本错误马上就提示出来了，比写javascript脚本好多了。 <br> 4、代码折叠功能也运行正确，通过折叠，复杂的结构可以简化，理解方便。<br>  5、最令人激动的bind功能真的非常简单而功能强大，使用以前的开发语言自己实现会相当的复杂。 <br> 总之，现在我已经开始考虑在后续项目中如何应用它了，我想javafx对于java来说，是java十几年发展史上最重大的变化，并且是朝着简单的方向变化的，所以非常值得期待和参与，它的影响会是深远的。 <br> 最重要的，插件下载地址：     http://deadlock.netbeans.org/hudson/job/JavaFX_NB_daily/lastSuccessfulBuild/artifact/main/nbbuild/nbms/compress/ 附代码：

/*

* Edit.fx

*

* Created on 2008-6-11, 11:31:16

*/



package com.hhxx;



/**

* @author hhba1118.zhao

*/



// place your code here

import javafx.gui.*;



Frame {

    title: "编辑窗口"

    width: 800

    height: 500

    closeAction: function() { 

        java.lang.System.exit( 0 ); }

    visible: true

    menus: [  ]

    content: BorderPanel {

        top: FlowPanel{

                alignment: HorizontalAlignment.LEFT

                content: [ 

                    Button {

                        text: "新建(选图片)"

                        action: function() {  }

                    },

                    Button {

                        text: "选择修改"

                        action: function() {  }

                    },

                    Button {

                        text: "录制"

                        action: function() {  }

                    },

                    Button {

                        text: "结束录制"

                        action: function() {  }

                    },

                    Button {

                        text: "播放"

                        action: function() {  }

                    },

                    Label{

                        text: "状态: 未开始"

                    }

                ]

            } //BorderPanel.top: FlowPanel结束

        left: BorderPanel{

                top: GridPanel{

                columns: 1

                rows: 0

                hgap: 5  /*不起作用*/

                vgap: 5

                var colorGroup = ToggleGroup{};

                var lineGroup = ToggleGroup{};

                content: [

                    Label{

                        text: "颜色"

                        horizontalAlignment: HorizontalAlignment.CENTER

                        verticalAlignment: VerticalAlignment.BOTTOM

                    },

                    ToggleButton {

                        //text: "红色"

                        toggleGroup: colorGroup

                        icon: Icon{

                                image: Image{

                                        url: "{__DIR__}resources/red.PNG"

                                    }

                              }

                    },

                    ToggleButton {

                        //text: "绿色"

                        toggleGroup: colorGroup

                        icon: Icon{

                                image: Image{

                                        url: "{__DIR__}resources/green.PNG"

                                    }

                              }

                    },

                    ToggleButton {

                        //text: "蓝色"

                        toggleGroup: colorGroup

                        icon: Icon{

                                image: Image{

                                        url: "{__DIR__}resources/blue.PNG"

                                    }

                              }

                    },

                    ToggleButton {

                        //text: "黄色"

                        toggleGroup: colorGroup

                        icon: Icon{

                                image: Image{

                                        url: "{__DIR__}resources/yellow.PNG"

                                    }

                              }

                    },

                    ToggleButton {

                        //text: "黑色"

                        toggleGroup: colorGroup

                        icon: Icon{

                                image: Image{

                                        url: "{__DIR__}resources/black.PNG"

                                    }

                              }

                    },

                    Label{

                        text: "粗细"

                        horizontalAlignment: HorizontalAlignment.CENTER

                        verticalAlignment: VerticalAlignment.BOTTOM

                    },

                    ToggleButton {

                        //text: "细线"

                        toggleGroup: lineGroup

                        icon: Icon{

                                image: Image{

                                        url: "{__DIR__}resources/one.PNG"

                                    }

                              }

                    },

                    ToggleButton {

                        //text: "中线"

                        toggleGroup: lineGroup

                        icon: Icon{

                                image: Image{

                                        url: "{__DIR__}resources/two.PNG"

                                    }

                              }

                    },

                    ToggleButton {

                        //text: "粗线"

                        toggleGroup: lineGroup

                        icon: Icon{

                                image: Image{

                                        url: "{__DIR__}resources/three.PNG"

                                    }

                              }

                    }

                ]

            }  /* BorderPanel.left: BorderPanel 的 top: GridPanel 结束  */

        } /* BorderPanel.left: BorderPanel结束  */

        var paintCanvas: Canvas;

        center: paintCanvas = Canvas{

            content: ImageView{

                var im: Image;

                image: im = Image{

                      url: "{__DIR__}resources/usecase.jpg"

                }

                scaleX: bind (paintCanvas.width as Number) / im.width

                scaleY: bind (paintCanvas.height as Number) / im.height

            }

        }

    } /* Frame.content: BorderPanel结束 */

}