IOS 8 图片缩放和自动布局

IOS 8 image scaling and auto layout

假设我有一个 UIView,只有一张图像位于 UIView 的顶部居中,我为图像提供了一个图像资产,就像这样

很明显图像的宽度和高度随着设备的不同而增加,所以问题是我如何处理自动布局,我应该将宽度和高度限制设置为大于或等于还是什么?还有我如何处理图像本身的定位?最后我注意到 IOS 模拟器总是对不同的设备使用相同的图像,这是我的错误还是问题?

首先观看简介:WWDC2014 的界面生成器中的新增功能https://developer.apple.com/videos/wwdc/2014/ 并查看针对不同屏幕尺寸(大、小、默认)设计不同的 UI。

在界面生成器中,您应该使用最小的约束 - 50x50 并输入正确的图像名称。然后只需添加带有@2x @3x 前缀的其他图像,系统将根据您使用的设备使用它们。

屏幕上 UI 图像的实际 width/height 是以点而非像素定义的。提供了图像源,@2x、@3x 等,以便为更高分辨率的屏幕提供所需的额外像素精度。例如1x1pt 在所有屏幕上都相同,但显示高质量图像所需的像素对于@1x 为 1x1,对于@2x 为 2x2,对于@3x 为 3x3。

因此,使用以磅为单位的宽度和高度来定义您的布局。除了为实际设备的不同分辨率提供版本之外,您真的不需要担心原始图像像素。

您需要担心的主要考虑因素是图像在屏幕上缩放时的外观。完美的图像是通过以点为单位设置宽度和高度以匹配@1x 图像的像素宽度和高度来实现的。这样你就知道当它使用@2x 和@3x 时你在屏幕上的像素是完美的。使点的宽度和高度大于或小于原始图像分辨率将导致缩放或缩小图像,这会对图像的清晰度产生一些影响。

为此,您需要了解点和像素之间的区别。我们在 Interface Builder 中设计视图不是以像素而是以点为单位。

1.对于普通屏幕(非视网膜)点 = 像素。

因此,如果我们在界面生成器中将图像视图的高度和宽度设置为 50 * 50 并加载 50 x 50 像素的图像,它会恰到好处,如果我们在 50* 中加载 100 x 100 像素的图像50 imageview 它将重新缩放图像,并且可能会出现一些压缩伪影。

2。对于视网膜显示点 = 2 像素。

因此,对于 50*50 的图像视图,您需要加载 100*100 像素的图像。它看起来会更清晰并且不会出现压缩伪影。

3。对于 6+ 点 = 3 像素。

因此,对于 50*50 的图像视图,您需要加载 150*150 的图像。

图像视图不会像您假设的那样在 6+ 中重新缩放到 150*150。它将是 50*50,但包含 150*150 像素的图像,这将导致超清晰的显示。