Question

最适合图像的尺寸有：background.png，background @ 2x.png和background@3x.png如果我们想要使用此图像来覆盖屏幕的全宽和半高所有iPhone肖像应用程序的解决方案？

这就是我们现在所拥有的：

Device          Points    Pixels     Scale  Physical Pixels   Physical PPI  Size
iPhone X        812x375   2436x1125  3x     2436x1125         458           5.8"
iPhone 6 Plus   736x414   2208x1242  3x     1920x1080         401           5.5"
iPhone 6        667x375   1334x750   2x     1334x750          326           4.7"
iPhone 5        568x320   1136x640   2x     1136x640          326           4.0"
iPhone 4        480x320   960x640    2x     960x640           326           3.5"
iPhone 3GS      480x320   480x320    1x     480x320           163           3.5"

iPhone resolutions

有人说，对于iPhone 6 Plus，对于边缘到边缘的图像（如屏幕从左到右底部的横幅），他们会准备back@3x.png，宽度为1242，iPhone 6为@ 2x宽度为750的.png与iPhone 6的屏幕尺寸相匹配但是我认为这不是一个好主意，因为1242/3 = 414和750/2 = 375所以将它们命名为@ 2x和@ 3x没有意义。然后应该有什么宽度back.png - 375或414？

图形名称使用@ 2x和@ 3x后缀，所以如果例如image@3x.png的分辨率为30x30，那么逻辑上认为image@2x.png应该具有20x20的分辨率，而image.png应该是10x10。这意味着如果我们想要为每个屏幕设置清晰的全宽图像，那么我们可能应该创建back@3x.png，宽度为414 * 3 = 1242px，back @ 2x.png，宽度为414 * 2 = 828px，back.png为宽度414px。然而，这意味着除了iPhone 6 Plus之外的每一部iPhone都需要设置你的uiimages以便使用例如适合内容的内容模式，并且它们将被缩减，因此这又不是一个可行的解决方案，如果可能真的会减慢应用程序的速度我们在旧设备上使用了大量的scalling。

那么您认为解决此问题的最佳解决方案是什么？

Answer 1

如果不使用每个图像，则不必拥有所有图像。只制作您需要的尺寸，并根据宽度命名。对于纵向全设备宽度图像，您需要320x宽1x和2x，375px宽2x和414px宽3x。

4“设备使用”-568h“后缀来命名他们的发布图像，所以我建议使用类似的命名方案：

ImageName-320w（@ 1x＆amp; @ 2x）
ImageName-375w（@ 2x）
ImageName-414w（@ 3x）

然后找出运行时需要的图像：

NSNumber *screenWidth = @([UIScreen mainScreen].bounds.size.width);
NSString *imageName = [NSString stringWithFormat:@"name-%@w", screenWidth];
UIImage *image = [UIImage imageNamed:imageName];

如果将来添加其他宽度，这可能会中断，但到目前为止，Apple一直要求重建应用程序以支持新显示，所以我猜他们会继续这样做是安全的。

Answer 2

我个人会这样做：

ImageName @ 2x iPhone 4 / 4s
ImageName-568h @ 2x iPhone 5 / 5s
ImageName-667h @ 2x iPhone 6
ImageName-736h @ 3x iPhone 6Plus

这背后的逻辑是它显示了所有设备之间的差异，而宽度在iPhone 5s和iPhone 4s上共享相同的值

修改

这只是我用于依赖于设备的资源的命名约定，例如占据整个屏幕的背景图像，大部分时间都是你想要的：

ImageName @ 2x iPhone 4 / 4s / 5 / 5s / 6
ImageName @ 3x iPhone 6Plus /缩放模式

Answer 3

对于@ 2x和@ 3x讨论，你真的不必关心它。关心屏幕的点大小，并确保有两倍点大小的@ 2x资产和@ 3x资产，点数大小为三倍。设备将自动选择正确的。但阅读你的帖子我想你已经知道了。

对于边对边图像，不幸的是你必须为所有屏幕分辨率制作它。因此，对于iPhone的肖像，它将是320点，375点和414点，其中414点必须是@ 3x。更好的解决方案可能是通过在界面构建器中设置切片来使图像可伸缩（如果使用图像目录，则可以）。但是，根据图像，这可能是也可能不是一种选择，取决于图像是否具有可重复或可伸缩的部分。像这样设置的可扩展图像对性能影响很小。

Answer 4

<2> @ 2和@ 3不是真正的图像缩放，而只是表示真实像素代表屏幕上一个虚拟像素的多少，某种来自android宇宙的hdpi / xhdpi / xxhdpi / blabla。它只向系统显示哪些图像应该用于某些设备屏幕。

因此，如果您需要使用整个屏幕图像 - 请根据实际屏幕尺寸进行准备。

Answer 5

在某些情况下，根据图形，当我们仅使用单个图像时，它可能会正常工作，例如大小为414点宽度x 100点高度（最大可能宽度和某些固定高度）的横幅，并将其放入UIImageView中固定在屏幕的左右边缘，具有固定高度100并为该UIImageView设置纵横填充模式。然后在较小的设备上，图像的左侧和右侧将被剪切，我们将只看到图像的中心部分。

Answer 6

我为此创建了类别：

+ (UIImage *)sizedImageWithName:(NSString *)name {
    UIImage *image;
    if (IS_IPHONE_5) {
        image = [UIImage imageNamed:[NSString stringWithFormat:@"%@-568h",name]];
        if (!image) {
            image = [UIImage imageNamed:name];
        }
    }
    else if (IS_IPHONE_6) {
        image = [UIImage imageNamed:[NSString stringWithFormat:@"%@-750w",name]];
    }
    else {
        image = [UIImage imageNamed:name];
    }
    return image;
}

您可以在此处获取完整代码：https://gist.github.com/YGeorge/e0a7fbb479f572b64ba5

Answer 7

我认为边缘到边缘或全屏图像的最佳解决方案是关注像素中的实际屏幕尺寸（不是点），并且必须在运行时检查设备的型号并选择合适的图像，即：

image-iphone4-4s.png (640x960/2) for 1/2 screen height， image-iphone5-5c-5s.png (640x1136/2) for 1/2 screen height， image-iphone6-6s.png (750x1334/2) for 1/2 screen height， image-iphone6plus-6splus.png (1242x2208/2) for 1/2 screen height，

在提问者的这种情况下，不需要@？x。

Answer 8

我认为我们应该为不同的设备使用不同大小的背景图像。只需使用@ 3x比例图像作为背景。

您可以使用以下行检测设备。

#define IS_IPAD (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
#define IS_IPHONE (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone)
#define IS_RETINA ([[UIScreen mainScreen] scale] >= 2.0)

#define SCREEN_WIDTH ([[UIScreen mainScreen] bounds].size.width)
#define SCREEN_HEIGHT ([[UIScreen mainScreen] bounds].size.height)
#define SCREEN_MAX_LENGTH (MAX(SCREEN_WIDTH, SCREEN_HEIGHT))
#define SCREEN_MIN_LENGTH (MIN(SCREEN_WIDTH, SCREEN_HEIGHT))

#define IS_IPHONE_4_OR_LESS (IS_IPHONE && SCREEN_MAX_LENGTH < 568.0)
#define IS_IPHONE_5 (IS_IPHONE && SCREEN_MAX_LENGTH == 568.0)
#define IS_IPHONE_6 (IS_IPHONE && SCREEN_MAX_LENGTH == 667.0)
#define IS_IPHONE_6P (IS_IPHONE && SCREEN_MAX_LENGTH == 736.0)

Answer 9

我个人会这样做：

ImageName@2x iPhone 4/4s
ImageName-568h@2x iPhone 5/5s
ImageName-667h@2x iPhone 6
ImageName-736h@3x iPhone 6Plus

这背后的逻辑是它显示了所有设备之间的差异，而width在iPhone 5s和iPhone 4s上共享相同的值。

这只是我用于依赖于设备的资源的命名约定，例如占据整个屏幕的背景图像，大部分时间都是你想要的：

ImageName@2x iPhone 4/4s/5/5s/6
ImageName@3x iPhone 6Plus/Zoom mode

如何在所有可用的iPhone分辨率上处理图像比例？

9 个答案: