如何根据相应的UIImageView的大小确定1x、2x和3x图像尺寸？

Question

我的问题有两个部分：

1）简单明了，我们如何决定1x, 2x和3x的图像尺寸？

我在Stack Overflow上找到了最相关的问题：

what-should-be-3x-images-of-100x100 size UIimageView or UIButton

但是这个问题没有被接受的答案，所以我有点困惑，不知道这是否是正确的。 如果我有一个大小为17 X 21的UIImageView， 那么我的1x是17X21，2x是34X42，而3x则是51X63吗？

2）如果是这样，那么如果我的UIImageView大小随着屏幕大小而变化，那么尺寸会是多少呢？

因此，对于iPhone 4s的320X480，如果我的UIImageView是17X21，对于iPhone 6的375X667，它将是20X29

那么，我如何决定适合所有设备尺寸的图像大小（1x, 2x & 3x）？

附言： 非常感谢您提前的帮助，因为这可能听起来是一个非常基本的问题，但我已经为此苦恼了很久，即使搜索和阅读了很多资料，也找不到一个具体而令人满意的答案。

- GKK

---

是的，除了你数字中的一个打字错误，你是对的。如果你改变图像视图大小，你可能需要改变图像大小，使用最大的可能尺寸，并允许框架自动缩小。 - Wain

是的，感谢指出错别字Wain，已经更正了。 那么您建议我使用一个大尺寸的图像（保持宽高比），让框架来处理剩下的部分？ - GKK

“那么，如果我有一个大小为17 X 21的UIImageView，我的1x是17X21，2x是34X42，3x是51X63吗？”是的。对于iPhone 6，它仍然是相同的2x图像。对于6s，将是3x（3x很困惑，因为在使用时它将被iOS缩小）。但是你为什么要做决定呢？API会自行处理。当您使用UIKit时，所有屏幕坐标都对应于1x分辨率。” - Teddy

你是在询问如何选择特定的图片以适应 iPhone 6/6+ 的较大屏幕和不同的宽高比吗？ - chedabob

有点是，chedabob。 我感到困惑，因为通常我们根据 UIImageView 的尺寸来决定 1x、2x、3x 图像尺寸，但即使 UIImageView 的尺寸随着屏幕尺寸的变化而改变。 - GKK

Answer 1

你应该以点为单位思考，而不是像素。

1

如果你的 UIImageView 大小为 17x21 点，那么你需要提供三张图片，大小分别为 17x21 像素、34x42 像素和 51x63 像素。操作系统会根据设备的像素密度选择正确的图片。

2

决定 UI 元素的大小可以使用类似 Graphic 的软件。你可以画一个代表屏幕和 UI 元素的矩形，只考虑点来进行绘制。这样应该会更容易些。

- Luca Angeletti

---

谢谢appzYourLife，但实际上我的点尺寸会随着设备屏幕大小而改变。 因此，在4s中，我的UIImageView尺寸将为17X21点，但在iPhone 6中，它将为20X29点。 - GKK

Answer 2

有点晚了，但我理解你的问题。

首先，你需要知道点和像素之间的区别。

点是在Xcode中的单位，而像素是实际iPhone屏幕大小的单位。

在4s中，1个像素等于1个点。 在5、Se、6中，1个点等于2个像素。 在6s、7s中，1个点等于3个像素。

我将给你两个不同的例子来帮助你理解这个问题。

示例1：

您想要在Xcode中为所有iPhone设置100x100像素的图像。因此，您应该制作：

在Ps或Sketch中，1x尺寸为100x100像素。 在Ps或Sketch中，2x尺寸为200x200像素。 在Ps或Sketch中，3x尺寸为300x300像素。

另一个例子回答了您的问题。因为您有纵横比，这意味着您希望图像被缩放。

对于4s，您有17x21点，则应为17x21像素。 对于iPhone 6，您有20x29点。它应该是40x58像素。 对于6s和7s，您有某些内容，因此应该是3倍某些内容。

因为你有纵横比和缩放。只要保持1x适用于4s，2x适用于5、6、SE，3x适用于6s和7s，就没有关系了。

所以，对于iPhone 6，您可以使用40x58而不是34x42（17x21）x 2。40x50具有更好的分辨率，这是苹果推荐的。当您使用纵横比时，有时很难选择图像大小。如果您使用32x42而不是40x58，则没有问题，但分辨率会低于40x58。

希望它有效。

- user7411527

---

非常好的观点@user7411527，但我在这里有一点困惑。5/5C/5S/SE不会有不同吗？ - GKK

非常好的观点@user7411527，但我在这里有一点困惑。 5/5C/5S/SE难道不会有与iPhone 6不同大小的图像视图吗？ 这两个类别都使用2倍大小的图像，那么在这种情况下我们如何确定2倍图像呢？例如，如果imageView的大小为17x21，则在4s中它将是17x25，但在6 / 6s中它将是20x29。 那么什么是2倍图像。按照iPhone 5系列，它应该是2 *（17X25），即34x50，而按照6系列，它应该是2 *（20x29），即40x58。 - GKK