多級網格的UI設計模式

Question

目前我要求在多級網格中顯示相關項目。 這是偉大的祖父母 - >祖父母 - >父母 - >孩子

例如：Country-> state-> City-> Street是顯示順序。

建議的解決方案是在多級網格中顯示所有這些（最多4個級別）。

國家 - >州 - >城市 - >街

由於我對可用性方面的解決方案不滿意，我正在尋找一種將顯示分解為邏輯單元的UI設計模式。

謝謝

Answer 1

當您擁有來自同一層次結構的兩個不同級別的數據對象時，您可以：

• 將每個級別放在不同的窗口（或頁面，燈箱）中，並允許在它們之間導航。 我稱之為深入研究 。

• 將每個級別放在同一窗口（或頁面）的不同窗格中，其中將焦點放在上級窗格中的對象上會填充從屬窗格。 我稱之為主 - 細節 （這包括級聯列表，不要與上面的深入分析混淆）。

• 將兩個級別放在同一窗格中，縮進每個上級對象下的下級對象，並通常提供控件來隱藏和顯示每個上級對象的下級對象。 我稱之為樹 。

使用多個級別的層次結構，您可以使用這些級別的任何組合。 以下是一些決定如何關聯層次結構中任何相鄰級別的指南。

如果，將等級放在樹中

• 層次結構中的級別數隨每個數據對象（如文件夾）而任意變化。

• 用戶將定期比較排序順序中彼此靠近的兩個或多個上級對象的下級對象（然后，用戶可以為兩個上級對象展開樹，以一次查看所有子對象）。

在以下情況下將級別置於主 - 詳細信息關系中：

• 您為每個對象顯示多個或兩個屬性（例如，不僅僅是名稱），並且每個級別具有不同的屬性。

• 上級對象有多個從屬對象類。

• 您將展示多對多關系。

有關詳細信息，請參閱層次結構Visual Design

如果出現以下情況，請將級別置於下鑽關系中：

• 每個級別顯示的信息量太大，無法放入單個合理大小的窗口中。

• 該任務規定用戶可以從一個級別轉換到另一個級別，但用戶不會同時使用這兩個級別（通常，您希望避免讓用戶在窗口之間來回導航）。

• 無論如何，您將需要單獨的窗口來執行不同的高級任務。 這意味着您將提供一種直接導航到下級窗口的方法，而無需通過上級窗口“向下鑽取”

通常，只有當兩個窗口都是主窗口（或頁面）時，向下鑽取才有意義。 從屬窗口不應是對話框，屬性窗口或燈箱。 如果您沒有足夠的內容在下級窗口中顯示以證明全尺寸主窗口的合理性，那么請使用主 - 詳細信息。 與master-detail相比，下鑽對話框：

• 引入保存更改的不一致性。

• 在z順序中創建模式或模糊（或者，在燈箱的情況下，在Back按鈕的功能上模糊）。

• 缺少下拉菜單及其用於編輯和撤消的基本控件（在Linux和Windows中）。

• 不支持窗口大小調整（在Mac和Windows中）以提供更靈活的內容查看。

有關以上所有內容的更多信息，請參閱http://www.zuschlogin.com/?p=31 。

Answer 2

打破這種情況的一種常見方法可能是在兩個或更多步驟中執行此操作，並在它們之間導航（即導航到另一個頁面或打開模態對話框等）

因此，您可以顯示第一個具有1或2或3級層次結構的網格/表，以及導航鏈接以顯示第二個或次要列表/表中的剩余級別。

如果您正在尋找某些既定模式的確認，您可以選擇（或組合）這些模式：

主/明細

樹表

要么

級聯列表

Answer 3

樹？ 就像文件系統的Windows資源管理器視圖一樣？