列表/詳細資料模式有清單窗格（通常有 列表視圖）和一個詳細內容窗格。 當列表中的項目被選取時，詳細面板會被更新。 這種圖案經常用於電子郵件和通訊錄。
重要 API： ListView 類別、 SplitView 類別
小提示
如果你想使用能為你實現此模式的 XAML 控制項，我們推薦 Windows 社群工具包中的 ListDetailsView XAML 控制項 。
這是正確的圖案嗎？
如果你想要使用清單/詳細資料模式，該模式會非常合適：
- 建立一個電子郵件應用程式、通訊錄，或任何基於清單細節排版的應用程式。
- 尋找並優先排序大量內容。
- 允許在不同情境間快速新增或移除項目。
選擇正確的風格
在實作清單/細節模式時，我們建議根據可用螢幕空間大小，使用堆疊式或並列式。
| 可用視窗寬度 | 推薦風格 |
|---|---|
| 320 epx-640 epx | 堆疊 |
| 641 epx 或更寬 | 並排 |
堆疊式
在堆疊式中，一次只能看到一個窗格：清單或細節。
使用者從清單窗格開始，透過選擇清單中的項目，向下鑽入細節窗格。 對使用者來說，清單和詳細資料視圖似乎存在於兩個獨立頁面。
建立堆疊式清單和詳細模式
建立堆疊清單/詳細資料模式的一種方法是分別使用清單窗格和詳細面板的頁面。 將清單檢視放在一頁，詳細資料窗格放在另一頁。
對於清單檢視頁面， 清單檢視 控制項對於呈現包含圖片和文字的清單效果很好。
對於詳細檢視頁面，請使用最合理的 內容元素 。 如果你有很多獨立欄位，可以考慮用 格狀 佈局來將元素排列成一個表單。
關於頁面間的導航，請參閱 Windows 應用程式的導航歷史與後退導航。
並排風格
在並排風格中，清單窗格與細節窗格會同時顯示。
面板中的清單具有選取指示，用來表示目前選取的項目。 在列表中選擇新項目會更新詳細資料窗格。
建立一個並列清單/細節佈局
建立並排清單/細節模式的一種方法是使用 分割視圖 控制。 將清單檢視放在分割檢視窗格，詳細檢視放在分割檢視內容中。
對於清單窗格， 清單檢視 控制項對於呈現可包含圖片和文字的清單效果很好。
至於細節內容，請使用最合理的 內容元素 。 如果你有很多獨立欄位，可以考慮用 格狀 佈局來將元素排列成一個表單。
自適應佈局
要為任何螢幕尺寸實作清單/詳細資訊設計模式，請建立一個具備響應式和自適應布局的使用者介面。
建立一個自適應的清單/細節模式
要建立自適應版面，請為你的 UI 定義不同的 VisualStates ，並用 AdaptiveTriggers 為不同狀態宣告斷點。
取得範例程式碼
以下範例以自適應版面實作清單/詳細資料模式，並示範資料綁定至靜態、資料庫及線上資源：
小提示
如果你想使用能為你實現此模式的 XAML 控制項，我們推薦 Windows 社群工具包中的 ListDetailsView XAML 控制項 。
