iPhone的图像尺寸不正确 -

Question

我有这个名为image.png的图像 - 我已经用3种不同的尺寸创建了它。

• image@3x.png - 1001x132px
• image@2x.png - 668x88px
• image.png - 334x44px

我不明白的是，当iPhone 5和5S的宽度只有640px时，@ 2x的宽度是668像素？

我使用iPhone 6+屏幕尺寸设计了@ 3x。

有人可以解释一下吗？

Answer 1

让我向您解释iPhone屏幕之间的区别，以便了解这些@？x后缀的必要性。 第一部iPhone和之后的两部iPhone（3G和3GS）具有尺寸为w:320, h:480的标准显示器。随着iPhone 4的推出，Apple还推出了所谓的 Retina显示器，它将1个逻辑像素（也称为“点”）中的4个物理像素“打包”，即：

现在，即使iPhone 4的像素尺寸为w:640, h:960（以及iPhone 5 / 5C / 5S w:640, h:1136），您的屏幕尺寸仍为w:320, h:480点（分别为{ {1}}为5 / 5C / 5S）。但由于显示器的坐标系使用的是点而不是像素，因此所有UI元素的点的尺寸和位置对于每个设备都保持不变。

前缀怎么样？

现在，点和像素之间的比率称为“比例”。 UIScreen，UIView，UIImage和CALayer类都有一个名为w:320, h:568的属性，当您加载前缀为scale的图像时，比例将为@2x，并且显示将适合2x2位图像素图像在一点上。 iPhone 6+使用2.0后缀，因为Retina HD显示器具有缩放系数@3x，然后图像从渲染的2208×1242像素缩小到1920×1080像素（屏幕上的点）

  

缩小比例是1920/2208 = 1080/1242 = 20 / 23.那   意味着原始渲染中的每23个像素必须映射到20   物理像素。换句话说，图像缩小到   约为其原始尺寸的87％。

（source）。

所需图像尺寸

例如，如果您想要在尺寸为3的黑色方块中生成绿色圆圈图像，则需要再拍摄两张图片：一张尺寸为w:100, h:100，另一张尺寸为w:200, h:200 ，因为系统会根据后缀缩放它们。

下一步去哪儿

这里有一些要阅读的内容（如果我没有解释正确或易于理解）。我的建议：查看上面的链接和官方Apple文档以获取更多知识：

Apple documentation: Supporting high-res devices

Apple documentation: Points vs. Pixels

Answer 2

@ 2x用于视网膜显示，如iphone 4,4s，5,5s，6，ipads .... 图像的宽度为668像素，我认为它可用于视图，可以有额外的视图区域，如水平滚动视图，教程页面或ipad ......或类似的东西.. 是的，你对视网膜显示器的宽度是正确的，它只是640px。 希望这可能有所帮助。