專利名稱：定義交互式用戶界面的制作方法
技術(shù)領(lǐng)域：
本發(fā)明總體上涉及用于定義交互式計(jì)算機(jī)用戶界面的方法和系統(tǒng)。
背景技術(shù)：
交互式應(yīng)用通常具有由交互式元素(例如，按鈕)組成的用戶界面。交互式元素 通常具有對(duì)用戶動(dòng)作作出響應(yīng)的多種狀態(tài)。用戶可以使用指示設(shè)備，通常為計(jì)算機(jī)鼠標(biāo)，來(lái) 將指針放置在界面內(nèi)的不同位置處。響應(yīng)于諸如將鼠標(biāo)指針放置在交互式元素上方(滾置 (rollover))的用戶動(dòng)作，在鼠標(biāo)指針下方的交互式元素的不同圖形可以被顯示以指示交 互式元素的不同狀態(tài)。通常，在交互式界面內(nèi)的交互式元素可以與具有唯一一種狀態(tài)(普通(normal)) 或者兩種狀態(tài)(普通和滾置)一樣簡(jiǎn)單，或者可能與具有四種(普通、滾置、按下(pressed) 和禁用(disabled))或甚至更多狀態(tài)一樣復(fù)雜。交互式界面的作者可以將多個(gè)預(yù)定的功能 與任何已定義的元素相關(guān)聯(lián)。現(xiàn)今，交互式應(yīng)用通常由被稱為“切割和放置”的方法來(lái)構(gòu)建。首先，諸如
的圖形創(chuàng)建和編輯軟件被用來(lái)創(chuàng)作界面的整體外 觀和布局。通常通過(guò)從整體布局定義并切割元素，并且然后保存為單個(gè)文件，來(lái)為每一個(gè)單 個(gè)交互式元素的每一種狀態(tài)創(chuàng)建圖形。對(duì)于諸如按鈕的兩種狀態(tài)的元素，其典型地以普通 狀態(tài)來(lái)顯示，但是然后響應(yīng)于鼠標(biāo)位置以滾置狀態(tài)來(lái)顯示。作者在正確的幾何位置處手動(dòng) 創(chuàng)建并保存用于按鈕的滾置狀態(tài)的至少一個(gè)圖像以及包含按鈕的普通圖像的背景圖像。這 種方法在交互式界面很復(fù)雜時(shí)，諸如在期望多個(gè)交互式元素時(shí)，要求對(duì)大量圖形文件進(jìn)行 切割和放置。在某些情況下，對(duì)于包含多個(gè)具有多種狀態(tài)的元素的界面，要求創(chuàng)建的圖像的 數(shù)量“I”將是至少I = (EX(S-1))+1，其中‘ ”是在界面中的交互式元素的數(shù)量，以及“S” 是狀態(tài)的數(shù)量(假設(shè)所有的元素具有相同數(shù)量的狀態(tài))。其它情況要求為單個(gè)交互式元素 中的每一個(gè)的每一種狀態(tài)創(chuàng)建圖形。在這些其它情況下，作者必須創(chuàng)建并管理的圖形的數(shù) 量增加至I= (EXS)+1。構(gòu)建過(guò)程的第二步驟要求將所創(chuàng)建的圖像放置在其在界面內(nèi)的恰當(dāng)?shù)膸缀?位置處。為了創(chuàng)建最終的界面，作者通常將需要諸如Adobe Flash 或Microsoft
Visual Studio 的第二軟件應(yīng)用。使用這些工具，作者針對(duì)背景圖形為每一個(gè)交互式元素 的每一種狀態(tài)放置單個(gè)圖像，試圖將交互式元素的各個(gè)狀態(tài)圖像放置回元素在整體布局內(nèi) 的精確、原始位置中。當(dāng)在切割階段為每一個(gè)元素創(chuàng)建并保存單個(gè)圖形文件時(shí)，文件僅保留 其大小信息，而不保留其與從之切割元素的整體界面有關(guān)的位置信息。由于在文件中缺乏 固有的位置信息，所以作者必須對(duì)圖形的完成的、單個(gè)塊中的每一個(gè)進(jìn)行手動(dòng)排列以達(dá)到預(yù)期的樣子，通常要經(jīng)過(guò)多輪辛苦的試驗(yàn)。最后，用于每一個(gè)交互式元素的每一種狀態(tài)的圖形必須被組裝，并且被功能性定 義，使得預(yù)定的功能被分配給每一個(gè)元素的響應(yīng)于用戶輸入的每一種狀態(tài)。取決于輸出平 臺(tái)，定義可以發(fā)生在整體界面中重組元素層期間、或者作為單獨(dú)步驟發(fā)生。整個(gè)過(guò)程是費(fèi)時(shí) 的并且易于出錯(cuò)，使得“切割和放置”以及定義和重組效率低下并且耗損勞動(dòng)。如果作者稍 后決定改變用于一個(gè)或多個(gè)元素的一種或多種狀態(tài)的圖像，或者決定添加狀態(tài)，各個(gè)元素 的“切割和放置”以及定義和重組的整個(gè)過(guò)程必須被再次完整地執(zhí)行。

發(fā)明內(nèi)容
本發(fā)明提供了用于定義交互式用戶界面的系統(tǒng)，并且包括圖形用戶界面，其用于 輸入具有一種或多種狀態(tài)的交互式用戶界面的至少一個(gè)全屏圖形。至少一個(gè)全屏圖形中的 每一個(gè)可以與交互式用戶界面的一種狀態(tài)相關(guān)聯(lián)?？梢园ń换ナ綀D形工具，其用于定義 在交互式用戶界面內(nèi)的與在至少一個(gè)全屏圖形中的任何/每一個(gè)內(nèi)顯示的一個(gè)或多個(gè)交 互式元素中的任何/每一個(gè)相對(duì)應(yīng)的區(qū)域?？梢园〝?shù)據(jù)存儲(chǔ)設(shè)備，其用于存儲(chǔ)交互式用 戶界面的與一個(gè)或多個(gè)交互式元素中的每一個(gè)相對(duì)應(yīng)的已定義的區(qū)域的幾何特性和位置 信息。還可以包括輸出生成器，其用于自動(dòng)生成使一個(gè)或多個(gè)已定義的交互式元素中的每 一個(gè)的每一種狀態(tài)能夠被顯示的計(jì)算機(jī)可讀代碼或圖形。在本發(fā)明的一個(gè)方面中，用于一個(gè)或多個(gè)已定義的交互式元素中的每一個(gè)的每一 種狀態(tài)的代碼或圖形從為相應(yīng)狀態(tài)輸入的相應(yīng)全屏圖形以及從為相應(yīng)交互式元素定義并 存儲(chǔ)的幾何特性和位置信息生成。在另一個(gè)方面中，用于一個(gè)或多個(gè)已定義的交互式元素 中的每一個(gè)的每一種狀態(tài)的圖形與由為相應(yīng)交互式元素定義并存儲(chǔ)的幾何特性和位置信 息定界的為相應(yīng)狀態(tài)輸入的全屏圖形的部分相對(duì)應(yīng)。在又一個(gè)方面中，由輸出生成器生成的計(jì)算機(jī)可讀代碼使計(jì)算機(jī)能夠響應(yīng)于關(guān)于 相應(yīng)狀態(tài)和關(guān)于相應(yīng)交互式元素的用戶輸入，在交互式用戶界面內(nèi)的為相應(yīng)交互式元素定 義的區(qū)域中顯示一個(gè)或多個(gè)交互式元素中的每一個(gè)的每一種狀態(tài)。在該系統(tǒng)的某些實(shí)施例 中，交互式用戶界面在Web瀏覽器中顯示。本發(fā)明的系統(tǒng)還可以包括第二圖形工具，其用于定義至少一個(gè)全屏圖形中的每一 個(gè)與交互式用戶界面的一種狀態(tài)的關(guān)聯(lián)。還可以包括第三圖形工具，其用于將功能分配給 交互式元素中的每一個(gè)的每一種狀態(tài)。本發(fā)明還提供了至少部分由機(jī)器實(shí)現(xiàn)的用于定義交互式用戶界面的方法。該方 法可以包括以下步驟為交互式用戶界面的每一種狀態(tài)輸入交互式用戶界面的一個(gè)全屏圖 形，其中交互式用戶界面具有一種或多種狀態(tài)和一個(gè)或多個(gè)交互式元素；為一個(gè)或多個(gè)交 互式元素中的每一個(gè)定義在交互式用戶界面內(nèi)的區(qū)域；以及自動(dòng)生成使每一個(gè)交互式元素 的每一種狀態(tài)能夠被圖形顯示的計(jì)算機(jī)可讀代碼或圖形。在該方法的一個(gè)實(shí)施例中，又一個(gè)步驟將存儲(chǔ)交互式用戶界面的與一個(gè)或多個(gè)交互式元素中的每一個(gè)相對(duì)應(yīng)的已定義的區(qū)域的幾何特性和位置信息。在另一個(gè)實(shí)施例中， 用于一個(gè)或多個(gè)已定義的交互式元素中的每一個(gè)的每一種狀態(tài)的代碼或圖形從為相應(yīng)狀 態(tài)輸入的相應(yīng)全屏圖形以及從為相應(yīng)交互式元素定義并存儲(chǔ)的幾何特性和位置信息生成。 在又一個(gè)實(shí)施例中，用于一個(gè)或多個(gè)已定義的交互式元素中的每一個(gè)的每一種狀態(tài)的圖形與由為相應(yīng)交互式元素定義并存儲(chǔ)的幾何特性和位置信息定界的為相應(yīng)狀態(tài)輸入的全屏 圖形的部分相對(duì)應(yīng)。在本發(fā)明的一個(gè)方面中，所生成的計(jì)算機(jī)可讀代碼使計(jì)算機(jī)能夠響應(yīng)于關(guān)于相應(yīng) 狀態(tài)和關(guān)于相應(yīng)交互式元素的用戶輸入，在交互式用戶界面內(nèi)的為相應(yīng)交互式元素定義的 區(qū)域中顯示一個(gè)或多個(gè)交互式元素中的每一個(gè)的每一種狀態(tài)。在另一個(gè)方面中，交互式用 戶界面在web瀏覽器中顯示。在本發(fā)明的一個(gè)實(shí)施例中，進(jìn)一步編輯交互式用戶界面包括為待被添加或修訂的 每一個(gè)交互式元素定義在交互式用戶界面內(nèi)的區(qū)域，以及自動(dòng)生成使包括添加和修訂的交 互式元素的每一個(gè)交互式元素的每一種狀態(tài)能夠被圖 形顯示的計(jì)算機(jī)可讀代碼。在另一個(gè) 實(shí)施例中，對(duì)交互式用戶界面的進(jìn)一步編輯包括為交互式用戶界面的待被添加或修訂的每 一種狀態(tài)輸入交互式用戶界面的一個(gè)全屏圖形；從所存儲(chǔ)的與一個(gè)或多個(gè)交互式元素中的 每一個(gè)相對(duì)應(yīng)的幾何特性、位置信息檢索；以及自動(dòng)生成使每一個(gè)交互式元素的每一種狀 態(tài)能夠基于添加或修訂的全屏圖形被圖形顯示的計(jì)算機(jī)可讀代碼。本發(fā)明進(jìn)一步提供了至少部分由用于機(jī)器實(shí)現(xiàn)的定義交互式用戶界面的第二種 方法。在該方法中涉及為交互式用戶界面的每一種狀態(tài)輸入交互式用戶界面的一個(gè)全屏圖 形，其中交互式用戶界面具有一種或多種狀態(tài)和一個(gè)或多個(gè)交互式元素；為一個(gè)或多個(gè)交 互式元素中的每一個(gè)定義在交互式用戶界面內(nèi)的區(qū)域；以及為每一個(gè)交互式元素的每一種 狀態(tài)自動(dòng)生成單個(gè)圖形。在本發(fā)明的第二種方法的一個(gè)方面中，用于每一個(gè)交互式元素的每一種狀態(tài)的單 個(gè)圖形從用于相應(yīng)狀態(tài)的全屏圖形以及從為相應(yīng)交互式元素定義的區(qū)域生成。在另一個(gè)方 面中，用于每一個(gè)交互式元素的每一種狀態(tài)的單個(gè)圖形為由為相應(yīng)交互式元素定義的區(qū)域 定界的用于相應(yīng)狀態(tài)的全屏圖形的部分。該第二種方法的一個(gè)實(shí)施例進(jìn)一步涉及存儲(chǔ)交互式用戶界面的與一個(gè)或多個(gè)交 互式元素中的每一個(gè)相對(duì)應(yīng)的已定義的區(qū)域的幾何特性和位置信息。在另一個(gè)實(shí)施例中， 該方法進(jìn)一步包括創(chuàng)建交互式用戶界面的計(jì)算機(jī)可讀代碼，其使計(jì)算機(jī)在交互式用戶界面 內(nèi)的為相應(yīng)交互式元素定義的區(qū)域中并且響應(yīng)于關(guān)于相應(yīng)狀態(tài)的用戶輸入，顯示每一個(gè)單 個(gè)圖形。


參考與附圖相結(jié)合來(lái)考慮的下列描述將更好地理解本發(fā)明圖1圖示了在其中可以實(shí)現(xiàn)本發(fā)明的示例計(jì)算環(huán)境；圖2圖示了根據(jù)本發(fā)明的一個(gè)實(shí)施例的在系統(tǒng)存儲(chǔ)器中的本發(fā)明的組件的示例；圖3圖示了根據(jù)本發(fā)明的一個(gè)實(shí)施例的存儲(chǔ)在非易失性計(jì)算機(jī)可讀介質(zhì)上的本 發(fā)明的組件的示例；圖4是圖示了本發(fā)明的方法步驟的各方面的流程圖；圖5A和5B圖示了 “切割和放置”方法的示例；圖6A和6B示出了根據(jù)本發(fā)明的一個(gè)方面的兩個(gè)示例全屏圖形，其被用作為輸入 以生成與在圖5A和5B中示出的交互式元素相同的交互式元素；圖7示出了處于設(shè)計(jì)模式(Design Mode)的本發(fā)明的一個(gè)實(shí)施例的示例圖形界面；以及圖8A和8B示出了處于預(yù)覽模式(Preview Mode)的本發(fā)明的一個(gè)實(shí)施例的示例圖形界面。
具體實(shí)施例方式示例計(jì)算環(huán)境圖1和下列論述意在提供對(duì)適當(dāng)?shù)挠?jì)算環(huán)境的簡(jiǎn)要描述，在該適當(dāng)?shù)挠?jì)算環(huán)境中 可以實(shí)現(xiàn)本發(fā)明的示例實(shí)施例。然而，應(yīng)當(dāng)理解，將手持式、便攜式以及所有種類的其它計(jì) 算設(shè)備與本發(fā)明結(jié)合使用是預(yù)期的。雖然在下面描述了通用計(jì)算機(jī)，但是只是一個(gè)示例。本 發(fā)明在具有網(wǎng)絡(luò)服務(wù)器互操作性和交互性的瘦客戶端上也可以是可操作的。因而，本發(fā)明 的示例實(shí)施例可以在聯(lián)網(wǎng)的托管的服務(wù)的環(huán)境中實(shí)現(xiàn)，在所述環(huán)境中涉及非常少或最少的 客戶端資源，例如在其中客戶端設(shè)備僅用作為瀏覽器或至萬(wàn)維網(wǎng)的接口的聯(lián)網(wǎng)的環(huán)境。盡管非必需，但是本發(fā)明可以經(jīng)由應(yīng)用程序接口(API)來(lái)實(shí)現(xiàn)，用于由開發(fā)者或 測(cè)試者使用，和/或被包括在由一個(gè)或多個(gè)計(jì)算機(jī)(例如，客戶端工作站、服務(wù)器或其它設(shè) 備)執(zhí)行的網(wǎng)絡(luò)瀏覽軟件內(nèi)，所述網(wǎng)絡(luò)瀏覽軟件將在諸如程序模塊的計(jì)算機(jī)可執(zhí)行的指令 的通用環(huán)境中來(lái)描述。通常，程序模塊包括執(zhí)行特定任務(wù)或?qū)崿F(xiàn)特定抽象數(shù)據(jù)類型的例行 程序、程序、對(duì)象、組件、數(shù)據(jù)結(jié)構(gòu)等。典型地，程序模塊的功能可以在各個(gè)實(shí)施例中按需被 組合或分布。此外，本領(lǐng)域技術(shù)人員將會(huì)理解，本發(fā)明可以利用其它計(jì)算機(jī)系統(tǒng)配置實(shí)踐。 可能適于與本發(fā)明一起使用的其它眾所周知的計(jì)算系統(tǒng)、環(huán)境和/或配置包括但不限于個(gè) 人計(jì)算機(jī)(PC)、服務(wù)器計(jì)算機(jī)、手持式或膝上型設(shè)備、多處理器系統(tǒng)、基于微處理器的系統(tǒng)、 可編程消費(fèi)電子產(chǎn)品、網(wǎng)絡(luò)PC、小型計(jì)算機(jī)、大型計(jì)算機(jī)等。本發(fā)明的實(shí)施例還可以在分布 式計(jì)算環(huán)境中實(shí)踐，其中任務(wù)由通過(guò)通信網(wǎng)絡(luò)或其它數(shù)據(jù)傳輸介質(zhì)鏈接的遠(yuǎn)程處理設(shè)備來(lái) 執(zhí)行。在分布式計(jì)算環(huán)境中，程序模塊可以位于包括記憶存儲(chǔ)設(shè)備的本地和遠(yuǎn)程計(jì)算機(jī)存 儲(chǔ)介質(zhì)兩者中。因此，圖1圖示了在其中可以實(shí)現(xiàn)本發(fā)明的適當(dāng)?shù)挠?jì)算系統(tǒng)環(huán)境100的示例，然而 如上面所解釋的，計(jì)算系統(tǒng)環(huán)境100僅是適當(dāng)?shù)挠?jì)算環(huán)境的一個(gè)示例，并且并不意在暗示 關(guān)于本發(fā)明的使用或功能的范圍的任何限制。不應(yīng)當(dāng)將計(jì)算環(huán)境100解釋為具有與在示例 操作環(huán)境100中圖示的組件的任何一個(gè)或組合有關(guān)的任何依賴或要求。參考圖1，用于實(shí)現(xiàn)本發(fā)明的示例系統(tǒng)包括以計(jì)算機(jī)110的形式的通用計(jì)算設(shè)備。 計(jì)算機(jī)110的組件可以包括但不限于處理單元120、系統(tǒng)存儲(chǔ)器130以及將包括系統(tǒng)存儲(chǔ) 器的各種系統(tǒng)組件耦接到處理單元120的系統(tǒng)總線121。系統(tǒng)總線121可以是包括使用多 種總線架構(gòu)中的任何總線架構(gòu)的存儲(chǔ)器總線或存儲(chǔ)器控制器、外圍總線以及本地總線的數(shù) 種類型的總線結(jié)構(gòu)中的任何總線結(jié)構(gòu)。作為示例而非限制，這樣的架構(gòu)包括工業(yè)標(biāo)準(zhǔn)架構(gòu) (ISA)總線、微通道架構(gòu)(MCA)總線、增強(qiáng)型ISA(EISA)總線、視頻電子標(biāo)準(zhǔn)協(xié)會(huì)(VESA)本 地總線、外圍組件互連(PCI)總線(也被稱為夾層總線)以及PCI-Express總線。計(jì)算機(jī)110典型地包括多種計(jì)算機(jī)可讀介質(zhì)。計(jì)算機(jī)可讀介質(zhì)可以是可以由計(jì)算機(jī)110訪問(wèn)的任何可用的介質(zhì)，并且包括易失性和非易失性、可移動(dòng)和不可移動(dòng)介質(zhì)。作 為示例而非限制，計(jì)算機(jī)可讀介質(zhì)可以包括計(jì)算機(jī)存儲(chǔ)介質(zhì)和通信介質(zhì)。計(jì)算機(jī)存儲(chǔ)介質(zhì) 包括以用于存儲(chǔ)諸如計(jì)算機(jī)可讀指令、數(shù)據(jù)結(jié)構(gòu)、程序模塊或其它數(shù)據(jù)的信息的任何方法或技術(shù)來(lái)實(shí)現(xiàn)的易失性和非易失性、可移動(dòng)和不可移動(dòng)介質(zhì)。計(jì)算機(jī)存儲(chǔ)介質(zhì)包括但不限于隨機(jī)存取存儲(chǔ)器(RAM)、只讀存儲(chǔ)器(ROM)、電可擦除可編程只讀存儲(chǔ)器(EEPROM)、閃存 或其它存儲(chǔ)器技術(shù)、光盤只讀存儲(chǔ)器(CDROM)、數(shù)字多功能盤(DVD)或其它光盤存儲(chǔ)、盒式 磁帶、磁帶、磁盤存儲(chǔ)或其它磁存儲(chǔ)設(shè)備、或可以被用來(lái)存儲(chǔ)期望的信息并且可以由計(jì)算機(jī) 110訪問(wèn)的任何其它介質(zhì)。通信介質(zhì)典型地包括計(jì)算機(jī)可讀指令、數(shù)據(jù)結(jié)構(gòu)、程序模塊或 以諸如載波或其它傳輸機(jī)制的調(diào)制的數(shù)據(jù)信號(hào)形式的其它數(shù)據(jù)，并且包括任何信息遞送介 質(zhì)。術(shù)語(yǔ)“調(diào)制的數(shù)據(jù)信號(hào)”是指具有以將信息編碼在信號(hào)中這樣的方式來(lái)設(shè)置或改變的 其特征中的一個(gè)或多個(gè)的信號(hào)。作為示例而非限制，通信介質(zhì)包括諸如有線網(wǎng)絡(luò)或直接有 線連接的有線介質(zhì)、以及諸如聲學(xué)、射頻(RF)、紅外線和其它無(wú)線介質(zhì)的無(wú)線介質(zhì)。任何上 述的組合也應(yīng)當(dāng)被包括在計(jì)算機(jī)可讀介質(zhì)的范圍內(nèi)。系統(tǒng)存儲(chǔ)器130包括以諸如ROM 131和RAM 132的易失性和/或非易失性存儲(chǔ)器 形式的計(jì)算機(jī)存儲(chǔ)介質(zhì)。包含諸如在啟動(dòng)期間幫助在計(jì)算機(jī)110內(nèi)的元件之間傳送信息的 基本例行程序的基本輸入/輸出系統(tǒng)133 (BIOS)被典型地存儲(chǔ)在ROM 131中。RAM 132典 型地包含對(duì)處理單元120來(lái)說(shuō)可立即訪問(wèn)的和/或處理單元120目前正在其上操作的數(shù)據(jù) 和/或程序模塊。作為示例而非限制，圖1圖示了操作系統(tǒng)134、應(yīng)用程序135、其它程序模 塊136以及程序數(shù)據(jù)137。RAM 132可以包含其它數(shù)據(jù)和/或程序模塊。計(jì)算機(jī)110還可以包括其它可移動(dòng)/不可移動(dòng)、易失性/非易失性計(jì)算機(jī)存儲(chǔ)介 質(zhì)。僅作為示例，圖1圖示了讀寫不可移動(dòng)、非易失性磁介質(zhì)的硬盤驅(qū)動(dòng)器141、讀寫可移 動(dòng)、非易失性磁盤152的磁盤驅(qū)動(dòng)器151、以及讀寫諸如CD ROM或其它光介質(zhì)的可移動(dòng)、非 易失性光盤156的光盤驅(qū)動(dòng)器155?？梢栽谑纠僮鳝h(huán)境中使用的其它可移動(dòng)/不可移動(dòng)、 易失性/非易失性計(jì)算機(jī)存儲(chǔ)介質(zhì)包括但不限于磁帶盒、閃存卡、數(shù)字多功能盤、數(shù)字視頻 帶、固態(tài)RAM、固態(tài)ROM等。硬盤驅(qū)動(dòng)器141典型地通過(guò)諸如接口 140的不可移動(dòng)存儲(chǔ)器接 口被連接到系統(tǒng)總線121，以及磁盤驅(qū)動(dòng)器151和光盤驅(qū)動(dòng)器155典型地經(jīng)由諸如接口 150 的可移動(dòng)存儲(chǔ)器接口被連接到系統(tǒng)總線121。在上面論述的以及在圖1中圖示的驅(qū)動(dòng)器和其相關(guān)聯(lián)的計(jì)算機(jī)存儲(chǔ)介質(zhì)提供了 對(duì)用于計(jì)算機(jī)110的計(jì)算機(jī)可讀指令、數(shù)據(jù)結(jié)構(gòu)、程序模塊以及其它數(shù)據(jù)的存儲(chǔ)。例如，在 圖1中，硬盤驅(qū)動(dòng)器141被圖示為存儲(chǔ)操作系統(tǒng)144、應(yīng)用程序145、其它程序模塊146以及 程序數(shù)據(jù)147。注意到，這些組件可以同于或異于操作系統(tǒng)134、應(yīng)用程序135、其它程序模 塊136以及程序數(shù)據(jù)137。操作系統(tǒng)144、應(yīng)用程序145、其它程序模塊146以及程序數(shù)據(jù) 147在此被給予不同的數(shù)字以說(shuō)明至少其為不同的副本。用戶可以通過(guò)輸入設(shè)備將命令和 信息輸入到計(jì)算機(jī)110中，所述輸入設(shè)備諸如鍵盤162和通常被認(rèn)為是鼠標(biāo)、跟蹤球或觸摸 板的指示設(shè)備161。其它輸入設(shè)備(未示出)可以包括麥克風(fēng)、操縱桿、游戲墊、衛(wèi)星天線、 掃描儀等。這些和其它輸入設(shè)備通常通過(guò)被耦接到系統(tǒng)總線121的用戶輸入接口 160被連 接到處理單元120，但是可以由諸如并行端口、游戲端口或通用串行總線(USB)的其它接口 和總線結(jié)構(gòu)連接。監(jiān)視器191或其它類型的顯示設(shè)備經(jīng)由諸如視頻接口 190的接口也被連接到系統(tǒng) 總線121。除監(jiān)視器191外，計(jì)算機(jī)還可以包括諸如揚(yáng)聲器和打印機(jī)(未示出)的其它外圍 輸出設(shè)備，其可以通過(guò)輸出外圍接口 195連接。使用到諸如遠(yuǎn)程計(jì)算機(jī)180的一個(gè)或多個(gè)遠(yuǎn)程計(jì)算機(jī)的邏輯連接，計(jì)算機(jī)110可以在聯(lián)網(wǎng)的環(huán)境中操作。遠(yuǎn)程計(jì)算機(jī)180可以是個(gè)人計(jì)算機(jī)、服務(wù)器、路由器、網(wǎng)絡(luò)PC、對(duì)等設(shè)備或其它常見的網(wǎng)絡(luò)節(jié)點(diǎn)，并且典型地包括在上面關(guān)于計(jì)算機(jī)110描述的許多或所 有元件，盡管在圖1中僅圖示了記憶存儲(chǔ)設(shè)備181。在圖1中描述的邏輯連接包括局域網(wǎng) (LAN) 171和廣域網(wǎng)(WAN) 173，但是還可以包括其它網(wǎng)絡(luò)。這樣的網(wǎng)絡(luò)環(huán)境在辦公室、企業(yè) 范圍的計(jì)算機(jī)網(wǎng)絡(luò)、內(nèi)聯(lián)網(wǎng)和因特網(wǎng)中是常見的。當(dāng)在LAN網(wǎng)絡(luò)環(huán)境中被使用時(shí)，計(jì)算機(jī)110通過(guò)網(wǎng)絡(luò)接口或適配器170被連接到 LAN 171。當(dāng)在WAN網(wǎng)絡(luò)環(huán)境中被使用時(shí)，計(jì)算機(jī)110典型地包括用于在諸如因特網(wǎng)的WAN 173上建立通信的裝置。在聯(lián)網(wǎng)的環(huán)境中，關(guān)于計(jì)算機(jī)110描述的程序模塊或其部分可以被 存儲(chǔ)在遠(yuǎn)程記憶存儲(chǔ)設(shè)備中。作為示例而非限制，圖1將遠(yuǎn)程應(yīng)用程序185圖示為駐存于 記憶設(shè)備181上。遠(yuǎn)程應(yīng)用程序185包括但不限于諸如Microsoft 因特網(wǎng)信息服務(wù)(IIS) 和Apache HTTP服務(wù)器的web服務(wù)器應(yīng)用，其將駐存于遠(yuǎn)程存儲(chǔ)設(shè)備181或其它可訪問(wèn)的 存儲(chǔ)設(shè)備上的內(nèi)容提供給萬(wàn)維網(wǎng)。將理解的是，所示出的網(wǎng)絡(luò)連接是示例性的，并且建立計(jì) 算機(jī)間的通信鏈接的其它裝置可以被使用。本領(lǐng)域技術(shù)人員能夠理解的是，計(jì)算機(jī)110或其它客戶端設(shè)備可以被部署為計(jì)算 機(jī)網(wǎng)絡(luò)的部分。從這點(diǎn)上說(shuō)，本發(fā)明適合具有下述的任何計(jì)算機(jī)系統(tǒng)任何數(shù)量的存儲(chǔ)器或 存儲(chǔ)單元以及跨任何數(shù)量的存儲(chǔ)單元或容量存在的任何數(shù)量的應(yīng)用和過(guò)程。本發(fā)明的實(shí)施 例可以應(yīng)用于帶有被部署在網(wǎng)絡(luò)環(huán)境中、具有遠(yuǎn)程或本地存儲(chǔ)的服務(wù)器計(jì)算機(jī)和客戶端計(jì) 算機(jī)的環(huán)境。本發(fā)明還可以應(yīng)用于具有編程語(yǔ)言功能、解釋和執(zhí)行能力的獨(dú)立計(jì)算設(shè)備。本發(fā)明本發(fā)明的正討論的界面定義軟件(雕刻站(Carving Station))通過(guò)獨(dú)特地組織 信息并且使定義交互式用戶界面的大部分過(guò)程自動(dòng)化引入了一種創(chuàng)建交互式應(yīng)用的新穎 方法。本發(fā)明的自動(dòng)化過(guò)程可以為任何平臺(tái)進(jìn)行定制。在優(yōu)選實(shí)施例中，雕刻站提供了用 于交互式界面的創(chuàng)作的設(shè)計(jì)模式，以及用于已創(chuàng)建的交互式界面的可視化和確認(rèn)的預(yù)覽模 式。圖2圖示了在本發(fā)明的一個(gè)實(shí)施例的系統(tǒng)存儲(chǔ)器130中的雕刻站的組件。在該實(shí) 施例中，雕刻站210作為應(yīng)用程序135中的一個(gè)駐存于系統(tǒng)存儲(chǔ)器130中。圖形用戶界面 組件211被提供用于輸入圖形，以及圖形工具212被提供用于定義交互式元素。最后，代碼 生成器213被提供用于生成輸出代碼和圖形。諸如可視化程序220的其它程序模塊136被 提供用于創(chuàng)作的可視化和確認(rèn)，如果需要的話。程序數(shù)據(jù)137包括但不限于輸入圖形230、 已定義的交互式元素的尺寸和位置數(shù)據(jù)(雕刻幾何)240、背景圖形250以及輸出元素圖形 260，如果所選擇的輸出平臺(tái)需要的話。圖3例示了存儲(chǔ)在諸如硬盤的非易失性計(jì)算機(jī)可讀介質(zhì)設(shè)備141上的雕刻站的組 件的一個(gè)實(shí)施例。雕刻站程序310和其組件(用于輸入圖形的圖形用戶界面311、用于定義 交互式元素的圖形工具312以及用于輸出代碼或圖形的代碼生成器313)作為應(yīng)用程序145 被存儲(chǔ)在計(jì)算機(jī)可讀介質(zhì)141上，并且可以在運(yùn)行期間被讀入系統(tǒng)存儲(chǔ)器130中。計(jì)算機(jī)可 讀介質(zhì)還可以包含其它程序模塊146，諸如用于創(chuàng)作的可視化和確認(rèn)的可視化程序320的 副本。程序數(shù)據(jù)147包括但不限于輸入圖形330、關(guān)于已定義的元素的尺寸和位置數(shù)據(jù)(雕 刻幾何)340、背景圖形350以及關(guān)于交互式元素的圖形360，如果輸出平臺(tái)需要的話。圖4圖示了本發(fā)明的方法步驟的各方面的流程圖。在本發(fā)明的通用平臺(tái)的實(shí)施例中，用于定義交互式用戶界面的計(jì)算機(jī)化方法包括為交互式用戶界面的每一種狀態(tài)輸入交 互式用戶界面的一個(gè)全屏圖形410，為一個(gè)或多個(gè)交互式元素中的每一個(gè)定義在交互式用 戶界面內(nèi)的區(qū)域420以及自動(dòng)生成使每一個(gè)交互式元素的每一種狀態(tài)能夠被圖形顯示的 特定于平臺(tái)的計(jì)算機(jī)可讀代碼430。此外，編輯已定義的交互式用戶界面涉及為已定義的交 互式用戶界面的待被修訂442或添加444的每一種狀態(tài)輸入交互式用戶界面的一個(gè)全屏圖 形，為待被添加或修訂的每一個(gè)交互式元素定義在交互式用戶界面內(nèi)的區(qū)域420 ；以及自 動(dòng)生成使每一個(gè)交互式元素的每一種狀態(tài)能夠被圖形顯示的計(jì)算機(jī)可讀代碼430。更具體地，作者首先決定交互式用戶界面的布局，包括關(guān)于交互式元素的狀態(tài)的 數(shù)量。作者為每一種狀態(tài)輸入一個(gè)全屏圖形410，其中一個(gè)全屏圖形包含以各種狀態(tài)顯示 的所有交互式元素，而不是如通常所做的為每一個(gè)元素的每一種狀態(tài)輸入單個(gè)圖形。例如， 對(duì)于滾置狀態(tài)，作者輸入唯一一個(gè)全屏圖形，其中該一個(gè)全屏圖形以每一個(gè)交互式元素的 滾置狀態(tài)來(lái)示出每一個(gè)交互式元素。如在此所使用的，全屏圖形可以指占據(jù)交互式界面的 整個(gè)預(yù)期的顯示區(qū)域的圖形，或者指交互式元素將駐存于其中的交互式界面的一部分的圖 形。因此，作者必須創(chuàng)建的圖像的數(shù)量等于狀態(tài)的數(shù)量，I = E0因而，本發(fā)明極大地減 少了諸如圖形和位置信息的作者必須供給并管理的單個(gè)數(shù)據(jù)點(diǎn)的數(shù)量。圖5A和5B圖示了 現(xiàn)有技術(shù)“切割和放置”方法的示例。對(duì)于具有五個(gè)兩種狀態(tài)的按鈕的界面，必須創(chuàng)建總計(jì) 11個(gè)單個(gè)圖形(對(duì)于普通狀態(tài)510，五個(gè)按鈕中的每一個(gè)一個(gè)圖形(圖5A)、對(duì)于滾置狀態(tài) 520，五個(gè)按鈕中的每一個(gè)一個(gè)圖形(圖1A)、以及一個(gè)背景圖形530(圖5B))。圖6A和6B 圖示了在本發(fā)明中由作者輸入來(lái)生成在圖5A和5B中示出的相同的五個(gè)按鈕兩種狀態(tài)界面 的兩個(gè)圖像。使用雕刻站，作者為普通狀態(tài)輸入唯一一個(gè)全屏圖形620，其以所有元素的普 通狀態(tài)示出所有元素610 (圖6A)，以及為滾置狀態(tài)輸入一個(gè)全屏圖形640，其以所有元素的 滾置狀態(tài)示出所有元素630 (圖6B)。現(xiàn)參見圖7，雕刻站以設(shè)計(jì)模式730提供了用于輸入圖形的圖形用戶界面311。作者將每一個(gè)創(chuàng)建的全屏圖形輸入到雕刻站中，并且將圖形分配給其相對(duì)應(yīng)的狀態(tài)410。圖 7圖示了處于設(shè)計(jì)模式730的本發(fā)明的優(yōu)選實(shí)施例710的圖形用戶界面的截屏。在圖7的 實(shí)施例中，雕刻站710是獨(dú)立的Windows應(yīng)用，但是本發(fā)明可以適于其它應(yīng)用，或者作為諸 如 Adobe Photoshop 、Flash 或Microsoft Visual Studio 的更大的軟件包的組件。 如所示，界面向作者提供選項(xiàng)來(lái)在設(shè)計(jì)模式730和預(yù)覽模式830之間選擇(圖8A和8B)。 作者還可以指定關(guān)于源藝術(shù)(Source Art) 750的位置，其中可以定位全屏圖形(輸入圖形 330)。可以將用于每一個(gè)全屏圖形的文件名輸入到用于每一個(gè)各個(gè)層760的相對(duì)應(yīng)的空間 中(每一個(gè)所包括的狀態(tài)表示一個(gè)層)。全屏圖形在顯示區(qū)域790中被顯示為層。在本發(fā) 明的一個(gè)實(shí)施例中，雕刻站710提供了四個(gè)狀態(tài)層(普通、鼠標(biāo)懸停(即滾置)、按下和禁 用)。在圖7中所示的示例中，只有兩種狀態(tài)被使用(普通和鼠標(biāo)懸停)，而未使用的狀態(tài) 保持空白。作者還可以為輸出文件760的集合指定位置，諸如存儲(chǔ)到儲(chǔ)存庫(kù)；文件系統(tǒng)； Oracle 數(shù)據(jù)庫(kù)；SQL Server數(shù)據(jù)庫(kù)；以及Microsoft 內(nèi)容管理服務(wù)器?？梢允馆敵鑫募?760與各種格式相兼容，諸如Adobe Flash Movie ；PowerPoint .文件；HTML頁(yè)；以及 Microsoft Sharepoint 服務(wù)器；等。作為在本發(fā)明的設(shè)計(jì)過(guò)程中的最后創(chuàng)作步驟，作者使用由雕刻站提供的工具212來(lái)圖形地識(shí)別在全屏圖形上的與期望的單個(gè)交互式元素相對(duì)應(yīng)的區(qū)域420。在圖7的示例 中，單個(gè)元素被定義為矩形780。被選擇來(lái)定義交互式元素的區(qū)域(熱點(diǎn)(Hot Spot))以不 同的顏色突出770。每一個(gè)熱點(diǎn)被分配一個(gè)名稱，并且在列表740中顯示。用于所有狀態(tài) (或?qū)?的所有交互式元素被同時(shí)定義。每一個(gè)交互式元素相對(duì)于全屏圖形的大小和位置 信息(雕刻幾何)240為表示每一個(gè)交互式元素的幾何區(qū)域的定義所固有，并且在由作者定 義時(shí)被記錄并保存。因此，消除了在外部保留位置信息的慣常需求，以及對(duì)通過(guò)反復(fù)試驗(yàn)手 動(dòng)放置(或更替)元素的需要。在交互式界面定義過(guò)程期間的任何時(shí)候，作者可以將整個(gè)創(chuàng)作定義并保存426到 計(jì)算機(jī)可讀介質(zhì)147，包括所有圖形以及交互式元素的所有位置和大小信息。用于交互式元 素的每一個(gè)的每一種狀態(tài)的功能可以在元素定義期間被分配，或者作為在稍后時(shí)間的單獨(dú) 步驟424。如果作者稍后希望改變狀態(tài)的樣子，則作者需要做的所有事是輸入合并期望的改 變的全屏圖形442、更替與各種狀態(tài)相關(guān)聯(lián)的原始圖形760。本發(fā)明然后檢測(cè)到源圖形已改 變并且自動(dòng)更新創(chuàng)作。作者然后可以存儲(chǔ)更新的創(chuàng)作。如果作者希望將狀態(tài)添加到已定義 的界面，則作者只是為作者意欲添加的每一種狀態(tài)輸入一個(gè)全屏圖形444，并且將各個(gè)全屏 圖形與適當(dāng)?shù)臓顟B(tài)相關(guān)聯(lián)760。如果作者希望添加交互式元素，則作者只是為待被添加的交 互式元素識(shí)別在全屏圖形上的區(qū)域420。名稱被分配給新近添加的元素740，并且添加的交 互式元素的大小和位置信息被自動(dòng)地記錄并保存426。因此，不需要供給、管理以及放置大 量的圖形，或者不需要定義并重組在交互式用戶界面中的每個(gè)元素層。由于本發(fā)明的設(shè)計(jì) 過(guò)程是獨(dú)立于平臺(tái)的，所以作者只需致力于界面的美學(xué)，而不需關(guān)注特定于平臺(tái)的編碼。預(yù)覽模式830 (圖8A和8B)使作者能夠可視并確認(rèn)所設(shè)計(jì)的交互式界面440。在 優(yōu)選實(shí)施例中，特定平臺(tái)由作者在設(shè)計(jì)過(guò)程的初始選擇。在預(yù)覽模式被選擇時(shí)830，雕刻站 使用尺寸和位置信息(雕刻幾何)240和所供給的源圖形230來(lái)自動(dòng)生成特定于所選擇的 平臺(tái)的圖形和代碼430。由作者設(shè)計(jì)的交互式界面作為用于預(yù)期的交互式界面發(fā)布的平 臺(tái)的本原代碼被預(yù)覽。例如，如果作者選擇將最終交互式界面作為正規(guī)網(wǎng)頁(yè)發(fā)布，則雕刻 站將為單個(gè)交互式元素自動(dòng)生成圖形。由于創(chuàng)作保留元素圖形的位置和大小信息兩者，所 以雕刻站然后可以自動(dòng)生成引用包含各個(gè)交互式元素的正確布局的圖形的HTML文件。不 需要作者手動(dòng)輸入或調(diào)整位置信息。在一個(gè)實(shí)施例中，用于所選擇的平臺(tái)的適當(dāng)?shù)牟榭雌?的實(shí)例在雕刻站預(yù)覽窗口內(nèi)被調(diào)用。在HTML網(wǎng)頁(yè)的示例中，Internet Explorer Web瀏 覽器控件被使用。雕刻站可以在不對(duì)設(shè)計(jì)過(guò)程作任何變更的情況下容易地輸出符合諸如 Microsoft · NET、PowerPoint 以及Adobe Flash 的其它平臺(tái)的交互式界面。在作者 對(duì)所設(shè)計(jì)的交互式界面感到滿意時(shí)，作者可以指示雕刻站“發(fā)布”交互式界面450。所有對(duì) 應(yīng)的圖形和代碼由雕刻站自動(dòng)生成并且被存儲(chǔ)在諸如儲(chǔ)存庫(kù)目錄720的作者定義的輸出 目的地中。圖8A和8B圖示了處于預(yù)覽模式830的雕刻站710的截屏。在圖8A和8B圖示 中，在圖7中創(chuàng)建并示出的交互式界面在預(yù)覽區(qū)域870中被顯示。預(yù)覽模式830的兩個(gè)視 圖(分別為圖8A和8B)被示出來(lái)說(shuō)明由作者定義的交互性。在圖8A中，鼠標(biāo)指針850被 放置在第一元素的上方，以及第一按鈕以滾置狀態(tài)840顯示，而余下的元素仍然以普通狀 態(tài)860顯示。在圖8B中，鼠標(biāo)指針850被放置在第二元素的上方，以及第二元素以滾置狀 態(tài)840顯示，而第一、第三、第四和第五元素以普通狀態(tài)860顯示。
在優(yōu)選實(shí)施例中，這樣的顯示在作者完成兩個(gè)步驟創(chuàng)建過(guò)程后(即，在作者為每 一個(gè)期望的狀態(tài)創(chuàng)建全屏圖形后，并且在幾何識(shí)別每一個(gè)交互式元素后)由文件創(chuàng)建的 自動(dòng)化操作生成。在作者為每一種狀態(tài)輸入全屏圖形，并且作者為每一個(gè)交互式元素定義 (識(shí)別)位置信息后，雕刻站為每一個(gè)元素的每一種狀態(tài)自動(dòng)生成圖像文件。因此，雕刻站 自動(dòng)生成多個(gè)圖像，并且記錄各個(gè)位置信息，這些曾經(jīng)由用戶通過(guò)“切割和放置”過(guò)程來(lái)辛 苦地創(chuàng)建。例如，在圖5A和5B示例中，對(duì)于具有五個(gè)兩種狀態(tài)的按鈕的界面，在作者為普 通狀態(tài)輸入一個(gè)全屏圖形以及為滾置狀態(tài)輸入一個(gè)全屏圖形后，并且在作者識(shí)別五個(gè)交互 式元素后，雕刻站將自動(dòng)生成十個(gè)單個(gè)圖形(即，對(duì)于普通狀態(tài)510，五個(gè)按鈕中的每一個(gè) 一個(gè)圖形以及對(duì)于滾置狀態(tài)520，五個(gè)按鈕中的每一個(gè)一個(gè)圖形)。因此，如圖8B中所示， 在鼠標(biāo)指針850被放置在第二元素的上方時(shí)，本發(fā)明為以滾置狀態(tài)840的第二元素檢索自 動(dòng)生成的文件并且從而將該圖像顯示在預(yù)覽區(qū)域870的第二元素位置中。在本發(fā)明的又一個(gè)實(shí)施例中，這樣的顯示交替地發(fā)生。例如，在如在圖8B示例中 的鼠標(biāo)指針被放置在第二元素的上方時(shí)，本發(fā)明可以引用為滾置狀態(tài)創(chuàng)建并存儲(chǔ)的全屏圖 形，并且展示其各個(gè)部分，如由作者先前為第二元素定義的，而不是自動(dòng)生成并稍后檢索用 于在圖8B示例中的第二元素的滾置狀態(tài)840的特定圖像。額外的替選實(shí)施例將使用于普 通狀態(tài)的全屏圖形在預(yù)覽區(qū)域870中顯示(例如，類似于在圖5B中那樣的樣子)并且在如 在圖8B示例中的鼠標(biāo)指針850被放置在第二元素的上方時(shí)，本發(fā)明實(shí)質(zhì)上切掉第二元素， 如由作者先前位置地定義的，來(lái)顯露作為下層存在的用于滾置狀態(tài)的全屏圖形。由于只有 第二元素的位置區(qū)域被移除，所以對(duì)用戶可視的用于滾置狀態(tài)的全屏圖形的唯一部分是第 二元素部分?？傊窨陶緲O大地減少了作者必須供給并管理的單個(gè)數(shù)據(jù)點(diǎn)和圖形文件的數(shù) 量，消除了對(duì)作者手動(dòng)定義并重組每一個(gè)元素層來(lái)達(dá)到最終交互式界面的需求。使用雕刻 站來(lái)變更以及添加元素不需要作者重復(fù)“切割和放置”步驟，或者重復(fù)定義并重組界面中的
每一個(gè)元素層。本發(fā)明的這些和其它優(yōu)勢(shì)從前述說(shuō)明對(duì)本領(lǐng)域技術(shù)人員將是顯而易見的。因此， 本領(lǐng)域技術(shù)人員將認(rèn)識(shí)到，在不背離本發(fā)明的寬泛發(fā)明構(gòu)思的情況下可以對(duì)上述實(shí)施例進(jìn) 行改變或修改。因此，應(yīng)當(dāng)理解，本發(fā)明不限于在此描述的特定實(shí)施例，而意在包括在本發(fā) 明的范圍和精神內(nèi)的所有改變和修改。
權(quán)利要求
一種用于定義交互式用戶界面的系統(tǒng)，包括圖形用戶界面，用于輸入具有一種或多種狀態(tài)的交互式用戶界面的至少一個(gè)全屏圖形，其中所述至少一個(gè)全屏圖形中的每一個(gè)與所述交互式用戶界面的一種狀態(tài)相關(guān)聯(lián)；交互式圖形工具，用于定義在所述交互式用戶界面內(nèi)的與在所述至少一個(gè)全屏圖形中的每一個(gè)內(nèi)顯示的一個(gè)或多個(gè)交互式元素中的每一個(gè)相對(duì)應(yīng)的區(qū)域；數(shù)據(jù)存儲(chǔ)設(shè)備，用于存儲(chǔ)所述交互式用戶界面的與所述一個(gè)或多個(gè)交互式元素中的每一個(gè)相對(duì)應(yīng)的已定義的區(qū)域的幾何特性和位置信息；以及輸出生成器，用于自動(dòng)生成使所述一個(gè)或多個(gè)已定義的交互式元素中的每一個(gè)的每一種狀態(tài)能夠被顯示的計(jì)算機(jī)可讀代碼或圖形。
2.如權(quán)利要求1所述的系統(tǒng)，其中用于所述一個(gè)或多個(gè)已定義的交互式元素中的每一 個(gè)的每一種狀態(tài)的所述代碼或所述圖形從為相應(yīng)狀態(tài)輸入的相應(yīng)全屏圖形以及從為相應(yīng) 交互式元素定義并存儲(chǔ)的幾何特性和位置信息生成。
3.如權(quán)利要求1所述的系統(tǒng)，其中用于所述一個(gè)或多個(gè)已定義的交互式元素中的每一 個(gè)的每一種狀態(tài)的所述圖形與由為相應(yīng)交互式元素定義并存儲(chǔ)的幾何特性和位置信息定 界的為相應(yīng)狀態(tài)輸入的全屏圖形的部分相對(duì)應(yīng)。
4.如權(quán)利要求1所述的系統(tǒng)，其中由所述輸出生成器生成的所述計(jì)算機(jī)可讀代碼使計(jì) 算機(jī)能夠響應(yīng)于關(guān)于相應(yīng)狀態(tài)和關(guān)于相應(yīng)交互式元素的用戶輸入，在所述交互式用戶界面 內(nèi)的為相應(yīng)交互式元素定義的區(qū)域中顯示所述一個(gè)或多個(gè)交互式元素中的每一個(gè)的每一 種狀態(tài)。
5.如權(quán)利要求1所述的系統(tǒng)，其中所述交互式用戶界面在web瀏覽器中顯示。
6.如權(quán)利要求1所述的系統(tǒng)，進(jìn)一步包括第二圖形工具，所述第二圖形工具用于定義 所述至少一個(gè)全屏圖形中的每一個(gè)與所述交互式用戶界面的一種狀態(tài)的關(guān)聯(lián)。
7.如權(quán)利要求1所述的系統(tǒng)，進(jìn)一步包括第三圖形工具，所述第三圖形工具用于將功 能分配給所述交互式元素中的每一個(gè)的每一種狀態(tài)。
8.—種至少部分由機(jī)器實(shí)現(xiàn)的用于定義交互式用戶界面的方法，所述方法包括以下步驟為交互式用戶界面的每一種狀態(tài)輸入所述交互式用戶界面的一個(gè)全屏圖形，其中所述 交互式用戶界面具有一種或多種狀態(tài)和一個(gè)或多個(gè)交互式元素；為所述一個(gè)或多個(gè)交互式元素中的每一個(gè)定義在所述交互式用戶界面內(nèi)的區(qū)域；以及 自動(dòng)生成使每一個(gè)交互式元素的每一種狀態(tài)能夠被圖形顯示的計(jì)算機(jī)可讀代碼或圖形。
9.如權(quán)利要求8所述的方法，進(jìn)一步包括以下步驟存儲(chǔ)所述交互式用戶界面的與所述一個(gè)或多個(gè)交互式元素中的每一個(gè)相對(duì)應(yīng)的已定 義的區(qū)域的幾何特性和位置信息。
10.如權(quán)利要求9所述的方法，其中進(jìn)一步編輯所述交互式用戶界面包括以下步驟 為所述交互式用戶界面的待被添加或修訂的每一種狀態(tài)輸入所述交互式用戶界面的一個(gè)全屏圖形；從所存儲(chǔ)的與所述一個(gè)或多個(gè)交互式元素中的每一個(gè)相對(duì)應(yīng)的幾何特性、位置信息檢 索；以及自動(dòng)生成使每一個(gè)交互式元素的每一種狀態(tài)能夠基于所添加或修訂的全屏圖形被圖 形顯示的計(jì)算機(jī)可讀代碼。
11.如權(quán)利要求8所述的方法，其中用于所述一個(gè)或多個(gè)已定義的交互式元素中的每 一個(gè)的每一種狀態(tài)的所述代碼或所述圖形從為相應(yīng)狀態(tài)輸入的相應(yīng)全屏圖形以及從為相 應(yīng)交互式元素定義并存儲(chǔ)的幾何特性和位置信息生成。
12.如權(quán)利要求8所述的方法，其中用于所述一個(gè)或多個(gè)已定義的交互式元素中的每 一個(gè)的每一種狀態(tài)的所述圖形與由為相應(yīng)交互式元素定義并存儲(chǔ)的幾何特性和位置信息 定界的為相應(yīng)狀態(tài)輸入的全屏圖形的部分相對(duì)應(yīng)。
13.如權(quán)利要求8所述的方法，其中所生成的所述計(jì)算機(jī)可讀代碼使計(jì)算機(jī)能夠響應(yīng) 于關(guān)于相應(yīng)狀態(tài)和關(guān)于相應(yīng)交互式元素的用戶輸入，在所述交互式用戶界面內(nèi)的為相應(yīng)交 互式元素定義的區(qū)域中顯示所述一個(gè)或多個(gè)交互式元素中的每一個(gè)的每一種狀態(tài)。
14.如權(quán)利要求8所述的方法，其中所述交互式用戶界面在web瀏覽器中顯示。
15.如權(quán)利要求8所述的方法，其中進(jìn)一步編輯所述交互式用戶界面包括以下步驟為待被添加或修訂的每一個(gè)交互式元素定義在所述交互式用戶界面內(nèi)的區(qū)域；以及自動(dòng)生成使包括所添加和修訂的交互式元素的每一個(gè)交互式元素的每一種狀態(tài)能夠被圖形顯示的計(jì)算機(jī)可讀代碼。
16.一種至少部分由機(jī)器實(shí)現(xiàn)的用于定義交互式用戶界面的方法，所述方法包括以下 步驟為交互式用戶界面的每一種狀態(tài)輸入所述交互式用戶界面的一個(gè)全屏圖形，其中所述 交互式用戶界面具有一種或多種狀態(tài)和一個(gè)或多個(gè)交互式元素；為所述一個(gè)或多個(gè)交互式元素中的每一個(gè)定義在所述交互式用戶界面內(nèi)的區(qū)域；以及為每一個(gè)交互式元素的每一種狀態(tài)自動(dòng)生成單個(gè)圖形。
17.如權(quán)利要求16所述的方法，其中用于每一個(gè)交互式元素的每一種狀態(tài)的所述單個(gè) 圖形從用于所述相應(yīng)狀態(tài)的所述全屏圖形以及從為所述相應(yīng)交互式元素定義的所述區(qū)域 生成。
18.如權(quán)利要求16所述的方法，其中用于每一個(gè)交互式元素的每一種狀態(tài)的所述單個(gè) 圖形為由為所述相應(yīng)交互式元素定義的所述區(qū)域定界的用于所述相應(yīng)狀態(tài)的所述全屏圖 形的部分。
19.如權(quán)利要求16所述的方法，進(jìn)一步包括以下步驟存儲(chǔ)所述交互式用戶界面的與所述一個(gè)或多個(gè)交互式元素中的每一個(gè)相對(duì)應(yīng)的已定 義的區(qū)域的幾何特性和位置信息。
20.如權(quán)利要求16所述的方法，進(jìn)一步包括以下步驟創(chuàng)建所述交互式用戶界面的計(jì)算機(jī)可讀代碼，所述計(jì)算機(jī)可讀代碼使計(jì)算機(jī)在所述交 互式用戶界面內(nèi)的為所述相應(yīng)交互式元素定義的所述區(qū)域中并且響應(yīng)于關(guān)于所述相應(yīng)狀 態(tài)的用戶輸入，顯示每一個(gè)單個(gè)圖形。
全文摘要
用于定義具有一種或多種狀態(tài)和一個(gè)或多個(gè)交互式元素的交互式用戶界面的系統(tǒng)和方法。該方法的示例實(shí)施方式包括以下步驟為交互式用戶界面的每一種狀態(tài)輸入交互式用戶界面的一個(gè)全屏圖形；為一個(gè)或多個(gè)交互式元素中的每一個(gè)定義在交互式用戶界面內(nèi)的區(qū)域，以及自動(dòng)生成使每一個(gè)交互式元素的每一種狀態(tài)能夠被圖形顯示的計(jì)算機(jī)可讀代碼或圖形。該方法可以進(jìn)一步包括以下步驟存儲(chǔ)交互式用戶界面的與一個(gè)或多個(gè)交互式元素中的每一個(gè)相對(duì)應(yīng)的已定義的區(qū)域的幾何特性和位置信息。所存儲(chǔ)的幾何特性和位置信息可以被用來(lái)幫助編輯和修改交互式用戶界面。
文檔編號(hào)G06F17/00GK101821730SQ200880111577
公開日2010年9月1日 申請(qǐng)日期2008年8月22日 優(yōu)先權(quán)日2007年8月22日
發(fā)明者埃里克·M·羅爾 申請(qǐng)人:普羅斯凱普科技公司