首先先來介紹一下
px 就是大家最熟悉的東西!我家的螢幕是 1920x1080,這裡講的就是 ”像素”。
ppi, dpi 在手機世界基本上是相等的
他們都表示 “螢幕密度”
ppi = px / inch
(都是對角線)
至於常用在 Android 裡的 dp
,與 iOS 使用的 pt
(*註一)又是什麼呢?
首先在上數學課之前要讓大家有個最正確的第一印象,
dp
,pt
都是 長度單位
也就是他們跟 公分、英寸是同等級的東西!你可以把他們想成絕對長度,不過還是有很多例外狀況。
但在講例外之前,我們還是先來說說常規吧!
dp = px/dpi * 160
(dpi = ppi)
pt = px/dpi * 163
(dpi = ppi)
又
dp = px/(px/inch) * 160
故
dp = inch * 160
pt = inch * 163
看,沒唬爛你吧,
1 dp 就是 1/160倍的英吋
所以下次你想破頭到底 dp 是什麼意思,或是到底多長的時候
你就記得,不管在哪一支手機上,拿出一支有英吋的尺,量出 0.1 英吋的長度,你就可以得到完美的 16dp !
現在來說說例外吧
For Android,
因為 Android 的系統可以從系統設定去調整螢幕顯示大小。
這時候我們常常就會踩到一個坑
dp 的數值變了!!
這就獵奇了, dp 的定義是 px/dpi * 160
而 dpi (螢幕的解析度) 是由解析度除以實際尺寸得到的結果。但是螢幕解析度是在出廠的時候就做好的, 1920x1080 怎麼用軟體調整也不會改變,更別說是螢幕尺寸。所以 dpi 當然不會變
但這樣為什麼 dp 會改變啊!!!???
而我們做個實驗,真的從
getResources().getDisplayMetrics().densityDpi
來拿 dpi。
還真的給我變了!!
所以我們知道當我們從系統設定調整了螢幕大小,
Android OS 會直接把整隻手機模擬成 低解析度的手機
這樣會造成在一樣的螢幕尺寸下, dpi 變低(註二)
這就是為什麼我們用直尺量螢幕的時候,有時候並不一定等於 dp,因為常常老花眼要調螢幕啊啊啊啊(誤
For iOS
iOS 的 pt 做法又更偷懶了
其實 iOS 的 pt 很簡單就是 px 除以 1, 2, 3 倍而已。所以…
・在 iphone 4 上面, pt = px
・ 163< dpi ≤ 326
的手機(ex. iPhone5) pt = px/2
・dpi > 326
pt = px/3
這樣一來,基本上在 dpi = 163(iPhone4), 326(iPhone6s), 489(尚未推出) 的機器上可以得到完美的丈量 (1/163 英吋) ,就是 163 的整數倍啦!
但是其他 dpi 如 iPhone6+(401), iPad Pro(264) 等等的機器,就會被迫被提到下一個階級,造成他們的元件比應該要有的長度還要小( 1dp < 1/163英吋
)
結論:
大多情況下,
dp = 1/160 inch
pt = 1/ 163 inch
dp 例外: 從系統設定 -> 調整螢幕大小
pt 例外:iphone plus 系列, iPad Pro 全系列,super OLED 全系列(註三)
以上,如有疏漏還請大力鞭下去。謝謝
註一:UI元件中的 bound 所得出來的值,或是 storyboard 裡面所有數字的單位都是 pt。
註二:dpi = px/inch
, px
下降,dpi
跟著下降
註三:super OLED 包含 iPhoneX, iPhoneXs, 但不包含 iPhoneXR