JWorld@TW the best professional Java site in Taiwan
      註冊 | 登入 | 全文檢索 | 排行榜  

» JWorld@TW » JavaFX 討論區  

按列印兼容模式列印這個話題 列印話題    把這個話題寄給朋友 寄給朋友   
reply to topicthreaded modego to previous topicgo to next topic
己加入精華區
by koji at 2011-06-09 01:07
本主題所含的標籤
作者 JavaFX 2.0 介紹 [精華]
UndeadJ

UX & UI Design



發文: 384
積分: 3
於 2011-06-09 00:27 user profilesend a private message to usersend email to UndeadJreply to postreply to postsearch all posts byselect and copy to clipboard. 
ie only, sorry for netscape users:-)add this post to my favorite list
JavaFX 2.0 Beta 出來到現在已經有1~2星期了,但好像還是很少人在注意

我就先簡單介紹一下JavaFX 2.0,以下的內容大多參考 JavaFX Architecture and Framework,此外本人英文能力有限,若有不良的地方請見諒 Smile



Overview
首先,JavaFX 2.0是個library(jfx.jar),不像先前一樣,只是單獨的Script語法。在JavaFX 2.0中,已經沒有JavaFX Script了。
所以用起來會更簡單,程式碼也比較乾淨 (這部分每人看法不同)。此外,還可以在JVM上使用其它語言來寫JavaFX 2.0,像是Scale, JRuby, Jython..等等。

Scene Graph & API
在圖中最上層裡面的Scene Graph是建構JavaFX應用程式的起點。
它裡面是一個階層式的樹狀節點,而這些節點就是用來描述應用程式中的視覺元素(元件)
在一個Scene Graph 中的單一元素,稱為Node。每個Node有一個ID, Style Class和Bounding Volumn,也會有一個父節點,以及0到n個子節點。

它也可以有這幾種項目:
* 效果:反射、陰影
* 透明值
* 轉換(轉變)
* 事件操作
* 應用程式的特定狀態

Scene Graph不像Swing與AWT一樣,Scene Graph 有它自己本身的Graphics,像是矩形、文字。
此外,Scene Graph也簡化了UI工作而且可以快速的完成各種動畫。

在javafx.scene API中, 可以建立多種類型的內容,像是:
節點(Nodes): 2維及3維的圖形、影像(images)、多媒體(media)、嵌入式網頁瀏覽器(embedded web browser)、文字(text)、UI控制項(UI controls)、圖表(charts)、群組(groups)、容器(containers)
狀態(State): 轉換(Transforms)、視覺效果(visual effects)、其它視覺狀態的內容
動畫(Animation): 各種隨時間改變的scene graph物件屬性值(properties)
效果(Effects): 簡單改變scene graph中節點的外觀,像是模糊(blur)、陰影(shodow)、色彩調整(color adjustment)

JavaFX 2.0包含了一系列公開的API,這些API提供了很強大的靈活度來建RIA。它的特色包含以下:
* 能使用泛型(Generics)、註釋(annotations)、多執行緒(multithreading)
* 對網頁開發人員來說,更容易開發
* 能讓Java開發者,利用其它語言(如:Groovy)來建立大型或複雜的JavaFX應用程式
* 能使用類似JavaFX Script中的Binding機制。包含了高性能的lazy Binding、binding expressions, bound sequence expressions, and partial bind reevaluation
* 延申了Java Collections的能力,其中包含了具有觀察能力的lists與maps。

這表示JavaFX 2.0中的應用程式,在資料模組(Data Model)與使用者介面(user interfaces)中間的溝通會更加的直接。UI會觀察這些儲存在資料模組(Data Model)中的資料變化, 來更新相對應的UI控制項。

Reference
twitter
JavaFX Architecture and Framework
JavaFX 2.0 Beta: First impressions
JavaFX 2.0 beta
JavaFX 2.0 With Alternative Languages - Groovy, Clojure, Scala, Fantom, and Visage
JavaFX vs Java Swing vs AWT
JavaFX 2.0 - Javaによるリッチクライアント基盤 (前編)
JavaFX 2.0 - Javaによるリッチクライアント基盤 (後編)
JavaFX 2.0 - JavaOne 2010


UndeadJ edited on 2011-06-09 09:11
reply to postreply to post
我們是懷抱各自的夢想,買了車票的乘客,不過就像列車一定會有終點,人生有時會碰到必須換車的時候...

我們站在名為「今天」的車站,在名為「昨天」的列車下車,轉搭為「明天」的列車

不過,若沒及時搭上的話....
作者 Re:JavaFX 2.0 介紹 [Re:UndeadJ]
UndeadJ

UX & UI Design



發文: 384
積分: 3
於 2011-06-09 00:54 user profilesend a private message to usersend email to UndeadJreply to postreply to postsearch all posts byselect and copy to clipboard. 
ie only, sorry for netscape users:-)add this post to my favorite list
Graphics System
眾所皆知,近幾年來,使用者對於UI的表現越來越要求。不論是2D或3D的表現、動畫、效果等等,都需要高效能的渲染機制。
在傳統的Swing中,是利用一個執行緒在處理事件及渲染,而這樣做的方式會容易因為人為的因素,產生延遲的現象。
在JavaFX 2.0中,提供了2個圖形加速管道(accelerated pipelines)來解決這個問題 ,也比JavaFX 1.3中的圖形性能要來得更高 Smile

圖中藍色部分是JavaFX 2.0中的Graphics System。它支援2維、3維的圖形埸景。它也提供軟體渲染、硬體渲染。當電腦中的顯示卡(繪圖卡)不足以支援硬體加速渲染時,才會採用軟體渲染。

JavaFX 2.0中有2種圖形加速管道(accelerated pipelines):

Prism:是最為重要的。 它主要是處理JavaFX埸景中的光柵(rasterization)與渲染(rendering)工作,包含了軟體渲染與硬體渲染,也包括3D方面的渲染。另外會依據環境的不同,採用不同的渲染方式:

* 在 Windows XP 及 Windows Vista 上是採用 DirectX 9
* 在 Windows 7 上是採用 DirectX 11
* 在 Mac、Linux 及 Embedded 上是採用 OpenGL
* 當無法使用硬體加速渲染時,則會採用Java2D。一般來說預設會採用完整的硬體加速渲染,可是在無法使用時,就會採用Java2D渲染。因為在現行所有的Java執行環境(Java Runtime Environments)都已經內含Java2D渲染。
* 目前支援的顯示卡有:
AMD: Mobility Radeon HD 3400系列、Mobility Radeon HD 4000系列、Mobility Radeon HD 5000系列、Radeon HD 2400系列、Radeon HD 4000系列、Radeon HD 5000系列、 Radeon HD 6000系列
Intel: GMA X4500系列、GMA X4500HD系列、GMA 3150系列、GMA X3100系列、 GMA X3500系列
NVIDIA:GeForce 8M系列、GeForce 8系列、NVS 3100M、GeForce 200M系列、 GeForce 200系列、Quadro FX 260M、Quadro FX 370

Quantum Toolkit: 主要聯繫 Prism 與 Glass Windowing Toolkit。另外也負責管理事件操作與渲染機制中的執行緒。


UndeadJ edited on 2011-06-09 01:10
reply to postreply to post
我們是懷抱各自的夢想,買了車票的乘客,不過就像列車一定會有終點,人生有時會碰到必須換車的時候...

我們站在名為「今天」的車站,在名為「昨天」的列車下車,轉搭為「明天」的列車

不過,若沒及時搭上的話....
作者 Re:JavaFX 2.0 介紹 [Re:UndeadJ]
UndeadJ

UX & UI Design



發文: 384
積分: 3
於 2011-06-09 00:56 user profilesend a private message to usersend email to UndeadJreply to postreply to postsearch all posts byselect and copy to clipboard. 
ie only, sorry for netscape users:-)add this post to my favorite list
Glass Windowing Toolkit & Thread
在圖中間的Glass Windowing Toolkit負責管理事件佇列(evnet eueue)。
它不是用自己所擁有的事件佇列來管理,而是用本機作業系統上的事件佇列功能來管理、排程執行緒的使用。也不像AWT執行在Java層級的執行緒與AWT執行緒上,Glass Windowing Toolkit 和 JavaFX執行在同一個執行緒上。使用這樣的方式(單一JavaFX應用程式執行緒),可以改善以前多執行緒下所產生的種種問題。

JavaFX程式在執行時,會有2個以上執行緒被執行:

JavaFX application thread:這是主要的執行緒。只要是在圖形埸景中的任何UI元素,都必須透過這個執行緒。此外,埸景(scene)可以在背景執行緒中建造。這表示,我們可以在背景執行緒中建立複雜的埸景來同時保持動畫的流暢度。在JavaFX 2.0應用程式執行緒與Swing與AWT中的事件分派執行緒(Event Dispatch Thread, EDT)是不同的,所以當嵌入JavaFX 2.0程式到Swing中時,須特別小心。

Prism render thread:這個執行緒是負責操作從各個事件分派中來的渲染繪制,另外也可能有多個rasterization threads來幫助那些在渲染中所必須卸載(關閉)的工作

Media thread:這個執行緒是個在背景中執行的,而且會使用圖形埸景中的JavaFX應用程式執行緒(JavaFX application thread)來同步更新,以取得最新的畫面 。

Pulse
pulse是個事件。在JavaFX 2.0圖形埸景中,會利用pulse來同步更新圖形埸景中的元素狀態。每當JavaFX圖形埸景中的動畫被執行時,pulse就會被觸發。而它的最大幀度(frames)為60fps(frames per second,每秒60張畫面)。即使動畫不運作了,只要當圖形埸景中的某件事情被改變,還是會有一個pulse。例如:在圖形埸景中的按鈕位置被改變,就會有一個pulse。

此外,Layout與CSS也依賴pulse事件:在圖形埸景中的許多變化,可能會導致佈局或CSS的更新,這樣一來將會嚴重影響效能。在JavaFX 2.0中的系統,會透過一個pulse來自動更新CSS或佈局,來避免掉效能的問題。而Glass Windowing Toolkit就是負責這些Pulse事件的執行。


reply to postreply to post
我們是懷抱各自的夢想,買了車票的乘客,不過就像列車一定會有終點,人生有時會碰到必須換車的時候...

我們站在名為「今天」的車站,在名為「昨天」的列車下車,轉搭為「明天」的列車

不過,若沒及時搭上的話....
作者 Re:JavaFX 2.0 介紹 [Re:UndeadJ]
UndeadJ

UX & UI Design



發文: 384
積分: 3
於 2011-06-09 00:56 user profilesend a private message to usersend email to UndeadJreply to postreply to postsearch all posts byselect and copy to clipboard. 
ie only, sorry for netscape users:-)add this post to my favorite list
Media & Embedded Browser
Java在多媒體的處理上一直不是很好,其一是需透過JMF(Java Media FrameWork),其二是JMF己經很久沒更新了,另外還有效能等問題。所以,為了改進這個問題, JavaFX 2.0重新設計了多媒體引擎元件,以提高穩定性並且增加效能。

JavaFX 2.0中的多媒體功能,都是在javafx.scene.media 中,支援MP3, AIFF, WAV 音效與FlV視訊檔案格式。主要分為三個部分:

* Media Objecj:代表一個多媒體檔案(MP3, WAV, FLV..ect)
* MediaPlayer:負責播放多媒體檔案
* MediaView:用來顯示、播放

JavaFX 2.0也提供了嵌入式網頁瀏覽器(embedded web browser)來呈現網頁內容並且可以透過它本身的API來執行完整的瀏覽器功能。
這個網頁引擎元件是基於WebKit,它是個開放式網頁引擎,支援HTML5, CSS, JavaScript, DOM, SVG。

透過這個引擎其,可以在應用程式中做下面這些事:
* 呈現本地端、遠端網頁內容
* 支援歷史記錄、上一頁與下一頁的導航機制
* 內容重新整理
* 加增效果到網頁元件中
* 操作DOM
* 編輯HTML
* 執行JavaScript
* 操作事件

嵌入式網頁瀏覽器主要由可分為2個部分:
* WebEngine:提供基本的網頁瀏覽能力
* WebView: 封裝了WebEngine並結合網頁內容到一個應用程式埸景中,也提供了一些方法來增加網頁元件效果與轉換。

Reference
Map In JavaFX 2.0


UndeadJ edited on 2011-06-10 13:02
reply to postreply to post
我們是懷抱各自的夢想,買了車票的乘客,不過就像列車一定會有終點,人生有時會碰到必須換車的時候...

我們站在名為「今天」的車站,在名為「昨天」的列車下車,轉搭為「明天」的列車

不過,若沒及時搭上的話....
作者 Re:JavaFX 2.0 介紹 [Re:UndeadJ]
UndeadJ

UX & UI Design



發文: 384
積分: 3
於 2011-06-09 00:57 user profilesend a private message to usersend email to UndeadJreply to postreply to postsearch all posts byselect and copy to clipboard. 
ie only, sorry for netscape users:-)add this post to my favorite list
Layout 、 UI Control 、 CSS
使佈局容器或面板,可以讓JavaFX應用程式中圖形埸景的元件更具有彈性。
在JavaFX 2.0中,有8種佈局的方法:BorderPane、HBox、VBox、StackPane、GridPane、FlowPane、TilePane、AnchorPane。
此外,MigLayout也開始支援JavaFX 2.0。

JavaFX 2.0的UI控制項是從JavaFX 1.2來的,支援CSS。利用JavaFX CSS,可以不用修改Java程式碼就可以變換JavaFX中的UI風格。JavaFX應用程式會在執行時期的適當時機,動態的改變 CSS中所描述的UI風格.

2-D and 3-D Transformations & Visual Effects
每個在圖形埸景中的Node,都可以利用javafx.scene.tranform中的API,在X-Y座標中進行轉換(轉變),主要包含:位移(translate)、縮放(scale)、剪裁(shear)、旋轉(rotate)與仿射(affine),其中仿射(affine)不是直接拿來使用,需搭配前面4種來使用。而視覺效果,是基於影像的像素的處理,各種效果的呈現如下圖所示:



UndeadJ edited on 2011-06-09 01:08
reply to postreply to post
我們是懷抱各自的夢想,買了車票的乘客,不過就像列車一定會有終點,人生有時會碰到必須換車的時候...

我們站在名為「今天」的車站,在名為「昨天」的列車下車,轉搭為「明天」的列車

不過,若沒及時搭上的話....
作者 Re:JavaFX 2.0 介紹 [Re:UndeadJ]
洛城雨





發文: 1
積分: 0
於 2011-08-17 22:41 user profilesend a private message to userreply to postreply to postsearch all posts byselect and copy to clipboard. 
ie only, sorry for netscape users:-)add this post to my favorite list
这么好的内容就然没人顶?我顶,最近也准备好好学习JavaFX,swing太难学了!

reply to postreply to post
作者 Re:JavaFX 2.0 介紹 [Re:UndeadJ]
tigerking





發文: 2
積分: 0
於 2011-08-29 10:31 user profilesend a private message to userreply to postreply to postsearch all posts byselect and copy to clipboard. 
ie only, sorry for netscape users:-)add this post to my favorite list
拜讀啊 各位高人 恩 太厲害了

reply to postreply to post
租車
作者 Re:JavaFX 2.0 介紹 [Re:UndeadJ]
simpleisgood





發文: 41
積分: 0
於 2011-11-21 20:23 user profilesend a private message to usersend email to simpleisgoodreply to postreply to postsearch all posts byselect and copy to clipboard. 
ie only, sorry for netscape users:-)add this post to my favorite list
人們慣於安樂

不只User如此

Programer亦如是

唯有懂得人類怠墮的天性

才能站上世界的舞台


reply to postreply to post
Simple is good
» JWorld@TW »  JavaFX 討論區

reply to topicthreaded modego to previous topicgo to next topic
  已讀文章
  新的文章
  被刪除的文章
Jump to the top of page

JWorld@TW 本站商標資訊

Powered by Powerful JuteForum® Version Jute 1.5.8