配置應用程式頁面
[ 本文的目標對象是撰寫 Windows 執行階段 App 的 Windows 8.x 和 Windows Phone 8.x 開發人員。如果您正在開發適用於 Windows 10 的 App，請參閱 最新文件 ]
您可以使用此處所述的配置模式，來配置應用程式頁面上的 UI 元素。遵循邊界、頁首、間距寬度以及其他元素的一致模式，就可以維持整個應用程式外觀的整體性，並能協助使用者輕鬆了解如何與系統的互動。
Windows 8 的使用者介面會盡量在各種應用程式之間維持一致的外觀。在上、下及左邊緣使用寬邊界是外觀的特徵。寬邊界可以協助使用者了解內容的水平移動瀏覽方向。
如需了解這些功能的運作情形，請參閱應用程式功能，從開始到完成系列: Windows 市集應用程式 UI，從開始到完成
使用格線系統
在討論 Windows 8 外觀之前，應該先對使用 Windows 8 格線系統有初步的認識。格線系統是協助您在不同的應用程式之間保持視覺統一性的設計工具，它同時也提供多樣性的結構變化以吸引使用者的注意。格線系統內建於開發人員範本上，我們在設計控制項和集合時也充分利用格線系統。
格線由單位與子單位所組成。度量的基本單位就是單位。一個單位等於 20 × 20 像素。每個單位再進一步劃分為 5 × 5 像素的子單位。每個正方形單位有 16 個子單位。下列影像描繪螢幕左上角的格線。我們在此將影像放大，以顯示像素、子單位及單位。
.png "格線系統的圖例")
頁首
頁首的基線應距離頂端 5 個單位 (或 100 像素)。頁首的左邊界為 6 個單位 (或 120 像素)。Windows 8 頁首的字型為 SegoeUI 文體集 20 Light (字體粗細)。如需文體集的相關資訊，請參閱文字和印刷格式的指導方針和檢查清單。
注意 在 Windows 8.1 更新，使用者可以將滑鼠移到畫面的上邊緣，以顯示標題列。使用者也可以將滑鼠移到畫面的下邊緣，從桌面顯示工作列。當使用者將滑鼠移開上下邊緣時，會隱藏標題列和工作列。使用者無法以觸控方式顯示標題列或工作列。顯示標題列和工作列時，可能會遮住應用程式的 UI 或命令元素，所以當您在應用程式配置中定義元素的位置時，請將這點納入考量。
.png "頁首的圖例")
內容區域
內容區域的上邊界為 7 個單位 (或 140 像素)。左邊界為 6 個單位 (或 120 像素)。下邊界沒有特別的限制。對於水平移動瀏覽的內容，則不應多於 6.5 個單位 (130 像素) 和少於 2.5 個單位 (50 像素)。 對於垂直移動瀏覽的內容，上邊界與左邊界相等。沒有指定下邊界是因為使用者可以捲動到螢幕以外的內容。
.png "內容區域的圖例")
水平邊框距離值
內容項目之間的水平邊框距離隨項目而不同。固定邊緣項目 (像是影像與使用者磚) 在磚與伴隨文字之間有 2 個子單位 (或 10 像素)。清單在各欄之間左右有 2 個單位 (或 40 像素) 的邊框距離。固定邊緣項目在各欄之間左右有 2 個子單位 (或 10 像素) 的邊框距離。
.png "水平邊框距離值的圖例")
垂直邊框距離值
內容項目之間的垂直邊框距離也會隨項目類型而不同。 磚與文字清單在項目之間上下有 1 個單位或 (20 像素) 的邊框距離。固定邊緣物件在項目之間上下有 2 個子單位 (或 10 像素) 的邊框距離。
.png "垂直邊框距離值的圖例")
群組之間的水平邊框距離
群組之間的邊框距離為 4 個單位 (或 80 像素)。這個邊框距離較大，可以讓使用者在移動瀏覽時輕鬆分辨不同的群組。
.png "群組之間水平邊框距離的圖例")