1. 48 dp 的設計韻律
一般來說,可觸摸控件以 48 dp 為基礎機關。

為什麼是 48 dp?
一般情況下,48 dp 在裝置上的實體大小是 9 mm (會有一些變化)。這剛好在觸摸控件推薦的大小範圍 (7-10 mm) 内,而且這樣的大小,使用者用手指觸摸起來也比較準确、容易。
如果你設計的元素都至少有 48 dp 的高度和寬度,那麼可以保證:
- 你設計的元素在任何螢幕上顯示時,都不會小于最低推薦值 7 mm。
- 你可以在資訊密度和界面元素的可操控性之間得到較好的平衡。
注意留白
界面元素之間的留白應當是 8 dp。
例子
2. Android 系統預設字型 Rotobo,限定使用以下字号
3. Android 圖示
由于所有圖示都需要适配不同的像素密度,這裡引入 dp 這一機關,它以中等尺寸,MDPI的螢幕為基準提供像素密度無關的表示。
在設計圖示時,對于五種主流的像素密度(MDPI、HDPI、XHDPI、XXHDPI 和 XXXHDPI)應按照 2:3:4:6:8 的比例進行縮放。例如,一個啟動圖示的尺寸為48x48 dp,這表示在 MDPI 的螢幕上其實際尺寸應為 48x48 px,在 HDPI 的螢幕上其實際大小是 MDPI 的 1.5 倍 (72x72 px),在 XDPI 的螢幕上其實際大小是 MDPI 的 2 倍 (96x96 px),依此類推。
提示: 雖然 Android 也支援低像素密度 (LDPI) 的螢幕,但無需為此費神,系統會自動将 HDPI 尺寸的圖示縮小到 1/2 進行比對。
啟動圖示
啟動圖示在“主螢幕”和“所有應用”中代表你的應用。因為使用者可以設定“主螢幕”的桌面,是以要確定你的啟動圖示在任何背景上都清晰可見。
大小和縮放
- 移動裝置上的啟動圖示大小必須是 48x48 dp。
- 在 Play 商店中顯示的啟動圖示大小必須是 512x512 像素。
比例
- 整體大小是 48x48 dp
樣式
使用一個獨特的剪影。三維的正面視圖,看起來稍微有點從上往下的透視效果,使使用者能看到一些景深。
操作欄
操作欄圖示是一個圖像按鈕,用來表示使用者在應用中可以執行的重要操作。每一個圖示都使用一個簡單的隐喻來代表将要執行的操作,使用者應當一目了然。
内置的圖示應當用來表示一些确定的通用操作,例如“重新整理”和“分享”。下面的下載下傳連結提供了一個圖示包,其中的圖示可以縮放到多種螢幕分辨率,并且适合于淺色和深色的 Holo 主題。圖示包中還有沒有樣式化的圖示,可以和你自己的主題搭配,并且提供了 Adobe® Illustrator® 源檔案,你可以自己修改。
下載下傳操作欄圖示包
大小和縮放
- 手機操作欄圖示大小應當是32x32 dp。
焦點區域和比例
-
整體大小是 32x32 dp
圖形區域 24x24 dp
樣式
象形、平面、不要有太多細節,圓滑的弧線或者尖銳的形狀。如果圖形太窄了,那麼向左或向右旋轉 45° 來填滿圖形區域。最細的筆畫不應小于 2dp。
顔色
顔色: #333333
可用: 60% 的透明度
禁用: 30% 的透明度
顔色: #FFFFFF
可用: 80% 的透明度
禁用: 30% 的透明度
小圖示和上下文圖示
在應用的主體區域中,使用小圖示表示操作或者特定的狀态。例如在 Gmail 應用中,每條資訊都有一個星型圖示用來标記“重要”。
大小和縮放
- 小圖示大小應當是 16x16dp。
焦點區域和比例
-
整體大小是 16x16 dp
圖形區域 12x12 dp
樣式
中性、平面和簡單。最好使用填充圖示而不是細線條勾勒。使用簡單的視覺效果,使使用者容易了解圖示的目的。
顔色
使用有目的的小圖示。例如在 Gmail 應用中,使用黃色的星型圖示表示重要的資訊。如果圖示是可操作的,使用和背景色形成對比的顔色。
通知欄圖示
如果你的應用會産生通知,提供一個圖示給系統顯示在狀态欄上,表示有一條新的通知。
大小和縮放
- 通知欄圖示大小必須是24x24 dp。
焦點區域和比例
-
整體大小是 24x24 dp
圖形區域 22x22 dp
樣式
使用簡單的平面的圖示,應當和應用的啟動圖示視覺上相似。
顔色
通知欄圖示必須是白色的,這樣系統可以縮放和加深你的圖示。
4. 圖示命名約定
遵守一定的圖示命名約定有助于圖示檔案的管理。我們可以為不同類型的圖示指定不同的命名字首:
圖示類型 | 命名字首 | 例 |
---|---|---|
圖示 | | |
啟動圖示 | | |
菜單圖示和操作欄圖示 | | |
狀态欄圖示 | | |
标簽頁籤圖示 | | |
對話框圖示 | | |