密度獨立像素 (dp) 和可縮放像素 (sp) 對於建構版面配置和呈現字型至關重要,可針對各種螢幕密度、大小類別、板型規格和顯示比例,以一致的方式做出回應,構成 Android 裝置。
重點整理
- 如果使用基準格線,請採用 4 和 8 的測量值。
- 以 dp 和 sp 為單位標註規格,而非像素。
- 匯出所有 bucket 的點陣圖 (光柵) 圖像。
- 設計時請抱持回應式思維,並考量不同大小類別、解析度和顯示比例。
- 密度獨立像素 (dp):密度獨立像素是彈性單位,可縮放以在任何螢幕上維持一致的尺寸。這類單位是以螢幕的實際密度為依據,相對於 160 dpi (每英寸像素數) 螢幕換算而來。在這種螢幕上,1 dp 約等於 1 px。
- 可縮放像素 (sp):可縮放像素與 dp 的功能相同,但適用於字型。sp 的預設值與 dp 的預設值相同。Android 系統會根據裝置類型以及使用者在裝置設定中選擇的偏好設定,計算實際顯示的字型大小。
這兩種測量單位的主要差異在於,可縮放像素會保留使用者的字型設定。如果使用者為了方便閱讀而將文字調大,系統會根據他們的偏好設定顯示相應大小的字型。瞭解如何在撰寫模式中變更字型大小。
Android 會使用這些單位,協助在各種裝置和解析度之間進行縮放和轉換。
密度值區
高密度螢幕的每英寸所含像素數量高於低密度螢幕。因此,相同像素尺寸的 UI 元素在低密度螢幕上會顯得較大,在高密度螢幕上則會顯得較小。因此,您不應以像素為單位宣告測量值。
Android 會將螢幕密度範圍分組為「級別」,並使用這些級別為裝置提供最佳資源組合。最常用的密度級別為 mdpi、hdpi、xhdpi、xxhdpi 和 xxxhdpi (nodpi 和 anydpi 是指不會根據裝置解析度調整大小的級別,通常用於向量可繪項目),每個級別都對應到應用程式的資源檔案。
dp 計算方式:
dp = (以像素為單位的寬度 * 160) / 螢幕密度
基準格線
使用基礎格線建構 UI,有助於確保間距和對齊方式一致。Android UI 會使用 8 dp 格線來配置版面、元件和間距。
圖示、字型和元件中的部分元素等較小的元素,最好對齊 4 dp 格線。
版面配置格線
格線是任何版面配置的骨幹。請考量內容的階層、數量,甚至是訊息。
階層式格線
系統會根據內容的階層或重要性建立階層式格線。以報紙版面為例:頂端會顯示一致的頭條新聞,佔據大部分版面,而較小的欄則會顯示過往的文章。

在調整螢幕大小時,階層式版面配置可以重排、調整大小及顯示格線儲存格。
模組化格線
模組化格線會設定一致的欄和列,建立矩形格線系統,用來對齊內容。如果內容的重要性與大小相近,例如資訊卡庫,就很適合使用模組化格線。

自動調整式模組化格線可以新增更多格線儲存格,且其中的內容可以對齊或換行至不同格線儲存格。格線儲存格可以維持大小一致,也可以視內容需求調整大小。
欄格線
資料欄會建構格線結構,藉由劃分主體區域內的內容,為版面配置提供垂直定義。內容會放置在含有資料欄的螢幕區域中。請與底層格線對齊,以便對齊內容,但應保持彈性大小。

請參閱版面配置基本概念,瞭解如何設定資料欄格線及套用內容。資料欄格線可根據特定時間點的螢幕大小,視需要變更資料欄大小和資料欄數量,以配合不同板型規格,同時允許內容縮放。
大小類別
視窗大小類別是一組自主的可視區域中斷點,有助於設計、開發及測試回應式與自動調整式應用程式版面配置。Android 將視窗大小類別分為 3 種:精簡、中等和展開。進一步瞭解視窗大小類別。
顯示比例
長寬比是指元素寬度與高度的比例,寫法為「寬度:高度」。
如要維持版面配置的一致性,請在圖片、介面和螢幕尺寸等元素上使用一致的長寬比。
建議您在 UI 中使用下列長寬比:
- 16:9
- 3:2
- 4:3
- 1:1
- 3:4
- 2:3