做j2me應(yīng)用也快1年了， midp提供的那套高級(jí)ui實(shí)在讓人很難受，早就想自己弄一套了， 查了一些開源項(xiàng)目，沒有合我這個(gè)懶人口味的， 也間或看了一下包括wuhua和其他幾個(gè)網(wǎng)友提供一些自行設(shè)計(jì)UI的文章， 總覺的有點(diǎn)復(fù)雜，不適合我這個(gè)懶人。

過完年閑著實(shí)在無事，慢慢磨蹭，自己搞了一套完事。

midp 2的高級(jí)ui我感覺主要有這些問題。

1. 界面丑陋， 不能進(jìn)行各式字體和背景色的設(shè)置， 不利于創(chuàng)建統(tǒng)一的界面風(fēng)格。

2. Command和choicegroup在不同平臺(tái)上實(shí)現(xiàn)差異巨大， 每個(gè)平臺(tái)都要調(diào)試，寫不同的用戶手冊(cè)，很煩，而且command不支持二級(jí)菜單。

3. layout基本無用， 原因也是各個(gè)手機(jī)平臺(tái)的差異，特別是wm上，不同虛擬機(jī)實(shí)現(xiàn)差異巨大。

我們做企業(yè)應(yīng)用，是因?yàn)榭缙脚_(tái)的需要而選擇kjava的，但是因?yàn)樯厦娴囊蛩兀鶎?dǎo)致做出來的東西，界面和wm 上有c#或c++做的東西差異巨大，引起客戶的強(qiáng)烈不滿。而且某些復(fù)雜的展現(xiàn)，需要用canvas實(shí)現(xiàn)，風(fēng)格也很難和高級(jí)ui保持一致（很難為了每個(gè)平臺(tái)都專門做一套風(fēng)格），很難和客戶解釋。而企業(yè)用戶，一般都不怎么懂技術(shù)，對(duì)手機(jī)UI的觀感直接影響到他們對(duì)整個(gè)應(yīng)用的評(píng)價(jià)。

我基本的思路是做一套u(yù)i替換掉midp 2.0中的高級(jí)ui ，基本的目標(biāo)如下。

1. 部件名詞和基本方法應(yīng)該保持和原來ui的一致，方便代碼移植，比如Textfield 還是叫Textfield，基本參數(shù)也一致。

2. 對(duì)部件進(jìn)行適當(dāng)擴(kuò)展和簡(jiǎn)化，方便開發(fā)，比如command， 被我拆分成2個(gè)部分，一個(gè)是左右command，另外一個(gè)是完整的菜單（可支持多級(jí)菜單），事件處理盡可能的符合傳統(tǒng)桌面系統(tǒng)編寫的習(xí)慣，而不是原來midp中的簡(jiǎn)化模型

3. layout方面進(jìn)行簡(jiǎn)化， 我覺得手機(jī)界面，最有效的布局方式就是上下順序布局，一行一個(gè)對(duì)象， 一行需要放多個(gè)對(duì)象的時(shí)候，可以使用分組的概念來進(jìn)行簡(jiǎn)化，并可以簡(jiǎn)單設(shè)置對(duì)象的對(duì)齊模式。 特殊情況下也可以重載基類的布局，使用絕對(duì)定位的方法繪制元素。原來midp中設(shè)計(jì)的layout概念，因?yàn)椴煌謾C(jī)的巨大差異，實(shí)際基本沒有用處。

4. 統(tǒng)一在基類form里完成各種事件處理和調(diào)度，保證同時(shí)對(duì)觸摸屏和鍵盤的支持，并對(duì)普通開發(fā)用戶屏蔽這些操作。

5. 增加一些常用，但是midp里面沒有的控件，簡(jiǎn)化開發(fā)工作量，比如對(duì)話框，提示框，進(jìn)度條，電子表格，文檔瀏覽等等。

這樣完成以后的UI對(duì)開發(fā)者的開發(fā)難度要低于直接使用用高級(jí)ui進(jìn)行開發(fā)，代碼量也有顯著減少，而且大幅度節(jié)約了調(diào)試和移植的時(shí)間。 缺點(diǎn)當(dāng)然是內(nèi)存消耗增加，不過對(duì)于企業(yè)應(yīng)用一般都可以使用中高檔手機(jī)，所以問題也不大。

另外為了方便對(duì)不同用戶定制風(fēng)格，進(jìn)行了修改，實(shí)現(xiàn)了skin的方式，可以使用圖片來設(shè)計(jì)主題。

 

 UI的風(fēng)格是以模仿win ce為核心的， 分為標(biāo)題， 工作區(qū)域， 菜單條區(qū)域三個(gè)部分。父類form負(fù)責(zé)處理各種事件，子類需要的時(shí)候可以重載工作區(qū)域，實(shí)現(xiàn)自己的特定風(fēng)格顯示。

結(jié)合代碼和截圖簡(jiǎn)單做一下介紹

首先，實(shí)現(xiàn)一個(gè)基本的登陸窗體

代碼和原MIDP 2.0的代碼基本一致，但是對(duì)事件模型進(jìn)行了簡(jiǎn)化，使用action的模式做處理，節(jié)約了一部分代碼量。和網(wǎng)絡(luò)上某些框架不同的地方，這里一般不需要自己使用絕對(duì)坐標(biāo)的方式繪制元素。

form可以設(shè)置背景，顏色，字體和元素的基本對(duì)齊方式。



另外對(duì)原來的textfield進(jìn)行了一些改進(jìn)， 可以允許設(shè)置行高和提示信息， 比如此處的內(nèi)容字段，即設(shè)置為自動(dòng)填滿屏幕剩余空間，這樣可以簡(jiǎn)化開發(fā)工作。

對(duì)于常見9宮格菜單，則提供一個(gè)基類來擴(kuò)展。



常見列表對(duì)象的實(shí)現(xiàn)。

  實(shí)現(xiàn)的UI放棄了list的實(shí)現(xiàn)， 其實(shí)list也是個(gè)form，順序增加就可， 此處使用group的概念把一個(gè)分割線，一個(gè)checkbox和一個(gè)Stringitem合并在一起就實(shí)現(xiàn)了list.

其中的SelectItemGroup 由2個(gè)item對(duì)象組合而成。

item也可以加入圖片和對(duì)齊屬性，實(shí)現(xiàn)這樣圖為混合的列表。





以樹對(duì)象實(shí)現(xiàn)的地址薄， 樹對(duì)象也是一個(gè)group。

更復(fù)雜一點(diǎn)的布局，日程安排也可以用group的概念進(jìn)行組合



使用新UI對(duì)原來的高級(jí)UI進(jìn)行替換，主要修改部分是事件處理部分，節(jié)約了三分之一以上的代碼，基本達(dá)到了目的。

另外自行實(shí)現(xiàn)了一些常用的復(fù)雜控件。

電子表格

可以用來顯示查詢結(jié)果或者excel文件（需要在后臺(tái)轉(zhuǎn)換）。有別于網(wǎng)上可以找到的其他電子表格，比如sun netbean送的那個(gè)，這個(gè)電子表格控件可以實(shí)現(xiàn)跨行跨列的顯示，并支持滾動(dòng)顯示。

富文本顯示窗體


可以顯示文本，表格和圖像， 用來展現(xiàn)word或者其他富文本格式

圖片瀏覽控件，用來顯示圖片和轉(zhuǎn)換為圖片的各類文檔


文本瀏覽控件， 用來顯示大數(shù)據(jù)量的文本信息，能自動(dòng)換行和分頁


對(duì)話框， 可以有多種變形，使用回調(diào)的方式執(zhí)行事件，簡(jiǎn)化開發(fā)。另外還實(shí)現(xiàn)了比如狀態(tài)條之類的東東。



上次在j2medev貼了沒人回應(yīng)，也沒人給意見， 真是失敗， 不過更失敗的，自己做的這套移動(dòng)辦公最后無疾而終，木有用戶呀。

基于這套u(yù)i實(shí)現(xiàn)對(duì)先前開發(fā)的移動(dòng)OA界面做了重新開發(fā)，并對(duì)office附件處理部分進(jìn)行了優(yōu)化。效果尚可，更多圖片可以參看附件移動(dòng)OA用戶手冊(cè)的截屏。目前在s60系統(tǒng)，moto，uiq和wm5上做過兼容性測(cè)試。