最近Java社區最火的就是JavaFX Script的發布了並且Sun同時公布了JavaFX Script的開源網站openJfxJavaFX Script是Sun的RIA解決方案是一種用於編寫能夠在支持Java的PC和手機上運行的應用軟件的更簡單的腳本語言其編寫的程序可以直接在Java虛擬機上運行（Java 以上）從其運行的環境方式看這是Adobe Apollo的勁敵其運行的效果大家可以查看官方的演示程序（注意需要Jre ）效果很驚人的哦下面是其中一個演示的效果圖
從語法來看JavaFX Script是個Java和VRML的混合體既有Java的優點（面向對象繼承等等）又有VRML的優點（圖形描述）在IDE支持方面目前以及推出NetBeans和Eclipse的插件雖然功能還不是很強大但相信等JavaFX Script正式發布的時候IDE方面的支持會持續加強的比如可視模式的UI編輯語法提示等
OpenJfx官方有一個基於NetBeans的JavaFX Script 起步考慮到Flex開發中eclipse(FlexBuilder)的使用情況今天我們將基於Eclipe來一起開始我們的JavaFX Script發現之旅文中除了將原文的使用NetBeans更改為Eclipse其他均翻譯自官方文檔
要完成我們今天的旅途您首先需要安裝Eclipse 以及安裝FlexBuilder也可以另外如果您的Jre版本低於請升級
首先我們來安裝JavaFX Script For Eclipse插件官方的安裝說明在這裡安裝步驟如下
啟動Eclipse/FlexBuilder
從主菜單選擇 Help > Software Updates > Find and Install
在Install/Update對話框中 選擇Search for New Features to Install然後點擊Next
點擊New Remote Site
在New Update Site對話框中在Name中輸入JavaFX
在URL中輸入
點擊OK
在Install窗口中點擊Finish
在Updates對話框中選擇JavaFX > JavaFX node > 然後點擊Next
接受協議並點擊Next
點擊Next和Finish
在Verification對話框中選擇Install All
安裝完成後重啟EclipseJavaFX Script Eclipse 插件就安裝完成了
新建JavaFX工程
以上准備好了JavaFX Script的Eclipse開發環境現在我們來實際開始JavaFX Script之旅
我們需要創建一個Java工程來存放我們的JavaFX Script文件
從Eclipse的主菜單選擇New > Project
在選擇工程向導窗口中選擇Java Project
點擊Next
輸入Project Name為JavaFXapp
不需要添加JavaFX Script Lib運行JavaFX Script程序時Eclipse會自動添加並設置環境的點擊Finish完成
現在JavaFXapp工程就創建好了如下圖
創建我們第一個JavaFX程序
現在開始用Eclipse創建我們第一個JavaFX HelloWorld 程序
右擊JavaFXapp > New > Other
在New窗口中選擇JavaFX > JavaFX File
點擊Next在File name輸入HelloWorldfx
點擊FinishHelloWorldfx就被添加到JavaFXapp工程中並且在右邊自動被打開了
將下面代碼粘貼到HelloWorldfx中 import javafxui*;
Frame {
title: Hello World JavaFX
width:
height:
content: Label {
text: Hello World
}
visible: true
}
運行我們的第一個JavaFX程序
現在讓我們用Eclipse運行我們的第一個JavaFX程序
在Eclipse主菜單選擇Run > Run
在Run窗口中雙擊JavaFX Application
然後在Name輸入HelloWorld
點擊Arguments在Program arguments中輸入我們的JavaFX程序名稱HelloWorld這裡的名稱與Java類名一致如果我們的HelloWorld存放在prac目錄下那們就輸入pracHelloWorld
點擊Run自動編譯運行將出現下面運行窗口
恭喜我們現在完成了第一個JavaFX程序
語法解釋
正如您在前面章節看到的JavaFX語言提供了一種用於表述用戶界面組件結構和內容的聲明式的語法(Declarative Syntax)為了幫助您理解發生了什麼我們使用類似於Swing的純程序的形式（類似AS）重寫以上代碼
var win = new Frame();
wintitle = Hello World JavaFX;
winwidth = ;
var label = new Label();
labeltext = Hello World;
ntent = label;
winvisible = true;
以上源代碼同樣是正確的JavaFX程序並且和前面的運行效果相同
以下同時說明了以上聲明式和程序式方式的代碼實際發生了什麼
調用Frame類構造器創建一個新的Frame
對Frame的titlewidthvisible和content屬性進行賦值
在content屬性的賦值過程中調用Label類構造器創建了一個新的Label並且給它的text屬性賦了一個值
但是即使像這裡這麼極端簡單的示例中描述性語法編寫的程序的意識還是更加容易理解
因為聲明式編程(declarative programming)可以從單個表達式創建程序如前面第一個例子表達式的根一般為一個生成程序的對象圖形的對象分配表達式（構造器）
添加動態行為（dynamic behavior）
上面的Hello World程序沒有動態行為在JavaFX中創建一個帶動態行為的圖形用戶接口即創建一個屬性依賴其他對象屬性值的圖形用戶接口組件（和Flex中的綁定的概念一致）這些其他對象可以是任何您覺得合適的代表您的應用狀態的對象因為該GUI組件的屬性依賴於另一個對象它會自動反應任何時候您對另一個對象的修改相應的GUI組件是視圖（View）而另一個對象就是模型（Model)下面是Hello World程序的Model/View版本
import javafxui*;
class HelloWorldModel {
attribute saying: String;
}
var model = HelloWorldModel {
saying: Hello World
};
var win = Frame {
title: Hello World JavaFX
width:
height:
content: Label {
text: bind modelsaying
}
visible: true
};
運行程序顯示如下
如果model對象的saying改成下面這樣
modelsaying = Goodbye Cruel World!;
運行結果將變為下圖所示
注意該示例通過JavaFX的bind操作將label的text屬性初始化為mode的saying屬性在這裡bind操作聲明增量更新這意味著任何時候modelsaying改變label的text屬性都將更新為相同的值
對於輸入構件如按鈕復選框和文本輸入域模式屬性和GUI組件之間的連接可以是雙向的
考慮以下示例
import javafxui*;
class HelloWorldModel {
attribute saying: String;
}
var model = HelloWorldModel {
saying: Hello World
};
var win = Frame {
title: bind {modelsaying} JavaFX
width:
height:
content: TextField {
value: bind modelsaying
}
visible: true
};
運行該程序顯示如下
如果您在文本輸入域中輸入其他內容然後敲回車窗口的標題將相應的改變
在這一情況下文本域的值的更新是用戶輸入的結果（通過TextField類的實現）當model的saying屬性更新到與文本域相同值發生時因為該表達式指定窗口的title屬性依賴於model的saying屬性表達式被重新計算並且窗口的title屬性更新到上面的結果但是這樣的內容表達依然是聲明
From:http://tw.wingwit.com/Article/program/Java/ky/201311/28345.html
