Android px, dp, sp的區別

Android自興起以來，開發者不斷增加，與此同時市場上參差不齊的設備也不斷增加，隨之而來的則是開發者需要適配眾多機型而帶來的困擾與抱怨。並且隨著不同廠家定制化不同的ROM，Android設備的碎片化現象日益嚴重。這篇文章主要講述如何設計中嚴格遵從設計圖標准的Android頁面。

1. px, dp, sp區別

什麼是px

px就是我們通常所說的像素的單位，在css裡面，我們用px比較多。px主要指用戶在屏幕上看到的事物的實際大小單位。

什麼是dp

在看手機或者電腦參數時，我們經常說到一個關鍵詞，屏幕分辨率(resolution)，分辨率被表示成每一個方向上的像素數量，比如800x480分辨率

上圖中，我們可以看到15寸的retina pro分辨率是2880x1800，而60寸的HDTV分辨率卻只有1920x1080。可見如果60寸的HDTV也要達到Retina的顯示效果，其分辨率大概至少為11520x7200。<喎?/kf/ware/vc/" target="_blank" class="keylink">vcD4NCjxwPrzIyLvS0b6t09DBy7fWsebCyrXEuMXE7qOsxMfDtM7Sw8e+zb/J0tTBy73iIGRwaShkb3QgcGVyIGluY2gptcS4xcTuwcuho2RwabG+0uLKx8O/06K057XjtcTK/cG/o6y1q8rH0rK+rbOjus1wcGkocGl4ZWwgcGVyIGluY2gpu+zTw6Gj1rjDv9OitOe1xM/xy9jK/cG/o6zSsrG7ztLDx7PGzqrGwcS7w9y2yKOsZHBp1L2086OszbzP8bTTytO+9cnPv7TG8MC01L3H5c76oaM8L3A+DQo8cD5Hb29nbGW52be9ttRkcLXEveLKzcjnz8KjujwvcD4NCjxibG9ja3F1b3RlPg0KCTxwPkEgdmlydHVhbCBwaXhlbCB1bml0IHRoYXQgeW91IHNob3VsZCB1c2Ugd2hlbiBkZWZpbmluZyBVSSBsYXlvdXQsIHRvIGV4cHJlc3MgbGF5b3V0IGRpbWVuc2lvbnMgb3IgcG9zaXRpb24gaW4gYSBkZW5zaXR5LWluZGVwZW5kZW50IHdheS48YnIgLz4NCglUaGUgZGVuc2l0eS1pbmRlcGVuZGVudCBwaXhlbCBpcyBlcXVpdmFsZW50IHRvIG9uZSBwaHlzaWNhbCBwaXhlbCBvbiBhIDE2MCBkcGkgc2NyZWVuLCB3aGljaCBpcyB0aGUgYmFzZWxpbmUgZGVuc2l0eSBhc3N1bWVkIGJ5IHRoZSBzeXN0ZW0gZm9yIGEgJmxkcXVvO21lZGl1bSZyZHF1bzsgZGVuc2l0eSBzY3JlZW4uIEF0IHJ1bnRpbWUsIHRoZSBzeXN0ZW0gdHJhbnNwYXJlbnRseSBoYW5kbGVzIGFueSBzY2FsaW5nIG9mIHRoZSBkcCB1bml0cywgYXMgbmVjZXNzYXJ5LCBiYXNlZCBvbiB0aGUgYWN0dWFsIGRlbnNpdHkgb2YgdGhlIHNjcmVlbiBpbiB1c2UuIFRoZSBjb252ZXJzaW9uIG9mIGRwIHVuaXRzIHRvIHNjcmVlbiBwaXhlbHMgaXMgc2ltcGxlOiBweCA9IGRwICogKGRwaSAvIDE2MCkuIEZvciBleGFtcGxlLCBvbiBhIDI0MCBkcGkgc2NyZWVuLCAxIGRwIGVxdWFscyAxLjUgcGh5c2ljYWwgcGl4ZWxzLiBZb3Ugc2hvdWxkIGFsd2F5cyB1c2UgZHAgdW5pdHMgd2hlbiBkZWZpbmluZyB5b3VyIGFwcGxpY2F0aW9uJnJzcXVvO3MgVUksIHRvIGVuc3VyZSBwcm9wZXIgZGlzcGxheSBvZiB5b3VyIFVJIG9uIHNjcmVlbnMgd2l0aCBkaWZmZXJlbnQgZGVuc2l0aWVzLjwvcD4NCjwvYmxvY2txdW90ZT4NCjxwPtPQwcvD3LbItcS4xcTuo6zO0sPHv8nS1Lj8usO1xMDtveJkcChkZW5zaXR5IGluZGVwZW5kZW50IHBpeGVsKcHLoaNkcMrHQW5kcm9pZNbQ08PAtLao0uVVSbK8vtbW0LHttO/UqsvYs9+057vyzrvWw7XE0ru49tDpxOK1xM/xy9i1pc67o6xkcLXEtObU2srHzqrBy9Kzw+bUqsvYzrvWw7K7ytzGwcS7w9y2yMv507DP7KGj0tTJ6LzGyqbJ6LzG0ru49kFQUNKzw+bOqsD9o6zJ6LzGyqbPo83708O7p8rTvvXJz7+0xvDAtMjntMujrNKyvs3Kx8novMbKpsnovMbKsc2os6PS1HB41/fOqrv5tKG1pc67oaO2+NTaxuTL+7K7zazGwcS7w9y2yLXEyeixuNbQo6zSss+jzfvE3Lm7vfjQ0NK7tqi1xMnsy/WjrMDgy8bT2s6ss9bSu7j2z+C21NK71sK1xLDZt9axyKGjy/nS1L+qt6LV382os6PQ6NKq0tRkcM6qtaXOu6Os0tTKytOmsrvNrMPctsi1xMbBxLuhozwvcD4NCjxwPsv50tRkcLrNcHjWrrzk09DSu8zXu7vL47Hq17yjujxjb2RlPnB4ID0gZHAgKiAoZHBpIC8gMTYwKTwvY29kZT6ho7zZyejU2mRwac6qMzIwtcTGwcS7yc+jrDFkcCA9IDJweKGjPC9wPg0KPGgzIGlkPQ=="什麼是sp">什麼是sp

sp是Android中專業為字體而設置的單位。使用sp作為字體單位不僅能夠使字體大小受屏幕密度影響，並且能夠使字體受用戶系統設置的影響。Android提供字體大小的設置選項。一旦使用sp作為字體，根據用戶設置字體的不同，App中的字體大小也會顯示不同。但是在正常字體設置下，1dp ＝ 1sp。

2. 設計師視角

Android的多屏適配存在這麼多的尺寸，自然需要設計師和工程師之間找到溝通的橋梁，設計師如何規范設計才能夠更加符合Android的設計標准呢。設計師與工程師對於頁面的尺寸需要有一個共識性的標准，測試人員才可能進行更有效的測試，才不致於因為不同機型顯示不同效果而引起不必要的工作量。

首先我們需要選擇一個相對通用的屏幕尺寸，可以參考現有的一些主流機型的尺寸。為了便於計算，我們選擇Nexus 4作為設計圖的原版標准。那麼所有的頁面都是基於Nexus4而產生的。Nexus4尺寸如下:

主屏尺寸4.7，主屏分辨率：1280x768像素，屏幕像素密度320ppi。

一般來說，我們選擇市場上最常見的機型來設計，這裡我們為了計算方便，選擇320ppi的機型，設計圖中尺寸將是標准圖中的2倍。假設在設計圖中，頁面內邊距為32px, 按鈕的高度為96px, icon大小為48x48。

通過px＝dp*(dpi/160)的標准，設計師給開發者標注圖時可標注頁邊距為16dp，按鈕高度為48dp，icon則分別出四套mdpi, hdpi, xhdpi, xxhdpi標准。

3. 開發者視角

margin, padding, height, width

從開發者角度來看，對於控件的尺寸，高度等，只需要按照轉化後的dp設置即可。

android:layout_padding="16dp"

android:layout_height="48dp"

以dp為單位能夠保證不同分辨率屏幕上顯示不同大小的字體。並且能夠保持相對大小，這樣也更符合設計的初衷。

圖片資源

對於png制作出來的圖片，一般大小固定，沒辦法像尺寸一樣自動的伸縮。所以Android會存在至少4個資源文件夾。當App運行過程中，系統能夠根據當前設備的屏幕密度，自動選擇使用哪種尺寸的圖片資源。

ldpi mdpi hdpi xhdpi xxhdpi xxxhdpi 0.75 1 1.5 2 3 4 120 160 240 320 480 640 18x18 24x24 36x36 48x48 72x72 96x96

4. 更多

附上Android主流機型：

Android：主流機型主要為 480x800, 480x854, 540x960, 720x1280, 800x1280 這五種。
（非主流機型還包括：240x320, 320x480, 640x960 這三種，其中兩種都與 iPhone 一致。）
iOS: 主流機型主要為 320x480, 640x960, 640x1136, 1024x768, 2048x1536, 這五種。
WP：主流機型主要為 480x800，720x1280, 768x1280 這三種

Photoshop制圖時，字體大小通常是pt這個單位。pt是長度單位， 1pt = 1/72英寸， px = pt * dpi/72。

另附上豆瓣關於這些單位更具體的闡釋。