IOS - 将背景图像缩放到不同的屏幕尺寸并将标签放在固定位置上

Posted 2023-03-14

【中文标题】IOS - 将背景图像缩放到不同的屏幕尺寸并将标签放在固定位置上

【英文标题】：IOS - Scale background image to different screen sizes and put label on fixed position on it

【发布时间】：2016-07-31 12:32:49

【问题描述】：

这是我的第一个 ios 应用，我正在使用 Swift。 我有一个图像，我想将其作为背景图像放置到屏幕上， 我已将其模式设置为缩放以填充（以填充整个屏幕）并将其约束（上、左、右、下）设置为：0，然后检查纵横比。我的问题是在我的背景上，我必须在特定部分中添加标签才能查看一些文本。在将标签的约束设置在那些固定位置并在不同设备上运行应用程序之后，标签不在其位置。我搜索了如何使用自动布局以及如何为标签和背景图像设置约束，但没有得到任何有用的结果。 请提供任何帮助。This image shows the problem

【问题讨论】：

由于不同的设备会有不同的屏幕尺寸，因此您的标签位置可能会在不同的设备上发生变化。一个简单的解决方案是使用该图像中所需的标签内容修改图像本身，并在应用程序中使用此修改后的图像。

请张贴截图说明问题。

@Meet，我的应用程序的想法是，当用户向右或向左滑动时，标签中的文本会发生变化。标签不包含固定文本。

@Shubhank，我编辑我的问题。您将在链接中找到一张图片

【参考方案1】：

同步拉伸和标签的图像非常困难。 您可以不将图像用作背景，而仅将其用作 UI 元素的一部分。您应该在此 i​​mageView 和您的标签之间进行约束。对于背景，您可以使用另一个 imageView。

【讨论】：

它可以工作，但图像周围有很多空白，特别是在 iPad 上预览时，我的界面看起来不太好。

好的。以这样的方式尝试：ddd UIView，它将是 ImageView 和 Labels 的容器 View。将容器视图的顶部、底部约束添加到 ViewController 的主视图。

【参考方案2】：

为您的问题找到了一个非常可行的解决方案。 1) 从设计师那里截取一个精确尺寸的剪裁，因为现在我已经裁剪了你的图像。 2）在中心放置一个imageView，将图像添加到imageView，然后只放置两个约束，即水平放置在容器中，垂直放置在容器中，并且只需使用更新帧。它所做的是将 imageView 设置为图像的确切大小。 3）现在在imageView的左上角放置一个标签，右键单击标签，将鼠标从标签向下拖动到imageView，从选项中添加选择前导。再次右键单击鼠标并将其从标签向右拖动到imageView 并选择顶部，然后简单地更新帧。

Label 和 imageView 在两个约束下都可以正常工作。现在您的标签将始终处于准确位置，现在您可以将其他切口相对于主 imageView 放置在中心。

【讨论】：

您到底面临什么问题？

对于图像视图，我根据视图添加了 0,0,0,0 约束，它是要填充的模式比例，对于标签，请按照您所说的进行，但标签不在我想要的位置图像，因为根据屏幕尺寸和标签位置拉伸的图像与图像的拉伸不匹配。

在 [e-mail] 上分享我要完成的图像和屏幕，我将为您提供一个满足您要求的示例应用程序。