Worklight基於HTML5和JavaScript的跨平臺應用

隨著智慧手機和平板電腦的普及，越來越多的互聯網 IT 企業把注意力集中到了移動平臺上。 目前市場上主流的移動平臺有 Apple 的 iOS, Google 的 Android, 微軟的 Windows Phone, BlackBerry 以及 Nokia 的 Symbian 等。 這些移動平臺的開發環境和程式設計語言都不盡相同。 同時，一個平臺又有多個版本，例如 Android2.3 和 Android3.0 分別支援智慧手機和平板電腦。 正是由於這些多樣性，使得移動應用的開發存在成本高、週期長和維護困難等問題。

Worklight 是 IBM 收購的一套用於移動應用開發和基礎平臺整合的企業級解決方案。 它支援多種移動平臺的本地應用開發，同時也支援基於 HTML5 和 JavaScript 的跨平臺應用。

本文主要介紹 Worklight 的 RuntimeSkin 特性以及如何使用該特性開發針對不同移動終端的跨平臺應用。

開發環境安裝與配置

Worklight 提供的是一整套移動應用的開發環境，涵蓋了從開發到集成，到管理、部署、監控行等軟體發展生命週期的各個方面。 它主要由四個部分組成，Worklight Studio、 Worklight Server、Device Runtime 和 Worklight Console：

Worklight Studio 是基於 Eclipse 的整合式開發環境，使用者可以很方便地創建、開發、部署和測試不同平臺的本地應用或者混合型應用。 Worklight Server 是一個基於 Tomcat 的伺服器，用於部署開發好的移動應用程式。 同時它還提供配接器 (Adapter) 元件來進行使用者登錄驗證、後臺資料交互、消息推送等企業級應用操作。 Device Runtime 是 Worklight SDK 中包含一個元件，它主要提供了可以調用移動平臺本地資源的多種介面，開發者可以使用 JavaScript API, 作業系統本地庫和協力廠商庫來調用這些介面， 充分利用了本地應用的優點。 Worklight Console 可以讓使用者通過瀏覽器來監控、管理當前部署在 Worklight Server 上的應用程式和配接器元件。 Worklight Console 同時還負責消息推送管理以及報表分析。

Worklight 開發環境的下載與安裝步驟可以從 developerWorks IBM Worklight 學習資源上獲得。

什麼是運行時皮膚（Runtime Skin）

運行時皮膚是指 Worklight 的應用程式可以為已經創建好的手機平臺環境（Worklight Environment）添加多個皮膚，每一個皮膚是平臺環境的一個子集，所有的皮膚作為應用程式的一部分打包在安裝檔中。 當應用程式運行時會根據具體的行動裝置動態地決定使用哪一個皮膚。 運行時皮膚的應用場景有很多，比如不同的手機尺寸，不同的手機平臺版本，是否支援 HTML5 等等。

下面我們以一個新聞流覽的應用程式為例，具體介紹如何應用 Worklight 的 Runtime Skin 特性。

創建 Worklight 工程和應用程式

我們創建一個 Worklight 工程。 在 Eclipse 中選擇 File->New->Worklight Project, 如圖 1 所示。


圖 1. 創建 Worklight 工程





輸入工程名稱 Mobile News。 接著我們創建一個 Worklight 應用程式，選擇 File->New->Worklight Application，如圖 2 所示。


圖 2. 創建 Worklight 應用程式





  在彈出的視窗中選擇第一步新建的工程，然後輸入應用程式的名稱 NewsApp，如圖 3 所示。


圖 3. 在工程中創建應用程式





  創建完工程和應用程式以後，Worklight 會自動生成如下的目錄結構，如圖 4 所示。


圖 4. 應用程式目錄結構





 

我們看到在 apps 目錄下包含剛剛創建的應用程式 NewsApp，初始情況下每一個應用程式會有一個 common 的運行時環境，它會被不同手機平臺環境（例如 iOS, Android, BlackBerry 等）所共用。 在 common 資料夾下有三個資料夾 css, images 和 js，分別存放了程式相關的 css 檔，圖片和 JavaScript 檔。 NewsApp.html 是程式自動創建的主 html 檔。