iOS 螢幕尺寸、邏輯解析度、物理解析度之間的相互關係
型號 |
螢幕尺寸(inch) |
邏輯解析度(point) |
縮放因子(scale factor) |
物理解析度(pixel) |
畫素密度(PPI) |
iPhone3GS |
3.5 |
320 * 480 |
@1x |
320 * 480 |
163 |
iPhone4/4s |
3.5 |
320 * 480 |
@2x |
640 * 960 |
326 |
iPhone5/5s |
4 |
320 * 568 |
@2x |
640 * 1136 |
326 |
iPhone6/6s |
4.7 |
375 * 667 |
@2x |
750 * 1334 |
326 |
iPhone6Plus/6s Plus |
5.5 |
414 * 736 |
@3x |
1242 * 2208 |
401 |
規格對照表
相關術語說明:
l inch(英寸)
1 inch= 2.54cm = 25.4mm
l PPI (畫素密度)
表示沿著對角線,每英寸所擁有的畫素(pixel)數目,PPI的數值越高,代表顯示屏能夠以越高的密度顯示影象,即通常所說的解析度越高,顆粒感越弱,影象更清晰。
根據勾股定理:iPhone4/iPhone4s的PPI的計算值:
= 163 pixcel/inch
l scale factor
早期的iPhone3GS的螢幕螢幕解析度是320 * 480,iOS繪製圖形(CGPoint/CGSize/CGRect)均已point為單位。
1point = 1 pixel
後來在iPhone4中,同樣大小(3.5inch)的螢幕採用Retina(視網膜)螢幕顯示技術,橫、縱向方向畫素密度都被放大到2倍,畫素解析度提高到(320 * 2) * (480 * 2) = 640 * 960,顯像解析度提高到iPhone3GS的4倍。iPhone6Plus中橫、縱向方向畫素密度都被放大到3倍,顯像解析度提高到iPhone3GS的9倍。
scale= 單位長度內的數量比(pixel/point)
l 螢幕尺寸
指的是顯示屏的對角長度,以下為iPhone5s、iPhone6s、iPhone6Plus螢幕尺寸規格示意圖:
l 點(point)和畫素(pixel)換算關係
iPhone3GS
1point = 1pixel
iPone4/4s、iPhone5/iPhone5s、iPhone6/iPhone6s
1point = 2pixel
iPhone6Plus/iPhone6s Plus
1point = 3pixel
眾所周知,手機螢幕解析度是手機的重要引數之一。
大家都知道移動端裝置螢幕尺寸非常多,碎片化嚴重。尤其是Android,你會聽到很多種解析度:480×800, 480×854, 540×960, 720×1280, 1080×1920,而且還有傳說中的2K屏、4K、5k等。近年來iPhone的碎片化也加劇了:640×960, 640×1136, 750×1334, 1242×2208。
今天重點跟大家普及下 ,什麼是邏輯解析度和物理解析度
解釋一:俗話說物理解析度是硬體所支援的,邏輯解析度是軟體可以達到的。
我們先來看看ios客戶端的尺寸解析度表:
物理尺寸是指螢幕的實際大小。大的螢幕同時必須要配備高解析度,也就是在這個尺寸下可以顯示多少個畫素,顯示的畫素越多,可以表現的餘地自然越大。
解釋二:如同上圖所對應的英文單詞一樣。
640*960、640*1136等這些都是物理尺寸或是物理解析度。
而下面的320*480、320*568等這些都是邏輯解析度或是邏輯尺寸。
解釋三:從另外的角度來說:解析度就是螢幕上橫、縱的總象素點數。
如果我們設計的時候用單位px,可以說是物理解析度尺寸。
如果我們設計的時候用單位pt,可以說是邏輯解析度尺寸。
下面拿iphone 6 plus詳細分析:
1、iPhone 6 Plus 的邏輯point解析度用 360×640,也不是不可以,也即上面圖表中的 iPhone 6+ (b)方案,那麼 scale 用 @3x,最終畫素解析度 360×[email protected] 正好是 1080×1920,完美1:1對映,無需縮放;但缺點就是:iPhone 6 Plus的邏輯pt解析度 360×640 就會比 iPhone 6的 375×667 還低,這天理不容啊,一個Plus的大螢幕雖然很精細,但是可顯示的實際內容比 iPhone 6 還少。完全不符合 Bigger than bigger 。
打個比方就是:相同字號的情況下,iPhone 6如果一行顯示了25個字,而 iPhone 6 Plus 按這個邏輯pt方案,一行就會只能顯示24 個字了。
2、那如果邏輯point解析度用 540×960 呢,也即圖表中的 iPhone 6+ (c) , scale 沿用老的 @2x ,最終畫素解析度 540×[email protected] 不正好是 1080×1920 嗎,也是完美1:1對映,無需縮放,還不需要多餘做 @3x 素材; 而且這個方案的優點也很明顯: pt 面積是 iPhone 6 的兩倍 (540×960 = 375x667x 2),這樣螢幕可顯示的內容一下就增多了 ; 但這個方案的缺點就更明顯了: 所有 iOS UI 元素尺寸在螢幕上的實際物理面積一下子就變小了,比如標籤欄或導航欄按鈕的物理高度只有原來的 81.5% ,
點選面積就只有iPhone 6的 0.815*0.815=66.4%,使用者點選就困難了,總不至於蘋果考慮觸控手指操作,為 <= iPhone 6 做一套設計規範,為 iPhone 6 Plus 再另外做一套設計規範。
型號 |
螢幕尺寸(inch) |
邏輯解析度(point) |
縮放因子(scale factor) |
物理解析度(pixel) |
畫素密度(PPI) |
iPhone3GS |
3.5 |
320 * 480 |
@1x |
320 * 480 |
163 |
iPhone4/4s |
3.5 |
320 * 480 |
@2x |
640 * 960 |
326 |
iPhone5/5s |
4 |
320 * 568 |
@2x |
640 * 1136 |
326 |
iPhone6/6s |
4.7 |
375 * 667 |
@2x |
750 * 1334 |
326 |
iPhone6Plus/6s Plus |
5.5 |
414 * 736 |
@3x |
1242 * 2208 |
401 |
規格對照表
相關術語說明:
l inch(英寸)
1 inch= 2.54cm = 25.4mm
l PPI (畫素密度)
表示沿著對角線,每英寸所擁有的畫素(pixel)數目,PPI的數值越高,代表顯示屏能夠以越高的密度顯示影象,即通常所說的解析度越高,顆粒感越弱,影象更清晰。
根據勾股定理:iPhone4/iPhone4s的PPI的計算值:
= 163 pixcel/inch
l scale factor(縮放因子)
早期的iPhone3GS的螢幕螢幕解析度是320 * 480,iOS繪製圖形(CGPoint/CGSize/CGRect)均已point為單位。
1point = 1 pixel
後來在iPhone4中,同樣大小(3.5inch)的螢幕採用Retina(視網膜)螢幕顯示技術,橫、縱向方向畫素密度都被放大到2倍,畫素解析度提高到(320 * 2) * (480 * 2) = 640 * 960,顯像解析度提高到iPhone3GS的4倍。iPhone6Plus中橫、縱向方向畫素密度都被放大到3倍,顯像解析度提高到iPhone3GS的9倍。
scale= 單位長度內的數量比(pixel/point)
l 螢幕尺寸
指的是顯示屏的對角長度,以下為iPhone5s、iPhone6s、iPhone6Plus螢幕尺寸規格示意圖:
l 點(point)和畫素(pixel)換算關係
iPhone3GS
1point = 1pixel
iPone4/4s、iPhone5/iPhone5s、iPhone6/iPhone6s
1point = 2pixel
iPhone6Plus/iPhone6s Plus
1point = 3pixel