为什么我需要@ 1x,@ 2x和@ 3x iOS图像?

为什么我们需要这3种特定的图像types?

如果我的应用程序上有一个button,背景图像是50像素x 50像素,为什么我需要这个图像的3个版本? 什么阻止了我制作一个高分辨率的图像,比如700×700,所以当它在任何一个iPhone上缩小的时候,它都不会落在设备所需的最大分辨率之下?

只有我能想到的是它占用了更多的空间,但对于简单的应用程序/一个简单的button,它似乎不会引起任何问题。 我已经尝试了几个设备,当我模拟它,并执行此方法时,他们之间没有区别。 但是,当我更多地了解应用程序和内容时,我确信这项技术背后有内涵。

如果您没有确切的大小,可能会发生两件事情:

倍增

@3x@2x可以从@1x放大,但通常视觉效果模糊,线条粗糙,看起来不太好。 从@2x升级@3x可能更糟,因为必须使用子像素。

降尺度

总的来说,结果比上调更好,但是,并不适用于所有的图像。 如果@3x图像上有1px边框,则将其缩小到@1x ,边框将不可见(0.33px)。 这同样适用于图像中的任何小物体。 降尺寸破坏所有细节。

一般来说 – 对于一个图像看起来很完美,你想避免缩小和放大。 你总是可以只用@2x@3x图像,只有当你看到视觉问题时才join其他的比例。 使用更高的分辨率不会改善降尺度。 高分辨率仅用于避免放大。 从高标度(例如@100x )到@1x降尺寸不会比从@3x降尺度创build更好的结果。

在图像资源中,您需要3种图像,因为在缩放或像素方面有三种苹果设备(iPhone和iPad),即

正常的设备,其中1 pixel = 1 point @ 1x(较旧的iPhone和iPad设备)

视网膜设备的4 pixels(2 x 2) = 1 point @ 2x(iPhone 4 +)

视网膜iPhone6和iPad的9 pixels (3 x 3) = 1 point @ 3X(iPhone6 +)

因此,为了在3个尺度上提供相同的图像,iOS决定显示哪些图像显示哪些设备。希望可以帮助你理解这一点。

编辑

在这里输入图像说明

这是因为如果你提供一个高分辨率的graphics,这将浪费用户设备上的空间。 由于应用程序切片设备将下载(从应用程序商店)只有实际适合该设备的部分(所以视网膜设备将不会下载非视网膜graphics)。 这就是为什么苹果公司创造了资产目录和遵循这种规则。 他们在会议中描述。

简而言之就是减less内存/磁盘的使用量,所有这一切都是为了提高性能和用户体验

首先,你需要知道点与像素的行为。 在非视网膜设备上,点与像素的比例是1 点= 1像素。 在视网膜设备上,有两个比率:1 点= 2×2像素,取决于屏幕尺寸,1 点= 3×3像素,因为像素密度,在非视网膜上四倍。
这就是为什么你需要这3种types的图像,以最高的分辨率显示。

补充了苏丹所说的话:

由于您没有为特定设备提供适当的图像,因此不得不缩小或升级。 这些过程耗尽你的内存和处理,从而导致性能下降,这取决于你一次做多less个图像和图像的大小。

如果你只提供一个大的图像,你会遇到几个问题:

  1. 降尺度导致质量损失(即使不是很大)
  2. 缩小图像需要更多的计算能力,而不是显示已经预先渲染的图像
  3. 二进制文件的大小会增加,而且无法从iOS 9中引入的应用程序稀疏中受益。

正如你所看到的,只生成一个图像将影响你的应用程序的性能和质量,它将不成比例地击中那些较旧的设备。 这是因为:

  1. 他们需要更多的缩减。 此外,他们的设备的性能不如新的,所以他们更有可能注意到你的应用程序的滞后
  2. 他们没有太多的存储空间,所以你真的希望能够使用应用程序细化来帮助他们
  3. 质量损失将是最高的,并考虑到他们的设备分辨率低,他们会注意到这一点。

由于这个用户可能会不高兴,这对你不好。 因为根据我的经验,不满意的用户比快乐的用户评价您的应用的可能性高10倍。 你不要那个,是吗? 🙂

谢谢大家的意见。 我现在了解得更多了,我想我将不得不多花一些钱,尤其是那些我还没有看过的资产。 似乎是大多数基于我在网上的研究做的。 也不知道苹果从资产中select了可以在后台使用的图片。 我不得不在更多的印象,以便手动select你想要使用的每个设备和代码,但它看起来更简单。