iOS Retina 显示:图像双倍大小

Posted

技术标签:

【中文标题】iOS Retina 显示:图像双倍大小【英文标题】:iOS Retina display: images double size 【发布时间】:2012-02-20 20:40:39 【问题描述】:

为了测试非/视网膜显示,我创建了一个尺寸为 100x100 的 UIView。

我创建了 2 张图片: - 正常尺寸(100x100) - 视网膜尺寸 (200x200)

我有两种情况: 1) 非 Retina 显示 + 背景中的正常尺寸图像 2) Retina display + Retina Size 图片在背景中

第一种情况没问题。 在第二种情况下,图像是双倍大小,在我的 UIView 中,我只能看到总图像的 1/4。

当我尝试将背景图像分配给我的 UIViewController 导航栏时,也会发生同样的情况:

if (IS_RETINA()) 
    [self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:IMG_NAVIGATION_BAR_BACKGROUND_RETINA] forBarMetrics:UIBarMetricsDefault];

else 
    [self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:IMG_NAVIGATION_BAR_BACKGROUND] forBarMetrics:UIBarMetricsDefault];

【问题讨论】:

【参考方案1】:

有一种更简单的方法可以做到这一点。为图像的视网膜版本提供与非视网膜版本相同的名称,但末尾带有“@2x”。例如,如果您的常规图像命名为foo.png,则视网膜版本应命名为foo@2x.png

然后,始终只引用文件名的常规版本(例如,foo.png)。当您的应用程序在非视网膜硬件上运行时,将使用常规图像,但每当您在视网膜硬件上时,将自动使用更高分辨率的图像。这比为您使用的每张图片都写一个 if 语句要容易得多,而且它确实可以工作。

【讨论】:

澄清一下,OP 的问题是他的“视网膜”图像仍在以1 的比例创建,所以它会变得模糊,只显示左上象限。跨度> @KevinBallard 嗯?恐怕我不知道你在说什么。 @user915829 是的,不管是 IB 还是代码,只要参考 foo.pngfoo@2x.png 就会在 Retina 设备上自动使用。【参考方案2】:

您无需编写 IS_RETINA 测试代码,只需将 @2x 后缀添加到包含您要用于视网膜显示的图像的文件的名称中,ios 将自动优先使用它。

捆绑 2 个图像文件,prettyNavBarBackground.png 和 prettyNavBarBackground@2x.png

#define IMG_NAVIGATION_BAR_BACKGROUND prettyNavBarBackground

那么你可以只使用这个单一的调用,iOS会选择合适的选项

[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:IMG_NAVIGATION_BAR_BACKGROUND] forBarMetrics:UIBarMetricsDefault];

【讨论】:

@2x 自动化也适用于代码,还是仅在使用 IB 分配图像时有效? @user915829:也有代码 - 试试吧。您必须在项目中包含 foo.png 和 foo@2x.png 的所有变体。但在代码中,您只引用 foo.png - 其他一切都会自动发生。 是的,代码或 IB - 对于每个图像,iOS 将使用它可以找到的最好的。【参考方案3】:

你不必编写任何代码来区分视网膜和普通硬件。你只需要添加一个“@2x”图像。这将完美无缺。

你不必单独调用这些图像,只需写下文件名即可。

【讨论】:

以上是关于iOS Retina 显示:图像双倍大小的主要内容,如果未能解决你的问题,请参考以下文章

Xcode @2x 图像后缀在 iOS 中未显示为 Retina

iPhone - 我应该为 Retina 和 Not Retina 显示器粘合剂创建 2 个不同尺寸的图像吗?

iOS 7 UINavigationBar Retina 图像大小

字体图标的优缺点

前端二倍图的思考(涉及Retina)

Retina 显示屏中的像素化图像