可定制的WEB界面設(shè)計(jì)技術(shù)研究_圖文

1、 人慶石油學(xué)院壩I究生學(xué)位論文 圖4_1單條記錄編輯示例若把XML數(shù)據(jù)島與TABLE元素綁定在一起,就可以自動地顯示為多行的表格形式。一般情況下,我們從數(shù)據(jù)庫中查詢得到的結(jié)果集可能很大,所以從服務(wù)器返回到客戶端時(shí),數(shù)據(jù)會被分成若干個頁面分別進(jìn)行傳遞。利用XML數(shù)據(jù)島進(jìn)行表格數(shù)據(jù)綁定,下面是定制的一個多條記錄編輯頁面示例結(jié)幕囊潮鋰:用餅*nl_3lnl3MnI】l*32t1*3“tl,nI31”tI31e-75tI】I*25m一n*26nl-,tl-2t1一jlp,2Tt3r2T*I31*F27I31pP21|匕l(fā)一,10-p27|匕r,lg-pilI31,tI-0-2I、IiiiI碭T麗j t

2、A H1圖4_2多行記錄編輯示例 .堡!堡墼墨塾壁生絲蘭!竺. 圖55可視化WEB用戶界面編輯窗口人慶山油學(xué)院碩I研究生學(xué)位論史 圖5_6WEB用尸界面編輯萄口屬性框可視化WEB用戶界面編輯窗口中包括:“工具箱”、“設(shè)計(jì)器”、“代碼編輯器”、“屬性框”、“頁面屬性編輯器”等。其中:工具箱中包含wEB用戶界面組件庫文字格式按鈕,在添加組件時(shí),會先彈出“屬性框”,用戶對該組件添加屬性和事件,添加后會在設(shè)計(jì)器中所見即所得地生成組件模型,在代碼編輯器中生成改組件的代碼,當(dāng)選定一個組件后,可以對其屬性和事件進(jìn)行編輯。在頁面定制的過程中,隨時(shí)可以在“頁面屬性編輯器”中添加和修改頁面屬性,并保存定制的結(jié)果,

3、也可以查看和對已經(jīng)保存的頁面進(jìn)行編輯。在界面定制中,需要注意的是,每個組件都用唯一的ID來標(biāo)識,即屬性框中組件ID是唯一的,每個頁面也是由唯的ID標(biāo)識的,這個lD是在頁面保存時(shí)自動生成的,不需要用戶填寫,頁面的標(biāo)題和簡介是由用戶自己填寫的,盡量使頁面的標(biāo)題是唯一的。由上面的兩個圖,工具箱中包含善(剪切、電(復(fù)制、e(粘貼、“(還原、”(恢復(fù)等操作類二【+具,有格式,(字體格式、牢體(字體、罕號(字號、(字體顏色、鈕(背景顏色、曩(粗體,(斜體、型(+F劃線、曩(文件,(刪除線,、(下標(biāo)、,(上標(biāo)、lie(左對齊、l(居中、i(右對齊、岳(項(xiàng)目符號、三(項(xiàng)目編號、疆(取消縮進(jìn)、疆(增加縮進(jìn)等格式化工具,一(水平線、”(超鏈接、口(表格、口(圖片、!.硬件、一(按鈕, A(文本標(biāo)簽、幻(輸入框、固(文字區(qū)域、F(復(fù)選框、8(單選框、目(列表框、鼠(界面參數(shù)、霍(數(shù)據(jù)源、叼(結(jié)