TWI530859B - 頁面管理方法與頁面管理系統 - Google Patents

Description

頁面管理方法與頁面管理系統

本發明係關於網路設備的管理應用領域，特別是有關於一種適用於移動裝置的頁面管理系統以及其方法。

隨著科技進步，越來越多人使用智慧型手機而非傳統的手機。除了基本的通話功能外，智慧型手機更具有上網、導航以及股票下單等功能。隨著智慧型手機的功能越來越強大，每個應用程式也就包含越多功能。一般來說，智慧型手機的應用套裝程式包含許多頁面，每個頁面可以顯示不同的資訊。然而，因為一般智慧型手機的螢幕只有3.5吋左右，為了清晰顯示，通常一個螢幕只能顯示一個頁面。頁面與頁面之間的切換需要不斷地刷新(重載)頁面，或者頁面與頁面之間的切換需要回到首頁，才能轉換到所要的頁面。

第1圖顯示傳統頁面運作的平面圖。如第1圖所示，頁面管理系統10除了首頁(App)102以外，其更可分為五個主要頁面：最愛頁(Favorites)104、搜尋頁(Search)106、主頁(Main)108、站台頁(Station)110與文章頁(Article)112，而每個主要頁面下面又有許多次頁面。舉例來說，當 使用者要從該主頁108到該搜尋頁106，頁面流覽的路徑是從該主頁108回到該首頁102再到該搜尋頁106(Main->App->Search)。頁面的管理機制統一由各頁面自行負責，同一個功能主題，集中於一個頁面，頁面與頁面之間的互動較少，且頁面的工作生命週期回到首頁時就消失。因此，從傳統頁面管理系統10的頁面的運作方式可以得知，頁面與頁面之間無法同時顯示，且需要不斷的切換頁面。在操作的過程中，每切換一次頁面，就需要刷新一次頁面的資料，也就是每切換一次頁面，每個頁面的狀態與資料均需要重新開始與載入，耗費許多時間。另外，多個頁面之間，資料不易交換，當一個頁面無法將足夠的資料量載入時，需切換多個頁面才能完成所有資料的顯示，十分不便。

第2A圖-第2C圖係顯示在傳統移動裝置的螢幕上顯示多頁面的示意圖。如第2A圖-第2C圖所示，傳統多頁面管理系統稱為推特系統模組(Twitter Model)，而此推特系統模組20主要包含根目錄視區(root view)202、選單視區(menu view)204與延伸視區206。該根目錄視區202如同頁面管理系統的首頁，該選單視區204則可顯示目錄的頁面，而該延伸視區206則為多頁面顯示的區域。該推特系統模組20是以堆疊(stack)的方式記錄頁面之間的順序，也就是說頁面的順序是不可以改變的，只能簡單的做多個頁面之間的管理。然而，該推特系統模組20只能由開發者簡單的定義頁面之間的關聯性，缺乏整體的頁面管理機制，只能單純記下頁面的順序，無法依照特殊的情境(scenario)，在頁面與頁面之間進行搭配應用。

綜上所述，當智慧型手機的螢幕越來越大，而且平板電腦也日益普及，螢幕可以應用的區域範圍變大，頁面管理系統可在同一個螢幕 顯示多個頁面。因此需要有一個管理機制可以快速且有效地在一個螢幕裡顯示多個頁面，將使用者所需要的資訊快速且有條理地顯現在移動裝置的螢幕上。

本發明的目的在提供一種頁面管理系統，藉由該頁面管理系統可以在移動裝置的螢幕上同時顯示多個頁面。

為了達到上述的目的，本發明提供一種頁面管理系統，其包含主程式、複數個頁面與頁面管理系統，且該頁面管理系統包含頁面控制器、映射管理模組與歷程管理模組。該頁面控制器控制頁面的資料管理，該映射管理模組藉由複數個參數定義頁面之間的串聯關係，該歷程管理模組保存與還原每個頁面的狀態與資料，該頁面控制器藉由映射管理模組與歷程管理模組控制頁面的資料流向與操作方式。

本發明的另一目的在提供一種頁面管理方法，藉由該頁面管理方法可以降低頁面與頁面之間資料重複載入的頻率，有效地在一個螢幕裡顯示多個頁面。

為了達到上述的目的，本發明提供一種頁面管理方法，包含下列步驟：打開第一頁，並要求顯示第二頁；在映射管理模組中搜尋有關該第二頁的串聯關係以取得第二頁的參數資料；在歷程管理模組中建立該第二頁與其他頁面之間的歷程記錄；在螢幕上顯示該第二頁；要求關閉該第二頁；在歷程管理模組中確認該第二頁的串聯關係，若有依附頁依附在該第二頁下，先關掉該依附頁；以及關閉該第二頁。

本發明的又一目的在提供一種頁面管理系統，藉由此頁面管理系統，讓使用者所需要的資訊快速且有條理地顯現在移動裝置的螢幕上。

為了達到上述目的，本發明提供一種頁面管理系統，其包含一根目錄視區(root view)、一選單視區(menu view)與一延伸視區，該頁面管理系統的部份複數個功能放置於一根目錄視區，且其中該頁面管理系統包含頁面控制器、該映射管理模組與該歷程管理模組。該頁面控制器控制在選單視區的選單頁面與在延伸視區的延伸頁面的複數個資料管理，該映射管理模組藉由複數個參數定義選單頁面與延伸頁面之間以及延伸頁面與延伸頁面之間的串聯關係，該歷程管理模組保存與還原選單頁面與延伸頁面的狀態與資料，該頁面控制器藉由該映射管理模組與該歷程管理模組控制選單頁面與延伸頁面的資料流向與操作方式。

相較於傳統頁面管理系統，本發明的頁面管理系統與方法，其映射管理模組參數化頁面之間的關聯，可即時調整運作的方向，增加頁面之間的情境需求，加強互動關係的管理，並配合該歷程管理模組控制頁面的資料流向與操作方式。而且該頁面管理方法與系統可以同時顯示多個頁面，不必重複切換畫面。

為讓本發明的所述內容能更明顯易懂，下文特舉較佳實施例，並配合所附圖式，作詳細說明如下：

10‧‧‧頁面管理系統

102‧‧‧首頁

104‧‧‧最愛頁

106‧‧‧搜尋頁

108‧‧‧主頁

110‧‧‧站台頁

112‧‧‧文章頁

20‧‧‧推特系統模組

202‧‧‧根目錄視區

204‧‧‧選單視區

206‧‧‧延伸視區

302‧‧‧主程式

304‧‧‧頁面

306‧‧‧頁面管理系統

3062‧‧‧堆疊模組

3064‧‧‧頁面控制器

3066‧‧‧映射管理模組

3068‧‧‧歷程管理模組

308‧‧‧伺服器

702‧‧‧目錄視區

704‧‧‧選單視區

705‧‧‧選單頁面

706‧‧‧延伸視區

708‧‧‧延伸頁面

S802-S814‧‧‧步驟

第1圖顯示傳統頁面運作的平面圖； 第2A圖-第2C圖係顯示在傳統移動裝置的螢幕上顯示多頁面的示意圖；第3圖為本發明較佳實施例中具有頁面管理系統之應用程式的方塊圖；第4圖係顯示本發明實施例中由頁面管理系統建立新頁面的流程圖；第5圖係顯示本發明實施例中多頁面資料交換的流程圖；第6圖係顯示本發明實施例中映射管理模組之資料更新的流程圖；第7A圖-第7C圖係顯示應用程式具有頁面管理系統的情境示意圖；以及第8圖係顯示本發明之應用程式的頁面管理方法流程圖。

以下各實施例的說明是參考附加的圖式，用以例示本發明可用以實施的特定實施例。

第3圖為本發明較佳實施例的頁面管理系統的功能方塊圖。如第3圖所示，該頁面管理系統306主要用於主程式(Main Application)302以管理多個頁面304。該主程式302提供該頁面304上所有的應用功能(如儲存、傳送、計算或刪除等功能)，而多個頁面304則分別將該主程式302的執行結果顯示於一移動裝置的螢幕上。該頁面管理系統306用於管理頁面之間的操作關係，其至少包含堆疊(Stack)模組3062、頁面控制器(Page Controller)3064、映射管理(Mapping Manager)模組3066與歷程管理(History Manager)模組3068。該堆疊模組3062用於記錄頁面的順序關係，該頁面控制器3064用於控制多個頁面之間的資料關係，例如工作生命週期、資料交換以及資料保存機制等，該映射管理模組3066可以依據不同的情境需求，管理頁面之間的互動關係，該映射管理模組3066通過定義頁面之間的串聯關係，例如主從關係、依附關係、連帶關係或強制影響關係等，管理頁面之間的連動關係，該歷程管理模組3068則用於保存與還原各個頁面的狀態與資料。進一步來說，該頁面管理系統306通過設定參數定義頁面之間的串聯關係，讓該頁面控制器3064可以控制頁面的工作生命週期與關聯順序，以及讓該映射管理模組3066可以依據不同情境的需求，管理頁面之間的互動關係。

依舊參閱第3圖，在此實施例中該映射管理模組3066可以在首頁定義許多串聯頁面的條件。然而，在不同實施例中，該映射管理模組3066可以在不同的頁面定義許多串聯頁面的條件，並非僅侷限於首頁。舉例來說，在首頁中，通過一個觸發畫面事件(例如輸入首頁內的表單數據、設定表單條件或是勾選某些選框等事件)，可以引入顯示第二頁，而形成首頁與第二頁間的主從關係。或者，在不同實施例中，從首頁直接點擊打開該第二頁，再從該第二頁觸發引入顯示第三頁，進而形成三頁面之間的連帶關係，依此類推。同樣，在此所述的首頁、第二頁與第三頁間的串聯條件僅為簡單敘述其主從關係或順序關係，並非用於侷限頁面之間的連帶關係僅如上所述。例如，也可以從首頁直接引入該第二頁以外的頁面，如第三頁或第A頁等。另外，在本發明的實施例中，在某頁面中還可以定義串聯 其它頁面。舉例來說，從第A頁面串聯至第四頁，或者從第一頁可以產生一個新的頁面(如第A頁等)。而本發明的實施例中，針對該頁面管理系統306的不同主題類別也可以透過該映射管理模組3066將其頁面串聯。

第4圖顯示本發明實施例中由頁面管理系統建立新頁面的流程圖。如第4圖所示，當該頁面控制器3064被告知要增加產生一個新頁面時，該頁面控制器3064會詢問該映射管理模組3066是否此新頁面的資料關聯性以及與其他頁面之間的資料關聯性，進而識別新頁面的資料關聯性的對應參數。接著，該頁面控制器3064會通知該歷程管理模組3068有一新頁面已經產生，在該歷程管理模組3068中建立此新頁面的歷程記錄以及與其他頁面之間的歷程記錄。最後在移動裝置上顯示此新頁面。

第5圖顯示本發明實施例中多頁面資料交換的流程圖。如第5圖所示，當第一頁要求開啟第二頁的資料時，第一頁呼叫該頁面控制器3064，該頁面控制器3064接收到開啟該第二頁的要求時，該頁面控制器3064到該映射管理模組3066搜尋有關第二頁的關聯，接著從該映射管理模組3066取得頁面的對應參數(例如作業參數與串聯參數等)。該頁面控制器3064從該映射管理模組3066取得足夠的資訊後，確認是否新的頁面產生，接著產生新的頁面，將新的頁面加入頁面清單中。且同時告知該歷程管理模組3068有新的頁面產生，該歷程管理模組3068記錄此新頁面與其他頁面之間的歷程記錄。另外，當在移動裝置的螢幕上已開啟許多頁面，而此時需要關掉或移除第三頁時，會先通知該頁面控制器3064要求移除第三頁。而該頁面控制器3064會到該歷程管理模組3068查看第三頁與其他頁面的串聯關係(如主從關係或依附關係等)。若有其他頁面依附在第三頁下，在關掉該第 三頁的前會告知使用者會將其餘依附在該第三頁下的一同關閉。相反的，確定沒有其他頁面依附在該第三頁下，該歷程管理模組3068告知該頁面控制器3064，該頁面控制器3064通知該頁面管理系統306可以直接將第三頁關閉。

第6圖顯示本發明實施例中映射管理模組的資料更新的流程圖。如第6圖所示，本發明的頁面管理系統306更可以透過一伺服器308獲得新的頁面映射關聯。當使用者點擊頁面304呼叫新頁面304或更新頁面304時，頁面304可以先去後端伺服器308中詢問是否有新的動態頁面映射關聯，然後從該後端伺服器308取得新的動態頁面映射關聯，並將新的動態頁面映射關聯告知該頁面控制器3064。接著，頁面304告知該頁面控制器3064需要更新頁面304或產生新的頁面304，該頁面控制器3064除了從該映射管理模組3066取得指定的目標頁面與所要交換的參數外，更從該後端伺服器308取得新的動態頁面映射關聯。接著，該頁面控制器3064再到歷程管理模組3068建立或更新頁面304記錄。最後，該頁面控制器3064將所需的參數傳送至頁面304以更新頁面資料或產生新頁面304。通過伺服器308，讓頁面304在執行過程中可以獲得新的動態映射關聯，配合原有映射管理模組3066所包含已定義的映射關聯，讓該頁面管理系統306可以動態產生新的頁面304或新的頁面資訊。

第7A圖-第7C圖顯示頁面管理系統的情境示意圖。在第7A圖-第7C圖所示的頁面管理系統的情境示意係配合第3圖所示的頁面管理系統306的元件做說明。如第7A圖所示，此為適用於零件維修的頁面管理系統，在該頁面管理系統306產生的情境包含根目錄視區(root view)702、選單 視區(menu view)704以及延伸視區706。該根目錄視區702包含讓使用者登入與註銷、進行一般設定(例如程式外觀等)，或者在該選單視區704顯示一選單頁面705等基本程式功能，但在此並不侷限。當要求該根目錄視區702在該選單視區704顯示選單頁面705時，該頁面管理系統306告知第3圖的頁面控制器3064，該頁面控制器3064詢問該映射管理模組3066在選單頁面705的頁面資料關聯性，並在該歷程管理模組3068中建立選單頁面705的歷程記錄，再打開該選單頁面705。該選單頁面705包含客戶管理、商品管理、維修零件、儀錶板、公司別設定、行事曆、客戶管理、商品管理與流程待辦等功能選單。

依舊參閱第7A圖，當使用者點擊選單頁面705中其中一個功能選單，會在該選單視區704右邊的延伸視區706產生一延伸頁面708。同樣地，該頁面管理系統306會呼叫該頁面控制器3064，該頁面控制器3064詢問該映射管理模組3066有關延伸頁面708的頁面資料關聯性以及與其他頁面之間的資料關聯性，並在該歷程管理模組3068中建立此延伸頁面708的歷程記錄。舉例來說，當使用者要在該頁面管理系統306找到一個客戶的叫修案件，首先使用者點擊在該選單視區704的維修零件的選單，而在該選單視區704的右邊會跑出叫修案件的延伸視區706。在該延伸視區706中顯示出客戶名稱與聯絡人資料的延伸頁面708，在客戶名稱的欄位中顯示客戶名稱、叫修單號與預約狀態等資訊，而在聯絡人的欄位中顯示聯絡人姓名、單據日期與預計完修等資訊。當使用者想要進一步顯示某一客戶的叫修案件的詳細資料，可在該延伸頁面708中點擊該用戶端區域，此時會在第7A圖的延伸視區706的延伸頁面708上跑出另一個延伸頁面708，如第7B圖所示。

請參閱第7B圖，在第7B圖中，新產生的另一個延伸頁面708會顯示出客戶叫修案件的詳細資料(如派工日期、接單人員、客戶聯絡電話、維修零件等)。若使用者要進一步顯示維修零件的資訊，點擊該延伸頁面708中客戶叫修案件的維修零件的詳細資料，會在第7B圖的延伸視區706的延伸頁面708中再跑出另一延伸頁面708，如第7C圖所示。在第7C圖中跑出維修清單的延伸頁面708，在維修清單的延伸頁面708中顯示維修零件的詳細資料(如品號、品名、規格與單價等)，讓使用者可以清晰的瞭解此叫修案件的所有資訊。

另方面來說，若要關掉在第7B圖中產生的延伸頁面708，該頁面控制器3064會到該歷程管理模組3068查看第7B圖延伸頁面708是否與其他頁面有串聯關係(如主從關係或依附關係等)。如在本實施例中，第7B圖的延伸頁面708與第7C圖的延伸頁面708間具有依附關係(第7C圖的延伸頁面708依附在第7B圖的延伸頁面708下)。此時，該頁面控制器3064會告知頁面管理系統306需要關掉第7C圖的延伸頁面708才可以關掉第7B圖的延伸頁面708。該頁面管理系統306會告知使用者以確認是否要關掉第7B圖的延伸頁面708，若是，則同時將第7B圖的延伸頁面708與第7C圖的延伸頁面708，若否，則不將第7B圖的延伸頁面708關掉。如上所述，頁面管理系統可以應用在移動裝置的螢幕上做多頁面的顯示，不用像傳統頁面管理系統那般需要不斷的切換頁面，增加了頁面管理系統使用上的便利性。

第8圖顯示本發明的頁面管理方法的流程圖。在第8圖所示的頁面管理方法係配合第3圖所示的頁面管理系統的元件做說明。如第8圖所示，在頁面管理方法的步驟S802中，打開第一頁，並告知頁面控制器3064 要求顯示第二頁的資訊。在步驟S804中，該頁面控制器3064於映射管理模組3066中搜尋有關該第二頁與其他頁面的串聯關係，並取得該第二頁的參數資料，例如對應作業參數與串聯參數等。在步驟S806中，該頁面控制器3064通知該歷程管理模組3068有一第二頁形成，在該歷程管理模組3068中建立該第二頁與其他頁面之間的歷程記錄。在步驟S808中，在該頁面管理系統306上執行顯示該第二頁的資料頁檢視，並在一移動裝置的螢幕上顯示第二頁，而此時該第一頁與該第二頁同時顯示在此螢幕上。同理，也可以再產生新的頁面，如第三頁等，同時將該第一頁、該第二頁與其他頁面同時顯示在移動裝置的螢幕上，並不侷限僅可在螢幕上顯示該第一頁與該第二頁。在步驟S810中，要求關閉該第二頁。在步驟S812中，在該歷程管理模組3068中確認第二頁的串聯關係，若有其他依附頁面附屬於該第二頁下，則需先關掉所依附的其他頁面，若沒有其他頁面依附在此頁下，則進行下一步驟。在步驟S814中，關閉該第二頁。另外，在步驟S804中，更包含通過後端的一伺服器區308取得第二頁的動態頁面映射關係，頁面的產生與更新並非僅透過該映射管理模組3066，可以透過該後端伺服器308取得新的動態頁面映射關係。在不同實施例中，本發明的頁面管理方法更包含通過堆疊模組記錄頁面之間的順序。

通過上述的頁面管理方法與系統，可以管理頁面管理系統的情境的多個頁面。頁面管理系統的歷程管理模組記錄每個頁面的順序，管理頁面之間的狀態與邏輯。頁面管理系統的映射管理模組則參數化頁面之間的關聯，可即時調整運作的方向，增加頁面之間的情境需求，加強互動關係的管理，並配合歷程管理模組控制頁面的資料流向與操作方式。此頁 面管理方法與系統可以同時顯示多個頁面，不必重複切換畫面。另外，由於參數化的設定可以簡化為各種情境而增加的開發成本，且可以快速因需求進行調整，立即呈現效果。另外，在此需要說明的是，本發明的頁面管理方法與系統較佳使用於移動裝置，如智慧型手機、平板電腦或攜帶型電腦等，但並非侷限於僅用於上述的裝置中，只要具有觸控螢幕的電子裝置皆適用本發明的頁面管理方法與系統。

雖然本發明已用較佳實施例揭露如上，然其並非用以限定本發明，本發明所屬技術領域中具有通常知識者，在不脫離本發明的精神和範圍內，當可作各種的更動與潤飾，因此本發明的保護範圍當視後附的申請專利範圍所界定者為准。

302‧‧‧主程式

304‧‧‧頁面

306‧‧‧頁面管理系統

3062‧‧‧堆疊模組

3064‧‧‧頁面控制器

3066‧‧‧映射管理模組

3068‧‧‧歷程管理模組

Claims (10)

1. 一種頁面管理系統，其包含：一頁面控制器，控制複數個頁面的複數個資料關係；一映射管理模組，藉由複數個參數定義該複數個頁面之間的至少一串聯關係；以及一歷程管理模組，保存與還原每個該複數個頁面的狀態與資料；其中該頁面控制器藉由該映射管理模組與該歷程管理模組控制該複數個頁面的資料流向與操作方式，並且通過設定參數定義頁面之間的串聯關係，讓該頁面控制器控制頁面的工作生命週期與關聯順序，以及讓該映射管理模組依據不同情境的需求，管理頁面之間的互動關係。
2. 如申請專利範圍第1項所述之頁面管理系統，其中該頁面管理模組更包含一堆疊模組，用於記錄該複數個頁面之間的順序，且該頁面控制器透過該頁面的該複數個參數更新該頁面資訊。
3. 如申請專利範圍第1項所述之頁面管理系統，其中該頁面控制器透過獲得的該複數個頁面的該複數個參數產生一新頁面。
4. 如申請專利範圍第1項所述之頁面管理系統，其中該頁面控制器在該歷程管理模組中確認該複數個頁面之間的該複數個串聯關係，執行某一該複數個頁面的刪除。
5. 如申請專利範圍第1項所述之頁面管理系統，其中該頁面管理模組更可以透過一伺服器取得該複數個頁面的一動態頁面映射關係。
6. 如申請專利範圍第1項所述之頁面管理系統，其中藉由該頁面管理系統可同時顯示多個該複數個頁面於一移動裝置上。
7. 一種頁面管理方法，其包含：打開一第一頁，並要求顯示一第二頁；在一映射管理模組中搜尋有關該第二頁的至少一串聯關係以取得該第二頁的至少一參數資料，並依據不同情境的需求，管理頁面之間的互動關係；在歷程管理模組中建立該第二頁與其他頁面之間的至少一歷程記錄；在一螢幕上顯示該第二頁；要求關閉該第二頁；在該歷程管理模組中確認該第二頁的該串聯關係，若有至少一依附頁依附在該第二頁下，先關掉該依附頁；以及關閉該第二頁。
8. 如申請專利範圍第7項所述之頁面管理方法，其中更包含藉由一堆疊模組記錄該複數個頁面之間的順序，且藉由一伺服器取得該第二頁的一動態頁面映射關係，並配合在該映射管理模組中搜尋有關該第二頁的該串聯關係的該步驟，產生與更新該第二頁。
9. 如申請專利範圍第7項所述之頁面管理方法，其中在該映射管理模組中搜尋有關該第二頁的該步驟與在該歷程管理模組中建立該第二頁與其他頁面之間的至少一歷程記錄的該步驟皆由一頁面控制器完成。
10. 如申請專利範圍第7項所述之頁面管理方法，其中在顯示該第二頁的該步驟是藉由一頁面控制器根據在該映射管理模組所取得的該參數資料以顯示該第二頁，且該頁面管理方法可以在一螢幕上同時顯示該第一頁與該第二頁。