The Joy of XUL

 

建議的讀者群:想要更加認識 XUL 且想瞭解為什麼 Mozilla 會採用 XUL 的應用開發人員與管理者。

翻譯原則:由於考量到預設讀者群應該有某種程度的原文專有名詞的認識基礎,故盡可能保留原文專有名詞,或採用加註的方式呈現。如果文中有對稱關係,則採用對稱保留或加註。

 

序論

XUL (發音〝/zu:l/〞) 是 Mozilla 以 XML 為基礎的使用者介面語言,讓你盡情地開發各式各樣的跨平台應用程式,不論是否在連線到網際網路的狀態皆可。這些應用程式可以藉由簡單地變更文字,圖案與版面佈局,來達到客製化的目的,因此可以輕易地本土化以推廣到各種市場去。如果您已經是熟習 Dynamic HTML (DHTML) 的網頁設計師,那您將可以很快地學會 XUL 並且可以馬上開始動手建構應用程式了。

這份文件將介紹一些比較吸引人的理由給網頁設計師,來應用 XUL 以及 Mozilla 相關技術來撰寫跨平台的應用程式。這也將充分說明 Mozilla 要設計 XUL 的動機,以及為什麼 Mozilla 平台是使用 XUL 建構起來的。XUL 的重要特色與優勢將會接著以支援 Mozilla 技術的方式來呈現。最後,有個關於 "使用 XUL 所撰寫之 Calendar" 的小小個案研討,作為補充。

重要特色與優勢

強大、以元件為基礎的標示語言 XUL 的目標是建造跨平台的應用程式,以別於原本拿來設計網頁的 DHTML。因此,XUL 設計為應用程式的加工組件(application artifacts),如︰視窗(windows)、標籤(labels)、按鈕(buttons)等,用來取代頁面(pages)、大標題(heading levels)、連結(hypertext links)等。

事實上,許多開發人員已經嘗試在他們的 DHTML 網頁應用程式中達到圖形界面的效果,但這其中的代價就是複雜以及效能,而且沒有任何標準可以支援。

以現有標準為基礎 XUL 是立基於 W3C 標準 XML 1.0 的一個 XML 語言。使用 XUL 的應用程式是建構於這些 W3C 標準技術之上︰HTML 4.0、CSS 1 & 2、DOM Levels 1 & 2、JavaScript 1.5,包括 ECMA-262 Edition 3 (ECMAscript)、XML 1.0。

mozilla.org 正進一步地尋求 W3C 為 eXtensible Binding Language (XBL) 標準化。(參考下面的〝支援技術〞)。

平台可攜性 如同 HTML,XUL 被設計成與平台無關的,可以很容易地讓應用程式在任何存在 Mozilla 的作業系統上面使用。想想看現在有多麼廣泛的平台支援 Mozilla,這是以 XUL 技術來開發應用程式當中,最令人讚嘆的特色。

因為 XUL 提供了使用者介面組成元件的抽象層,因此實現了這個保證︰一經寫就,處處執行 (write-once, run-anywhere)。所有 Mozilla 核心應用程式的使用者介面都是用 XUL 所撰寫的,並且該單一程式碼,在所有 Mozilla 平台上都支援。

分離介面呈現與程式流程 大部分網頁應用程式沒落的主因就是,把使用者介面跟程式流程緊緊的結合在一起了。這在一個團隊的環境中是個頗為難的問題,因為這兩部分所需的技能通常是分散在不同的人身上。

XUL 很清楚地分離出應用程式的各個組成︰程式流程 ("content" 以 XUL、XBL 與 JavaScript 組成)、外觀 ("skin" 以 CSS 和圖像組成)、與特定語言的文字標籤 ("locale" 以 DTD 以及在 .properties 檔案中的對應字串)。XUL 應用程式的佈局與外觀可以自由地改變,獨立程式與流程之外。甚至,應用程式可以本地化為任何語言或地區,完全獨立於程式流程或外觀。

對應用程式作各種分離所得的結果是︰程式設計師可以很容易地維護程式,設計師可以輕鬆地變更設計樣式,而各個語言的翻譯人員也可以自行完成翻譯工作。這樣子獨立的工作流程,相較於以 HTML 為基礎的應用程式更容易協同工作,也減少了整個系統在穩定性與品質上的衝擊。

輕鬆自訂、本地化、打品牌 另一個由分離程式流程,介面呈現和語言文字所直接造成的特點,即是不同的使用者或使用群可以很容易的修改成所需要的樣子。

程式開發人員可以只維護應用程式的主要程式碼,然後藉由使用不同的外觀介面 (skin) 來自訂圖示與品牌觀感給他們不同的顧客群。一個以英文介面撰寫與開發的應用程式,可以被翻譯成法文給相同需求的顧客使用。當這些改變被廣泛地使用在這個應用程式的時候,他們也可以從程式流程與介面呈現之中獨立出來,來分享給所有的自訂版本。

支援技術

這裡有一些 Mozilla 所用來支援 XUL 撰寫跨平台網頁應用程式的技術。

XBL eXtensible Bindings Language (XBL) 是一種標記語言 (markup language),定義了新的物件元素以及給 XUL 構件 (widget) 的 "bindings"。藉由 XBL,開發人員可以為 XUL 構件定義新的內容,為 XUL 構件添加事件處理,加入新的介面屬性與方法。事實上,XBL 將使得開發人員得以利用自訂現有的標籤 (tag) 或是新增他們所需要的標籤來擴充 XUL。

藉由使用 XBL,開發人員可以輕易地建構出所想要的使用者介面物件,如︰進度表、別緻的彈出式選單、甚至是工具列或搜尋表單。這些自訂物件可以在指定標籤與其屬性之後,使用在各個 XUL 應用程式當中。

Overlays Overlay 是用來描述使用介面之額外內容的 XUL 檔案。他們是一種增添使用介面的通用機制,用以增加額外的元件,覆蓋掉 XUL 檔案中不再支援的使用者介面,並且可以重新利用使用者介面當中的一些片段。

Overlay 對於自訂與擴充現有應用程式而言是個很強大的機制,因為他們是以兩種相關但卻又幾乎完全不同的方式在運作著。某種程度上看來,Overlay 其他語言所謂的〝引入(include)〞檔案,因為一個應用程式可能指定在其定義中引入一個 Overlay。但是 Overlay 也可以只用於外觀上,使得設計人員可以在某個應用程式上頭使用 Overlay,而不需要改變其原始程式。

在實作上,這使得開發人員只需對其應用程式維護一組程式碼,然後再為客戶應用各自自訂的外型,或是引入特別的功能,而這些都完全獨立於主程式碼。這導致整個解決方案的簡化,與降低維護成本。

Overlay 對於那些想要為 Mozilla 增添新功能但又希望保有著作權的軟體開發人員而言還有個特點。這兩種執照聲明︰Netscape Public License (NPL) 和 Mozilla Public License (MPL) 都要求那些有對原始程式 (Mozilla 所提供的那些原始程式碼) 做過修改的開發人員,要釋放出他們變更之後的程式碼給他們的顧客。Overlay 可以在變更著作權的情況下用來為 Mozilla 增添新的功能,而不會污染了最原始的開放原始程式碼。

XPCOM/XPConnect XPCOM 與 XPConnect 都是加強技術,將外部函數庫與 XUL 應用程式整合在一起。

XPCOM,代表的是跨平台組成物件模型 (Cross Platform Component Object Model),是個用來撰寫跨平台與軟體模組化的一個架構。XPCOM 的組成元件可以用 C、C++ 和 JavaScript 來撰寫,並且可以在這些環境下來開發︰C、C++、JavaScript、Python、與 Perl 擴充集。

XPConnect 這個技術是用來製造出簡單的 XPCOM 與 JavaScript 之間的溝通。XPConnect 允許 JavaScript 物件正大光明地存取與運用 XPCOM 物件。他也讓 JavaScript 物件可以表示成 XPCOM 相容介面以供 XPCOM 物件呼叫使用。

將兩者合在一起,XPCOM 和 XPConnect 使得開發人員可以設計那些需要使用編譯式語言的效能或是存取作業系統等級的 XUL 應用程式。

XPInstall XPInstall,Mozilla 的跨平台安裝技術,提供了一個標準的方式將 XUL 應用程式的各個元件包裝成一個安裝檔案,來讓 Mozilla 可以下載並且執行之。

XPInstall 讓使用者可以毫不費力地從網際網路或是公司主機來安裝新的 XUL 應用程式。要安裝一個新的應用程式,使用者只要在網頁上或是電子郵件訊息中的超連結點一下滑鼠,然後在安裝對話方塊中允許安裝新的應用程式即可。

個案研討: A Mozilla Calendar Application

這個小型的個案研討將敘述 OEone 公司 (http://www.oeone.com) 如何將他的 Calendar 應用程式整合成為 Mozilla 的核心產品. Calendar 包含了 XUL 前端使用介面與以 C 寫成的 XPCOM 元件函式庫 libical , 該函式庫主要是供日期運算以及行事曆資料的儲存. 原本 Calendar 只有在 Linux 上開發, 但是都會成功地在一週之內移植到 Macintosh 和 Windows 平台上.

XUL 提供了許多的使用者介面元件. Calendar 的使用者介面完完全全都是用 XUL 所完成的, JavaScript? 還有 CSS, 都可以證明這樣的開發平台所帶來的強大與彈性. 他使用了簡單的 XUL 元件, 例如 boxes, grids, 和 stacks 來構成週, 日, 和月的瀏覽介面. 一開始 Calendar 還沒有利用到 XBL, 因為開發人員還沒完全清楚地掌握這整個開發技術. 但是 Calendar 的未來計畫已經包含了要將這些使用者介面的元件轉換成 XBL widgets 來簡化開發工作.

XPCOM/XPConnect 讓整合現有程式碼成為可能. 一個擁有完整行事曆功能的開放原始碼函式庫, libical (http://www.softwarestudio.org/libical/), 被 Calendar 專案所採用. Libical 以開放原始碼的方式實做了 IETF 的 iCalendar 行事曆與排程協定. (RFC 2445, 2446, 及 2447). 他有 iCal 元件並提供了 C API 來操作這些元件的屬性, 參數以及其子元件. 這個函式庫藉由撰寫一個 XPCOM wrapper 來整合操作其使用介面. 為了增進應用程式的效能, 也將程式從 JavaScript 轉移成 XPCOM 元件.

外觀呈現與程式寫作的分離, 修改起來超有彈性. 原本的使用者介面使用了大量的圖形檔案來呈現月和週的顯示. 而在開發人員學習了更多關於 XUL 的細節之後, 改用一些較為精巧的元件來呈現這個使用介面. 這不僅加快了顯示的速度, 也節省了許多記憶體與磁碟存取的資源. 他們幾乎重寫整個顯示月和週的使用者介面, 但對於主程式方面則絲毫不受影響, 不需要做任何的改變.

轉移 XUL 的應用程式到其他作業平台, 壓根兒不重要. Calendar 原本是個 Linux 上的應用程式, 也沒想過要轉移到其他平台上面去. 但是當原來的開發者 (OEone Corporation) 將原始程式碼貢獻給 Mozilla 專案的時候, Calendar 就必須要想辦法轉移到 Windows 和 Macintosh 的平台上面去. XUL 應用程式的使用者介面不用做任何平台轉移的修改, 因為他可以幾乎不做任何變更就可以在這兩個新的平台上運作. 相類似地, 因為使用者介面是用 JavaScript 寫成的, 互動操作方面的程式也不需要做修改, 不過, 因為 libical 函式庫是由 C 所寫成的, 所以比較需要做修改, 才能轉移到其他平台上面去使用.

很幸運地, 現有的 libical 函式庫已經有 Macintosh 平台上的版本可以用了, 藉由 XPCOM 這個跨平台的基石, 在 Macintosh 上的行事曆在幾天之內就完成移植了. 可是那時候還沒有 Win32 上面的版本可以直接拿來用, 所以開發人員需要把 libical 移植到 Windows 平台上面來. 不到一個星期, 這項工作也完成了, 因此 Mozilla 可以在這三個平台上使用行事曆了: Linux, Macintosh, 和 Windows.

XPInstall 對於開發者和使用者都很方便. Calendar 沒有被包含在 Mozilla 1.0 裡面一起發行, 因此沒有被當成標準配備而包含在固定的 nightly release builds 裡面. 對於有能力自行編譯 Mozilla 的開發人員而言, 他們可以自己設定相關的環境變數, 並且自己編譯 Calendar 來使用. 但是對於許多想要試看看 Calendar 的 Mozilla 使用者來說, 編譯這件事實在是遙不可及. 但是藉由 XPInstall, 開發者就可以很輕易地包裝各個版本的 Calendar, 然後只要在網路上點擊一個連結就可以直接進行安裝.

結論

Mozilla, 那出色的 XUL, 使用與 desktop 應用程式相同且豐富的使用者介面與使用體驗, 為開發跨平台的應用程式帶來令人讚嘆的全心體驗. 對於使用 W3C 標準來設計 web 應用程式的設計師們, 可以輕鬆地利用以往的經驗直接轉換到 desktop 應用程式.

在 web 成為散佈應用程式供使用者在不同電腦上使用的標準之前, 這個跨平台的問題需要藉由 客戶端-伺服端 (client-server) 的工具來解決. 但這總是會有版權的問題, 開發人員需要支付一筆可觀的金額來購買執行程式時所需要之函式庫的版權, 也同時被廠商給綁住了. Mozilla 為這些跨平台的工具, 提供了相同價值觀但卻是使用開放原始碼版權的選擇.

身為快速成長的跨平台技術, XUL 可以填滿一些有趣的技術空缺, 例如那些透過網路存取分散式物件的 Java J2EE 和 Microsoft .Net. 動態的應用程式搭配可以自由變換的使用者介面表達, 這都是依循標準, 具有擴充性, 而且可以很方便的透過網際網路來散播.

XUL 模糊了 desktop 和 web 應用程式的分界, 因為他在這兩個世界裡面都有良好的根基. 將 web 應用程式轉換成 XUL 將獲得許多好處, 可以有高度的介面彈性, 在各種支援的平台上擁有一致的操作環境, 而且仍然可以存取你原有的資源, 例如共享的函式庫, 以及本地端的檔案系統.

不論你是需要將現有的網頁應用程式轉移到 desktop 而尋求可以讓你輕鬆移轉到多重平台的技術, 或是將你的勁酷功能整合進瀏覽器, XUL 都會是個很值得的選擇.

Reference Material

  1. XUL Planet - Samples, Tutorials and Language-References to XUL and XBL http://www.xulplanet.com/
  2. Introduction to a XUL Document, Dan Matejka <danm@netscape.com> http://www.mozilla.org/xpfe/xptoolkit/xulintro.html
  3. XBL - Extensible Binding Language 1.0, David Hyatt <hyatt@netscape.com> http://www.mozilla.org/projects/xbl/xbl.html
  4. XBL - XML Binding Language (W3C Note), David Hyatt < hyatt@netscape.com> http://www.w3.org/TR/xbl/
  5. XUL Overlays, Ian Oeschger <oeschger@netscape.com> and David Hyatt <hyatt@netscape.com> http://www.mozilla.org/xpfe/xptoolkit/overlays.html
  6. XPCOM Part 1: An introduction to XPCOM, Rick Parrish <rfmobile@swbell.net> http://www-106.ibm.com/developerwork.../co-xpcom.html
  7. XPConnect (Scriptable Components), John Bandhauer <jband@netscape.com> http://www.mozilla.org/scriptable/
  8. 為 Mozilla 建立新的套件(Package), Ian Oeschger <oeschger@netscape.com> http://www.mozilla.org/docs/xul/xuln..._packages.html
  9. Mozilla Calendar 專案網站, 由 Mike Potter 所維護 <mikep@oeone.com> http://www.mozilla.org/projects/calendar/

原始文件資訊

  • 作者: Peter Bojanic

翻譯文件資訊

zh_tw:The Joy of XUL

Document Tags and Contributors

標籤:
Contributors to this page: fscholz, Dwchiang, Csardas, happysadman, Mgjbot, Kourge
最近更新: fscholz,