專利名稱：用戶接口設計系統(tǒng)與方法
技術領域：
本發(fā)明涉及一種用戶接口設計系統(tǒng)與方法，更詳細地，涉及一種 搭載到用于構建用戶接口的應用軟件中的用戶接口設計系統(tǒng)與方法。
背景技術：
隨著科學技術的發(fā)展、進步，諸如電腦、數字電視、移動電話以及個人數字助理(PDA)等電子信息產品紛紛問世，上述的電子信息產 品均采用多種應用程序完成其內部計算及運行，而為使用戶可對該類 電子信息產品進行可視化操作，現今應用程序的開發(fā)均提供面向用戶 的接口，該接口中包含有多個可操控對象，用戶可以根據需要對其中任一對象執(zhí)行操作及控制作業(yè)。
顯然，現今應用程序開發(fā)提供的用戶接口作為用戶對該類電子信 息產品實施操作的必需視窗，其設計優(yōu)劣的重要性已不容忽視，尤其 隨著電子市場的競爭日趨激烈，吸引用戶興趣的已不僅僅是該類電子 信息產品的高性能，而其提供用戶接口的設計是否人性化已逐漸成為用戶選擇的重要參考標準。
現行的用戶接口的設計過程通常包括兩個部分實現該接口功能 的編程設計、對應于該編程設計的用戶接口的圖形設計。由于現在的 應用軟件的功能越來越繁多，使得對應用戶接口的圖形設計亦隨之變 得復雜，往往設計一個接口上需要布設大量元件，例如窗體、圖文框體、按鈕等等，由于該布設作業(yè)均通過手工完成，即需將該些元件一一拉動至表單(Form)上，繁復枯燥且費時費力，大大降低設計人員的工作效率。
而且，又因該些元件的大小均通過手工調整，會產生修改上的不 便，例如當其中一個窗體大小變動時，必須手動調整周邊窗體的位置與大小以適應該變動，而此時，這種手工操作的調節(jié)方式不僅緩慢，而易于產生人為失誤，導致需作反復修正而拖長了設計周期，尤其是
對于復雜的用戶接口 ，更需要經過反復試驗和仔細調整才能達到設計 要求的效果，費吋費力，由此可見，該種效率低落的設計方式根本無 法滿足應用軟件的高速發(fā)展需求。
因此，如何提供一種可預先定義布局參數，使設計軟件自行布局 及調節(jié)，以提高應用程序接口設計人員的工作效率用戶接口設計系統(tǒng) 與方法，遂成為目前業(yè)界亟待解決的重要課題。

發(fā)明內容
鑒于上述現有技術的缺點，本發(fā)明的主要目的在于提供一種用戶 10接口設計系統(tǒng)與方法，其適用于用于構建用戶接口的應用程序，可預 先定義布局參數，使設計軟件自行布局及調節(jié)。
本發(fā)明的另一目的在于提供一種用戶接口設計系統(tǒng)與方法，從而 避免人為失誤，可提高應用程序接口設計人員的工作效率。
為達上述目的及其他相關目的，本發(fā)明提供一種用戶接口設計系 15 統(tǒng)及其方法。本發(fā)明用戶接口設計系統(tǒng)，搭載到用于構建用戶接口的 應用軟件中，其中，該用戶接口至少具有多個框體，該系統(tǒng)包括數 據庫，該數據庫用于儲存各框體的顯示格式信息及數據格式信息至第 一儲存區(qū)域，以及用于儲存各框體的布局規(guī)則至第二儲存區(qū)域；設定 模塊，該設定模塊用于設定各框體的顯示格式信息、數據格式信息以 20 及布局規(guī)則，并將設定的該顯示格式信息、該數據格式信息以及該布 局規(guī)則儲存至該數據庫；接口生成模塊，該接口生成模塊自該數據庫 的第一儲存區(qū)域獲取顯示格式信息以及數據格式信息，并依據該設定 模塊所設定的信息依次生成各框體；以及布局管理模塊，該布局管理 模塊于該接口生成模塊生成各框體時，依據該設定模塊設定的各框體 25 的布局規(guī)則予以布設，以構建該用戶接口。
本該用戶接口設計系統(tǒng)中，包括調整模塊，用于各框體布局完成 后，改變該多個框體其中之一的大小或寬高比率時，各框體依據該布 局規(guī)則調整相對位置關系，以供其整體層次形態(tài)不變。
本該用戶接口設計系統(tǒng)中，上述該顯示格式信息至少包括各框體 30 的顯示順序信息以及顯示功能信息。較佳地，該顯示順序信息為優(yōu)先 生成該框體的順序；該顯示功能信息至少包括按鈕、編輯框名稱或代號；該數據格式信息至少包括寬度及高度；該多個框體為東框體、南
框體、西框體以及北框體四個；該各框體的布局規(guī)則為，布設該北框
體或南框體吋，布設至該用戶接口的空白區(qū)域左、右兩邊緣，以及布 設該東框體或西框體吋，布設至該用戶接口的空白區(qū)域上、下兩邊緣，
5 以使該用戶接口剩余的區(qū)域成幾何形體，以便下一框體布設，且該布 局規(guī)則可重復使用。
通過本發(fā)明用戶接口設計系統(tǒng)執(zhí)行本發(fā)明用戶接口設計方法包括 以下步驟首先建立數據庫，該數據庫用于儲存各框體的顯示格式信 息及數據格式信息至第一儲存區(qū)域，以及用于儲存各框體的布局規(guī)則
10 至第二儲存區(qū)域；爾后設定各框體的顯示格式信息、數據格式信息以 及布局規(guī)則，并將設定的該顯示格式信息、該數據格式信息以及該布 局規(guī)則儲存至該數據庫；再自該數據庫的第一儲存區(qū)域獲取顯示格式 信息以及數據格式信息，并依據該設定的信息依次生成各框體；以及 最后于生成各框體時，依據該設定的各框體的布局規(guī)則予以布設，以
15 構建該用戶接口。
本該用戶接口設計方法中，包括調整歩驟，用于各框體布局完成 后，改變該多個框體其中之一的大小或寬高比率時，各框體依據該布 局規(guī)則調整相對位置關系，以供其整體層次形態(tài)不變。
本該用戶接口設計方法中，上述該顯示格式信息至少包括各框體
20的顯示順序信息以及顯示功能信息。較佳地，該顯示順序信息為優(yōu)先 生成該框體的順序；該顯示功能信息至少包括按鈕、編輯框名稱或代 號；該數據格式信息至少包括寬度及高度；該多個框體為東框體、南 框體、西框體以及北框體四個；該各框體的布局規(guī)則為，布設該北框 體或南框體時，布設至該用戶接口的空白區(qū)域左、右兩邊緣，以及布
25 設該東框體或西框體時，布設至該用戶接口的空白區(qū)域上、下兩邊緣， 以使該用戶接口剩余的區(qū)域成幾何形體，以便于下一框體布設，且該 布局規(guī)則可重復使用。
相比于現有技術，本發(fā)明用戶接口設計系統(tǒng)及其方法，通過預先 設定各框體的顯示格式信息、數據格式信息以及各框體的布局規(guī)則，
30 爾后依據該設定的顯示格式信息以及數據格式信息依次生成多個框
-體，最后依據該設定的各框體的布局規(guī)則予以布設，以構建該用戶接
口，如此，可避免人為失誤，提高應用程序接口設計人員的工作效率。


圖1顯示本發(fā)明用戶接口設計系統(tǒng)基本架構的方塊示意圖2顯示本發(fā)明用戶接口設計方法的操作流程示意圖；以及
圖3顯示本發(fā)明用戶接口設計系統(tǒng)及方法的數據庫的第一儲存區(qū) 域的欄位示意圖。
元件符號簡單說明 1應用軟件
ll用戶接口設計系統(tǒng)
111設定模塊
113數據庫
1131第一儲存區(qū)域
1133第二儲存區(qū)域
115接口生成模塊
117布局管理模塊
119 調整模塊
具體實施例方式
以下通過特定的具體實例說明本發(fā)明的實施方式，本領域的技術 人員可由本說明書所揭示內容輕易地了解本發(fā)明的其他優(yōu)點與功效。 本發(fā)明亦可通過其他不同的具體實例加以施行或應用，本說明書中的 各項細節(jié)亦可基于不同觀點與應用，在不背離本發(fā)明的精神下進行各種修飾與變更。
請參閱圖l，為方塊示意圖，其用于顯示本發(fā)明用戶接口設計系統(tǒng) 的基本架構。如圖所示，本發(fā)明用戶接口設計系統(tǒng)11，搭載到用于構 建用戶接口的應用軟件中1，其中，該用戶接口至少具有多個框體，本 實施例中，該多個框體為東框體、南框體、西框體以及北框體四個，該用戶接口設計系統(tǒng)11包括數據庫113、設定模塊111、接口生成模塊115以及布局管理模塊117。
請同時參閱圖3，如圖所示，該數據庫113包括有第一儲存區(qū)域1131以及第二儲存區(qū)域1133，本實施例中，該第一儲存區(qū)域1131用于儲存各框體的顯示格式信息及數據格式信息，其中，該顯示格式信 息至少包括各框體的顯示順序信息以及顯示功能信息，本實施例中，該顯示順序信息為優(yōu)先生成框體的順序，例如依次生成北框體、南框 體、東框體以及西框體；該顯示功能信息至少包括按鈕、編輯框名稱 或代號；該數據格式信息至少包括寬度及高度，用于定義該框體的大 小。該第二儲存區(qū)域1133用于儲存各框體的布局規(guī)則。
該設定模塊111用于設定各框體的顯示格式信息、數據格式信息以及布局規(guī)則，并將設定的該顯示格式信息、該數據格式信息以及該 布局規(guī)則儲存至該數據庫113，本實施例中，該布局規(guī)則為，布設該北 框體或南框體時，布設至該用戶接口的空白區(qū)域左、右兩邊緣，以及 布設該東框體或西框體時，布設至該用戶接口的空白區(qū)域上、下兩邊 緣，以使該用戶接口剩余的區(qū)域成幾何形體，以便于下一框體布設，且該布局規(guī)則可重復使用。
該接口生成模塊115自該數據庫113的第一儲存區(qū)域1131獲取顯 示格式信息以及數據格式信息，并依據該設定模塊111所設定的信息 依次生成各框體；具體而言，該框體依次生成順序為北框體、南框體、 東框體、西框體。
該布局管理模塊117該接口生成模塊115生成各框體時，依據該設定模塊111設定的各框體的布局規(guī)則予以布設，以構建該用戶接口。
該用戶接口設計系統(tǒng)11包括調整模塊119，用于各框體布局完成 后，改變該多個框體其中之一的大小或寬高比率時，各框體依據該布 局規(guī)則調整相對位置關系，以供其整體層次形態(tài)不變。具體而言，若 25 設計人員改動例如該北框體，系統(tǒng)即會依據預設定的各框體的相對位 置關系自動將南框體、東框體、西框體改動。
請參閱圖2，其為流程圖，用于顯示本發(fā)明用戶接口設計方法的基 本步驟。
首先執(zhí)行步驟Sl，建立數據庫，該數據庫用于儲存各框體的顯示 30格式信息及數據格式信息至第一儲存區(qū)域，以及用于儲存各框體的布 局規(guī)則至第二儲存區(qū)域；其中，該顯示格式信息系至少包括各框體的顯示順序信息以及顯示功能信息，本實施例中，該顯示順序信息為優(yōu) 先生成框體的順序，例如依次生成北框體、南框體、東框體以及西框 體；該顯示功能信息至少包括按鈕、編輯框名稱或代號；該數據格式 信息至少包括寬度及高度，用于定義該框體的大小。接著進行歩驟S2。
在步驟S2中，設定各框體的顯示格式信息、數據格式信息以及布
局規(guī)則，并將設定的該顯示格式信息、該數據格式信息以及該布局規(guī) 則儲存至該數據庫，本實施例中，該布局規(guī)則為，布設該北框體或南 框體時，布設至該用戶接口的空白區(qū)域左、右兩邊緣，以及布設該東 框體或西框體時，布設至該用戶接口的空白區(qū)域上、下兩邊緣，以使該用戶接口剩余的區(qū)域成幾何形體，以便于下一框體布設，且該布局
規(guī)則系可重復使用。接著進行步驟S3。
在步驟S3中，自該數據庫的第一儲存區(qū)域獲取顯示格式信息以及 數據格式信息，并依據該設定的信息依次生成各框體。具體而言，為 依次生成北框體、南框體、東框體以及西框體。接著進行步驟S4。
在步驟S4中，生成各框體時，依據該設定的各框體的布局規(guī)則予
以布設，以構建該用戶接口。
該用戶接口設計方法可包括調整步驟，用于各框體布局完成后， 改變該多個框體其中之一的大小或寬高比率時，各框體依據該布局規(guī) 則調整相對位置關系，以供其整體層次形態(tài)不變。
須注意的是，該些顯示格式信息以及數據格式信息的更改并非以
本實施例中所述為限。
綜上可知，本發(fā)明用戶接口設計系統(tǒng)與方法其特征在于通過預先
設定各框體的顯示格式信息、數據格式信息以及各框體的布局規(guī)則，
爾后依據該設定的顯示格式信息以及數據格式信息依次生成多個框體，最后依據該設定的各框體的布局規(guī)則予以布設，以構建該用戶接
口，如此，使設計軟件自行布局及調節(jié)，從而可提高應用程序接口設
計人員的工作效率，以避現有的技術的缺失。
上述實施例僅例示性說明本發(fā)明的原理及其功效，而非用于限制
本發(fā)明。任何本領域技術人員均可在不違背本發(fā)明的精神及范疇下， 對上述實施例進行修飾與改變。因此，本發(fā)明的權利保護范圍，應如
后面所述的權利要求所列。
權利要求
1. 一種用戶接口設計系統(tǒng)，搭載到用于構建用戶接口的應用軟件中，其中，該用戶接口至少具有多個框體，該系統(tǒng)包括數據庫，用于儲存各框體的顯示格式信息及數據格式信息至第一儲存區(qū)域，以及用于儲存各框體的布局規(guī)則至第二儲存區(qū)域；設定模塊，用于設定各框體的顯示格式信息、數據格式信息以及布局規(guī)則，并將設定的該顯示格式信息、該數據格式信息以及該布局規(guī)則儲存至該數據庫；接口生成模塊，從該數據庫的第一儲存區(qū)域獲取顯示格式信息以及數據格式信息，并依據該設定模塊所設定的信息依次生成各框體；以及布局管理模塊，于該接口生成模塊生成各框體時，依據該設定模塊設定的各框體的布局規(guī)則予以布設，以構建該用戶接口。
2. 根據權利要求1所述的用戶接口設計系統(tǒng)，進一步包括調整模塊，用于各框體布局完成后，改變該多個框體其中之一的大小或寬高 比率時，各框體依據該布局規(guī)則調整相對位置關系，以供其整體層次 形態(tài)不變。
3. 根據權利要求1所述的用戶接口設計系統(tǒng)，其中，該顯示格式 信息至少包括各框體的顯示順序信息以及顯示功能信息。
4. 根據權利要求2所述的用戶接口設計系統(tǒng)，其中，該顯示順序 25 信息為優(yōu)先生成該框體的順序。
5. 根據權利要求2所述的用戶接口設計系統(tǒng)，其中，該顯示功能 信息至少包括按鈕、編輯框名稱或代號。
6.根據權利要求1所述的用戶接口設計系統(tǒng)，其中，該數據格式信息至少包括寬度及高度。
7. 根據權利要求1所述的用戶接口設計系統(tǒng)，其中，該多個框體 為東框體、南框體、西框體以及北框體四個。
8. 根據權利要求1所述的用戶接口設計系統(tǒng)，其中，各框體的布 5 局規(guī)則為，布設該北框體或南框體時，布設至該用戶接口的空白區(qū)域左、右兩邊緣，以及布設該東框體或西框體時，布設至該用戶接口的 空白區(qū)域上、下兩邊緣，以使該用戶接口剩余的區(qū)域成幾何形體，以 便于下一框體布設。
9.根據權利要求8所述的用戶接口設計系統(tǒng)，其中，該布局規(guī)則可重復使用。
10. —種用戶接口設計方法，搭載到用于構建用戶接口的應用軟件中，其中，該用戶接口至少具有多個框體，該方法包括以下步驟 15 建立數據庫，該數據庫用于儲存各框體的顯示格式信息及數據格式信息至第一儲存區(qū)域，以及用于儲存各框體的布局規(guī)則至第二儲存 區(qū)域；設定各框體的顯示格式信息、數據格式信息以及布局規(guī)則，并將 設定的該顯示格式信息、該數據格式信息以及該布局規(guī)則儲存至該數 20 據庫；自該數據庫的第一儲存區(qū)域獲取顯示格式信息以及數據格式信 息，并依據該設定的信息依次生成各框體；以及生成各框體時，依據該設定的各框體的布局規(guī)則予以布設，以構 建該用戶接口。25
11. 根據權利要求10所述的用戶接口設計方法，進一步包括調整步驟，用于各框體布局完成后，改變該多個框體其中之一的大小或 寬高比率時，各框體依據該布局規(guī)則調整相對位置關系，以供其整體 層次形態(tài)不變。 3
12. 根據權利要求10所述的用戶接口設計方法，其中，該顯示 格式信息至少包括各框體的顯示順序信息以及顯示功能信息。
13. 根據權利要求12所述的用戶接口設計方法，其中，該顯示 5 順序信息為優(yōu)先生成該框體的順序。
14. 根據權利要求12所述的用戶接口設計方法，其中，該顯示功能信息至少包括按鈕、編輯框名稱或代號。
15.根據權利要求10所述的用戶接口設計方法，其中，該數據格式信息至少包括寬度及高度。
16. 根據權利要求10所述的用戶接口設計方法，其中，該多個框體為東框體、南框體、西框體以及北框體四個。
17. 根據權利要求10所述的用戶接口設計方法，其中，各框體 的布局規(guī)則為，布設該北框體或南框體時，布設至該用戶接口的空白 區(qū)域左、右兩邊緣，以及布設該東框體或西框體時，布設至該用戶接 口的空白區(qū)域上、下兩邊緣，以使該用戶接口剩余的區(qū)域成幾何形體， 以便于下一框體布設。
18.根據權利要求17所述的用戶接口設計方法，其中，該布局 則可重復使用。
全文摘要
一種用戶接口設計系統(tǒng)與方法，搭載到用于構建用戶接口的應用軟件中，其中，該用戶接口至少具有多個框體，該用戶接口設計方法包括以下步驟首先建立數據庫，該數據庫用于儲存各框體顯示格式信息及數據格式信息至第一儲存區(qū)域，以及用于儲存該框體的布局規(guī)則至第二儲存區(qū)域；爾后設定各框體的顯示格式信息、數據格式信息以及布局規(guī)則，并將設定的該顯示格式信息、該數據格式信息以及該布局規(guī)則儲存至該數據庫；再從該數據庫的第一儲存區(qū)域獲取顯示格式信息以及數據格式信息，并依據該設定的信息依次生成各框體；以及最后生成各框體時，依據該設定的各框體的布局規(guī)則予以布設，構建該用戶接口，從而提高應用程序接口設計人員工作效率。
文檔編號G06F9/44GK101206565SQ200610169278
公開日2008年6月25日 申請日期2006年12月21日 優(yōu)先權日2006年12月21日
發(fā)明者江慶端, 邱全成 申請人:英業(yè)達股份有限公司