開發windows mobile 6.5 widget程式

前陣子坎尼去了幾場 windows mobile 的研討會
老師有提到開發 widget 的技巧
所以今天稍微來談一下 window mobile 6.5 上的 widget 開發

---

I. 戰前準備

首先要有 windows mobile 6.5 的執行環境，可以到 這裡下載 DTK
裡面有含模擬器的映像檔，待會兒會用模擬器來執行程式

接著是開發環境
windows mobile 6.5 的 widget 全為 html 組成
因此只要有能寫 html 的編輯器即可

II. 開發

由於很多人都寫過相關的開發方式
坎尼就直接引用 bauann 大所寫的 Widgets in Windows Mobile 6.5 - 簡介
大家可以直接看這篇，比坎尼寫的詳細多了 :D

剛剛提到 widget 由 html 構成
坎尼用 visual studio 開了個 html 檔，並加入下圖所示的網頁元素

"Show Messages" 按鈕會在 DIV 之中顯示使用者填入的字串
"Moving" 則是移動下方的灰色 div 到亂數位置

接著是此次的 javascript code
從下圖可得知，坎尼加入了 jquery 來開發

移動 div 的部份，坎尼用 jquery 的 animate 和 fadeOut 去展現動態效果

III. 安裝部署

接著是建立 config.xml 檔，讓 widget 安裝檔能被 windows mobile 6.5 辨別

接著把 html、jquery-1.3.2.min.js、Config.xml 還有要作為 logo 的 e04.png
利用壓縮程式壓成 zip 檔案，接著把副檔名改為 .wgt
這樣一來， widget 的安裝檔就完成了，趕快放到模擬器上試試看吧

直接在 windows mobile 6.5 中點選 wgt 檔即可安裝


安裝好會自動開啟程式，來測試一下成果

應該是硬體受限的緣故
原本寫好的 html 在 pc 上會有動態淡出淡入的效果
但到了 windows mobile 上，效果就不見了

IV. 解除安裝

這裡提一下如何解除安裝
請依照下圖步驟：Start -> Settings -> System -> Remove Programs
再選擇要解除安裝的 widget 程式即可

V. 小結

雖然 widget 提供 html 的開發方式
但很多動態的表現不如 pc 上來的順暢
所以最好著重在功能性的開發

由於為 html，動態資料交換就必須利用 Ajax 及 WebService 等技術
但若能用 jquery 從中當作媒介，相信會簡單許多
(也不用像研討會王老師講的，寫AJAX寫到快哭了 XD

本篇粗淺的介紹一下 windows mobile 的 widget
有錯還望高手們來指正 :)