iPhone 4 5 6屏幕尺寸大小和APP设计详细解读 – 25学堂

25学堂再来跟大家重新解读下苹果手机4、5、6屏幕各尺寸大小，也许你们都知道啦，但是还有很多APP设计师新手不停的在群问，所以，25学堂的小编特为大家奉上这篇关于iPhone 4 5 6屏幕尺寸大小详细解读。

1、苹果手机（iPhone）全部尺寸规格

设备 iPhone	宽 Width	高 Height	对角线 Diagonal	逻辑分辨率(point)	Scale Factor	设备分辨率(pixel)	PPI
3GS	2.4 inches (62.1 mm)	4.5 inches (115.5 mm)	3.5-inch	320×480	@1x	320×480	163
4(s)	2.31 inches (58.6 mm)	4.5 inches (115.2 mm)	3.5-inch	320×480	@2x	640×960	326
5c	2.33 inches (59.2 mm)	4.90 inches (124.4 mm)	4-inch	320×568	@2x	640×1136	326
5(s)	2.31 inches (58.6 mm)	4.87 inches (123.8 mm)	4-inch	320×568	@2x	640×1136	326
6	2.64 inches (67.0 mm)	5.44 inches (138.1 mm)	4.7-inch	375×667	@2x	750×1334	326
6+	3.06 inches (77.8 mm)	6.22 inches (158.1 mm)	5.5-inch	414×736	@3x	(1242×2208->) 1080×1920	401

单位inch（英吋）的注释：    1 inch = 2.54cm = 25.4mm

相关逻辑分辨率和 物理分辨率的详细解读：

手机屏幕分辨率术语：逻辑分辨率和物理分辨率

 

简单明要的说iPhone 4 5 6屏幕尺寸大小：

苹果iphone4 /iphone 4s  ——————–  3.5英寸 ———  640*960px—–高宽比1.5

苹果iphone5 /  iphone 5c  /iphone 5s  ——4英寸————640*1136px—–高宽比1.775

苹果iphone6  ———————————-4.7英寸————750*1334px—–高宽比1.779  

苹果iphone6 plus ——————- ———5.5英寸————1242*2208px—–高宽比1.778

 

我们通常所说的 iPhone4屏幕尺寸为3.5英寸、 iPhone5屏幕尺寸为4英寸、iPhone6屏幕尺寸为4.7英寸，指的是显示屏对角线的长度（diagonal）。

 

2、苹果手机iphone 的屏幕密度PPI

PI（Pixel Per Inch by diagonal）：表示沿着对角线，每英寸所拥有的像素（Pixel）数目。

PPI数值越高，代表显示屏能够以越高的密度显示图像，即通常所说的分辨率越高、颗粒感越弱。

根据勾股定理，可以得知iPhone4(s)的PPI计算公式为:

3、苹果手机iPhone 4 5 6的屏幕的缩放因子（ Scale）

 早期的iPhone3GS的屏幕分辨率是320*480（PPI=163），iOS绘制图形（CGPoint/CGSize/CGRect）均以point为单位（measured in points）：

     1 point = 1 pixel （Point Per Inch=Pixel Per Inch=PPI）

后来在iPhone4中，同样大小（3.5 inch）的屏幕采用了 Retina显示技术 ，横、纵向方向像素密度都被放大到2倍，像素分辨率提高到(320×2)x(480×2)= 960×640（PPI=326）， 显像分辨率提升至iPhone3GS的4倍（1个Point被渲染成1个2×2的像素矩阵）。

但是对于开发者来说，iOS绘制图形的API依然沿袭point(pt，注意区分印刷行业的“磅”)为单位。在同样的逻辑坐标系下（320×480）：

    1 point = scale*pixel （在iPhone4~6中，缩放因子scale=2；在iPhone6+中，缩放因子scale=3）。

    可以理解为：

    scale= 绝对长度比 （ point/pixel）= 单位长度内的数量比 （ pixel/point）

 为了自动适应分辨率，系统会根据设备实际分辨率，自动给UIScreen.scale赋值，该属性对开发者只读。APP设计师可以忽略。

4、 @2x/@3x   以及高倍图适配

ne 6 Plus发布后，iphone APP设计不得了考虑适配所有iPhone机型啦。

（1）、@2x

iPhone3GS时代，我们为一个应用提供图标（或按钮提供贴图），只需要icon.png。针对现在的iPhone4~6 Retina显示屏，需要制作额外的@2x高分辨率版本。

    例如在iPhone3GS中，scale=1，用的图标是50x50pixel（logicalimage.size=50x50point）；在iPhone4~6中，scale=2，则需要100×100pixel（logical image.size=50x50point，乘以image.scale=dimensions in pixels），并且命名为icon@2x.png。

    如果APP要同时兼容iPhone3GS~iPhone6，则需要提供icon.png/icon@2x.png两种分辨率的图片。

（2）@3x

    @3x  means a new “triple” retina resolution, where eachuser interface point is represented by three display pixels. A single @2x pointis a 2 × 2 square of 4 pixels; an @3x point is a 3 × 3 square of 9 pixels.”

    iPhone6+在实际渲染时，downsampling/1.15（1242×2208-> 1080×1920 ），准确的讲，应该是@2.46x。苹果为方便开发者用的是@3x的素材，然后再缩放到@2.46x上。

1、 iPhone 6/6Plus UI界面设计和适配尺寸规范

2、 iPhone 6/6Plus APPui界面设计规范以及界面适配

3、 最新WebAPP设计指南规范：适配iphone6技巧

    如果APP要同时兼容iPhone3GS~iPhone6+，则需要提供icon.png/icon@2x.png/icon@3x.png三种分辨率的图片。

    需要注意的是，iOS APP图标的尺寸 和 切图命名规范 都需要遵守相关规范

（3）高倍图文件命名

    对于iPhone3、4/5/6、6+三类机型，需要按分辨率提供相应的高倍图并且文件名添加相应后缀，否则会拉伸（stretchable/resizable）失真（模糊或边角出现锯齿）。

 比如：bg-xxx@2x.png、btn-xxx@2x.png 、icon-xxx@2x.png

如bg-xxx@3x.png、btn-xxx@3x.png 、icon-xxx@3x.png

切图宽和高 必须的偶数。