也算是做了好长时间的iOS开发,但是基本上都是合作开发,我负责写功能,对于app的UI尺寸那些事还真是不敢说了解,那UI设计一会儿是像素,一会儿又是分辨率。一会儿二倍图,一会儿又三倍图,整的我是很烦燥。揣着疑惑继续做东西,那心里别提有多难受了,所以我今天就要把iOS开发尺寸那些事儿整理清楚。
首先是屏幕尺寸
屏幕尺寸就是通常所说的
- iPhone4 :3.5英寸
- iPhone5、5s : 4英寸
- iPhone6、6s、7、7s : 4.7英寸
- iPhone6+、7+ :5.5英寸
- iPhoneX :5.8英寸
接下来是开发尺寸
开发尺寸(pt),就是我们编程时布局UI所用的尺寸,就是Point。用
UIScreen.main.bounds.width
UIScreen.main.bounds.height
可以的到具体的数值
- iPhone4 :320 pt*480 pt
- iPhone5、5s :320 pt *568 pt
- iPhone6、6s、7、7s : 375 pt *667 pt
- iPhone6+、7+ :414 pt *736 pt
- iPhoneX :375 pt *812 pt
最后就是U I尺寸
这个尺寸就是你给美工的尺寸或者是美工给你的尺寸。也就是像素(px)、分辨率。
分辨率 = 屏幕的水平像素* 屏幕的垂直像素
在诸多苹果设备中,5、5s、6、6s、7、7s、8等它们的屏幕分辨率是逻辑分辨率即开发尺寸乘2来让你肉眼看到的。
而Plus系列和X是乘3来显示的。
而苹果将2208* 1242的分辨率的图像压缩输出在1920 *1080的屏幕上
而已经被淘汰的4是乘1显示。
所以在Xcode工程中导入图标时会让你导入1 *、2 *、3 * 三张不同尺寸的图标,一倍图给4用,三倍图给Plus和X用,其他的用2倍。
分辨率
- iPhone4 :320 px*480 px
- iPhone5、5s :640 px *1136 px
- iPhone6、6s、7、7s : 750 px *1334 px
- iPhone6+、7+ :(1242 px *2208 px ->) 1080 px *1920 px
- iPhoneX :1124 px *2436 px
所以当你做项目时需要一个 20* 20 Point的图片时, 你需要让美工做40* 40 和60* 60 的尺寸各一张,用@2x.png和@3x.png命名。
同样道理当你的美工给你的原型图时按照设备的屏幕分辨率而不是开发尺寸设计时,就需要将标注按设备进除以2或者除以3进行UI设计。
OK,整理完毕,好顺畅的感觉。
网友评论